Skip to content
Snippets Groups Projects
Commit 0bd80d9f authored by Jose Manuel Serrano Amaut's avatar Jose Manuel Serrano Amaut
Browse files

DEPLOY test

parent deb9c6c5
No related branches found
No related tags found
No related merge requests found
Showing
with 3945 additions and 98 deletions
Captura de pantalla (3946).png

343 KiB

# Getting Started with Create React App # Files ui
<p align="center">
<img src="https://user-images.githubusercontent.com/43678736/202515913-dceafe68-d99b-42c0-b797-7057008928e0.png" width="150" height="150" alt="fui-logo"/></p>
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
......
We're kicking it off with the most powerful
Data Grid on the market..
Production-ready
in minutes
Fully built
templates for your app.
Superiorly designed software
Superiorly designed software
![files-ui-logo - arrow-samsung-4](https://user-images.githubusercontent.com/43678736/206890624-c81dde04-1cf0-45b6-a8f0-9553b0b11692.png)
![Logo-readme](https://user-images.githubusercontent.com/43678736/206890639-604712fd-1b92-44a5-b0b5-2979bc0d2558.png)
code . && exit
\ No newline at end of file
Source diff could not be displayed: it is too large. Options to address this: view the blob.
...@@ -3,12 +3,25 @@ ...@@ -3,12 +3,25 @@
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"dependencies": { "dependencies": {
"@dynamicss/dynamicss": "^2.2.8",
"@emotion/react": "^11.10.5",
"@emotion/styled": "^11.10.5",
"@mui/icons-material": "^5.10.14",
"@mui/material": "^5.10.14",
"@testing-library/jest-dom": "^5.16.5", "@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0", "@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0", "@testing-library/user-event": "^13.5.0",
"@types/react": "^18.0.25",
"axios": "^1.3.1",
"node-sass": "^7.0.3",
"rc-highlight": "^2.3.4",
"react": "^18.2.0", "react": "^18.2.0",
"react-dom": "^18.2.0", "react-dom": "^18.2.0",
"react-router": "^6.4.3",
"react-router-dom": "^6.4.3",
"react-scripts": "5.0.1", "react-scripts": "5.0.1",
"sweetalert": "^2.1.2",
"typescript": "^4.9.3",
"web-vitals": "^2.1.4" "web-vitals": "^2.1.4"
}, },
"scripts": { "scripts": {
......
public/files-ui-ico-nb.ico

6.8 KiB

public/files-ui-logo-arrow.ico

9.15 KiB

public/files-ui-logo.ico

10.1 KiB

public/icons/files-ui-logo-blue-ico.ico

9.61 KiB

public/icons/files-ui-logo-blue-wbg-ico.ico

11.6 KiB

public/icons/files-ui-logo-white-bbg-ico.ico

12.6 KiB

public/icons/files-ui-logo-white-ico.ico

4.1 KiB

<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<!-- <script defer src="https://app.embed.im/snow.js"></script>
-->
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> <link rel="icon" href="%PUBLIC_URL%/icons/files-ui-logo-blue-ico.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" /> <meta name="theme-color" content="#000000" />
<meta <!-- <meta
name="description" name="description"
content="Web site created using create-react-app" content="Web site created using create-react-app"
/> /> -->
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" /> <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will <title>Files-ui: File upload react library</title>
work correctly both with client-side routing and a non-root public URL. <meta
Learn how to configure a non-root public URL by running `npm run build`. name="description"
--> content="Files UI is a library of React components for managing file uploads, previews and more. Make the file upload task easy for developers and end-users."
<title>React App</title> />
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <!-- <noscript>You need to enable JavaScript to run this app.</noscript> -->
<div id="root"></div> <div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body> </body>
</html> </html>
...@@ -2,6 +2,11 @@ ...@@ -2,6 +2,11 @@
"short_name": "React App", "short_name": "React App",
"name": "Create React App Sample", "name": "Create React App Sample",
"icons": [ "icons": [
{
"src": "files-ui-ico-nb.ico",
"sizes": "256x256",
"type": "image/x-icon"
},
{ {
"src": "favicon.ico", "src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16", "sizes": "64x64 32x32 24x24 16x16",
......
ref mt.png

193 KiB

import logo from './logo.svg'; //import logo from './static/files-ui-logo - arrow-samsung-2.png';
import './App.css'; import './App.css';
function App() { function App() {
return ( return (
<div className="App"> <div className="App">
<nav className="filesui-nav">
</nav>
<main className="filesui-main">
</main>
<footer className="filesui-footer">
</footer>
<header className="App-header"> <header className="App-header">
<img src={logo} className="App-logo" alt="logo" /> {/* <img src={logo} className="App-logo" alt="logo" />
<p> */} <p>
Edit <code>src/App.js</code> and save to reload. Edit <code className="code">src/App.js</code> and save to reload.
</p> </p>
<a <a
className="App-link" className="App-link"
......
import * as React from "react";
const DropzoneDemoBasic = props =>{
return(
<div>
DropzoneDemoBasic
</div>
)
}
export default DropzoneDemoBasic;
\ No newline at end of file
import * as React from "react";
const DropzoneDemoRiple = props =>{
return(
<div>
</div>
)
}
export default DropzoneDemoRiple;
\ No newline at end of file
import * as React from "react";
import { Dropzone } from "../files-ui/components";
import { FileMosaic } from "../files-ui/components/file-mosaic";
import DescParagraph from "./demo-components/desc-paragraph/DescParagraph";
import SubTitle from "./demo-components/sub-title/SubTitle";
const reactFile = {
id: "acsacasf",
name: "A very very long title for files-ui.jsx",
type: "text/plain",
size: 280000,
};
const baseFiles = [reactFile];
const DropzoneMainPage = ({ darkMode = false }) => {
const [files, setFiles] = React.useState(baseFiles);
const updateFiles = (incommingFiles) => {
//do something with the files
console.log("MainPage incommingFiles",incommingFiles);
setFiles(incommingFiles);
//even your own upload implementation
};
const removeFile = (id) => {
setFiles(files.filter((x) => x.id !== id));
};
const handleSee = (imageSource) => {
console.log("handleSee-imageSource");
};
return (
<React.Fragment>
<SubTitle content={"Try this out!"} darkMode={darkMode} />
<DescParagraph darkMode={darkMode}>
Have fun with files-ui. Just drag'n drop some files and see the magic
happens
</DescParagraph>
<Dropzone
style={{ borderRadius: "16px" }}
// minHeight="400px"
onChange={updateFiles}
value={files}
maxFileSize={28*1024}
maxFiles={4}
accept=".jpg, .png, application/json, video/*"
fakeUpload
behaviour="add"
//uploadConfig={{ autoUpload: true, url:"fdbd" }}
>
{files.length > 0 &&
files.map((file) => (
<FileMosaic
darkMode={darkMode}
{...file}
preview
onDelete={removeFile}
key={file.id}
info
alwaysActive
hd
onSee={handleSee}
/>
))}
</Dropzone>
<DescParagraph margin="10px 0" darkMode={darkMode}>
<b>Note: </b> Files are not actually uploaded, this is just a demo :D
</DescParagraph>
</React.Fragment>
);
};
export default DropzoneMainPage;
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment