From 96f3bb7f3a6fd0f69c2b3a8f2c54016a317f459f Mon Sep 17 00:00:00 2001 From: Dan Head Date: Sun, 7 Feb 2021 15:08:22 +0000 Subject: [PATCH] feat(dropzone): remove --- package-lock.json | 30 ---------- package.json | 1 - src/components/custom-dropzone.js | 96 ------------------------------- src/components/index.js | 1 - 4 files changed, 128 deletions(-) delete mode 100644 src/components/custom-dropzone.js diff --git a/package-lock.json b/package-lock.json index 5077624..1721e1c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3178,11 +3178,6 @@ "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz", "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==" }, - "attr-accept": { - "version": "2.2.2", - "resolved": "https://registry.npmjs.org/attr-accept/-/attr-accept-2.2.2.tgz", - "integrity": "sha512-7prDjvt9HmqiZ0cl5CRjtS84sEyhsHP2coDkaZKRKVfCDo9s7iw7ChVmar78Gu9pC4SoR/28wFu/G5JJhTnqEg==" - }, "autoprefixer": { "version": "9.8.6", "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-9.8.6.tgz", @@ -7885,21 +7880,6 @@ } } }, - "file-selector": { - "version": "0.2.4", - "resolved": "https://registry.npmjs.org/file-selector/-/file-selector-0.2.4.tgz", - "integrity": "sha512-ZDsQNbrv6qRi1YTDOEWzf5J2KjZ9KMI1Q2SGeTkCJmNNW25Jg4TW4UMcmoqcg4WrAyKRcpBXdbWRxkfrOzVRbA==", - "requires": { - "tslib": "^2.0.3" - }, - "dependencies": { - "tslib": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.1.0.tgz", - "integrity": "sha512-hcVC3wYEziELGGmEEXue7D75zbwIIVUMWAVbHItGPx0ziyXxrOMQx4rQEVEV45Ut/1IotuEvwqPopzIOkDMf0A==" - } - } - }, "file-type": { "version": "12.4.2", "resolved": "https://registry.npmjs.org/file-type/-/file-type-12.4.2.tgz", @@ -15494,16 +15474,6 @@ "scheduler": "^0.20.1" } }, - "react-dropzone": { - "version": "11.2.4", - "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-11.2.4.tgz", - "integrity": "sha512-EGSvK2CxFTuc28WxwuJCICyuYFX8b+sRumwU6Bs6sTbElV2HtQkT0d6C+HEee6XfbjiLIZ+Th9uji27rvo2wGw==", - "requires": { - "attr-accept": "^2.2.1", - "file-selector": "^0.2.2", - "prop-types": "^15.7.2" - } - }, "react-error-overlay": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-3.0.0.tgz", diff --git a/package.json b/package.json index 1f68efd..c23234e 100644 --- a/package.json +++ b/package.json @@ -34,7 +34,6 @@ "jszip": "^3.5.0", "react": "^17.0.1", "react-dom": "^17.0.1", - "react-dropzone": "^11.2.4", "react-helmet": "^6.1.0", "react-slick": "^0.27.13", "slick-carousel": "^1.8.1" diff --git a/src/components/custom-dropzone.js b/src/components/custom-dropzone.js deleted file mode 100644 index 1161f4c..0000000 --- a/src/components/custom-dropzone.js +++ /dev/null @@ -1,96 +0,0 @@ -import React, { useCallback, useState } from "react"; -import { useDropzone } from "react-dropzone"; -import JSZip from "jszip"; -import styled from "@emotion/styled"; -import { Text } from "."; - -const Container = styled.div` - border: 1px solid var(--color-dark); - margin-bottom: var(--spacing-y-sm); - padding: var(--spacing-y-sm) var(--spacing-x-sm) 0; - - &:focus { - outline: 0; - box-shadow: 0 0 0 2px var(--color-dark); - } - - &:focus:not(:focus-visible) { - box-shadow: none; - } -`; - -const Message = styled.div` - border: 3px dashed var(--color-mid-grey); - padding: var(--spacing-y-md) var(--spacing-x-sm); - margin-bottom: var(--spacing-y-sm); - text-align: center; -`; - -const Files = styled.div` - margin-bottom: var(--spacing-y-sm); -`; - -const List = styled.ul` - margin: 0 0 var(--spacing-y-sm); - list-style: circle; -`; - -export default function CustomDropzone({ name, files, setFiles, ...other }) { - const [fileList, setFileList] = useState([]); - const onDrop = useCallback(acceptedFiles => { - setFileList(acceptedFiles.map(file => file.path)); - if (acceptedFiles.length > 1) { - const zip = new JSZip(); - acceptedFiles.forEach(file => zip.file(file.name, file)); - zip.generateAsync({ type: "blob" }).then(blob => { - const zippedFiles = new File([blob], "files.zip", { - lastModified: Date.now(), - type: "application/zip" - }); - setFiles(zippedFiles); - }); - } else { - setFiles(acceptedFiles[0]); - } - }, []); - const { getRootProps, getInputProps, isDragActive } = useDropzone({ - accept: "image/jpeg, image/png", - maxFiles: 5, - onDrop - }); - return ( - - - - {isDragActive ? ( - Drop the images here - ) : ( - <> - - Drop your images here, or click to select the files - - - (5 files maximum, *.jpg and *.png only) - - - )} - - {fileList.length > 0 && ( - - - Files added: - - - {fileList.map(file => ( -
  • - - {file} - -
  • - ))} -
    -
    - )} -
    - ); -} diff --git a/src/components/index.js b/src/components/index.js index a2a0d91..f558c45 100644 --- a/src/components/index.js +++ b/src/components/index.js @@ -1,7 +1,6 @@ export { default as Button } from "./button"; export { default as Card } from "./card"; export { default as Content } from "./content"; -export { default as CustomDropzone } from "./custom-dropzone"; export { default as CustomGallery } from "./custom-gallery"; export { default as CustomSlick } from "./custom-slick"; export { default as Footer } from "./footer";