diff --git a/package-lock.json b/package-lock.json index 1a74721..7db4de0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -25,6 +25,7 @@ "react-bootstrap-range-slider": "^3.0.8", "react-chartjs-2": "^5.3.0", "react-dom": "^19.1.0", + "react-dropzone": "^14.3.8", "react-redux": "^9.2.0", "react-router-dom": "^7.6.0", "redux-persist": "^6.0.0" @@ -1962,6 +1963,14 @@ "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==", "dev": true }, + "node_modules/attr-accept": { + "version": "2.2.5", + "resolved": "https://registry.npmjs.org/attr-accept/-/attr-accept-2.2.5.tgz", + "integrity": "sha512-0bDNnY/u6pPwHDMoF0FieU354oBi0a8rD9FcsLwzcGWbc8KS8KPIi7y+s13OlVY+gMWc/9xEMUgNE6Qm8ZllYQ==", + "engines": { + "node": ">=4" + } + }, "node_modules/balanced-match": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", @@ -2790,6 +2799,17 @@ "node": ">=16.0.0" } }, + "node_modules/file-selector": { + "version": "2.1.2", + "resolved": "https://registry.npmjs.org/file-selector/-/file-selector-2.1.2.tgz", + "integrity": "sha512-QgXo+mXTe8ljeqUFaX3QVHc5osSItJ/Km+xpocx0aSqWGMSCf6qYs/VnzZgS864Pjn5iceMRFigeAV7AfTlaig==", + "dependencies": { + "tslib": "^2.7.0" + }, + "engines": { + "node": ">= 12" + } + }, "node_modules/fill-range": { "version": "7.1.1", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", @@ -4037,6 +4057,22 @@ "react": "^19.1.0" } }, + "node_modules/react-dropzone": { + "version": "14.3.8", + "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-14.3.8.tgz", + "integrity": "sha512-sBgODnq+lcA4P296DY4wacOZz3JFpD99fp+hb//iBO2HHnyeZU3FwWyXJ6salNpqQdsZrgMrotuko/BdJMV8Ug==", + "dependencies": { + "attr-accept": "^2.2.4", + "file-selector": "^2.1.0", + "prop-types": "^15.8.1" + }, + "engines": { + "node": ">= 10.13" + }, + "peerDependencies": { + "react": ">= 16.8 || 18.0.0" + } + }, "node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", diff --git a/package.json b/package.json index f9ca440..f62ac6c 100644 --- a/package.json +++ b/package.json @@ -27,6 +27,7 @@ "react-bootstrap-range-slider": "^3.0.8", "react-chartjs-2": "^5.3.0", "react-dom": "^19.1.0", + "react-dropzone": "^14.3.8", "react-redux": "^9.2.0", "react-router-dom": "^7.6.0", "redux-persist": "^6.0.0" diff --git a/src/pages/CampaignScript.jsx b/src/pages/CampaignScript.jsx index 3152304..487bb12 100644 --- a/src/pages/CampaignScript.jsx +++ b/src/pages/CampaignScript.jsx @@ -1,6 +1,8 @@ import { useDispatch, useSelector } from 'react-redux'; -import { useEffect, useState } from 'react'; -import { Form } from 'react-bootstrap'; +import { useCallback, useEffect, useState } from 'react'; +import { Button, Card, Col, Form, Row } from 'react-bootstrap'; +import { CloudUpload, Paperclip } from 'lucide-react'; +import { useDropzone } from 'react-dropzone'; export default function CampaignScript() { const dispatch = useDispatch(); @@ -75,7 +77,7 @@ export default function CampaignScript() { Campaigns & Collaborated Creators -
Supported format: PNG, JPG, CSV, PDF, DOCX, PPTX
+OR
+ Browse files +