From 48c545546a4afd6db9e3644c104c6ea32cf75465 Mon Sep 17 00:00:00 2001
From: Jose Manuel Serrano Amaut <a20122128@pucp.pe>
Date: Mon, 27 Feb 2023 18:29:02 -0500
Subject: [PATCH] [REF]: Add onAbort to File mosaic in advanced example
---
.../dropzone-demo/AdvancedDropzoneDemo.jsx | 25 +++++++++++++------
1 file changed, 17 insertions(+), 8 deletions(-)
diff --git a/src/components/demo-components/dropzone-demo/AdvancedDropzoneDemo.jsx b/src/components/demo-components/dropzone-demo/AdvancedDropzoneDemo.jsx
index 12665f2..3ea4d20 100644
--- a/src/components/demo-components/dropzone-demo/AdvancedDropzoneDemo.jsx
+++ b/src/components/demo-components/dropzone-demo/AdvancedDropzoneDemo.jsx
@@ -15,9 +15,7 @@ export default function AdvancedDropzoneDemo() {
const [extFiles, setExtFiles] = useState([]);
const [imageSrc, setImageSrc] = React.useState(undefined);
- const [videoSrc, setVideoSrc] = React.useState(
- undefined
- );
+ const [videoSrc, setVideoSrc] = React.useState(undefined);
const updateFiles = (incommingFiles) => {
console.log("incomming extFiles", incommingFiles);
@@ -35,15 +33,15 @@ export default function AdvancedDropzoneDemo() {
const handleFinish = (res) => {
console.log("finish", res);
};
- const handleWatch = (videoSource) => {
+ const handleWatch = (videoSource) => {
console.log(
"handleWatch videoSource",
"https://files-ui-temp-storage.s3.amazonaws.com/2029385a4ed32ff10beeb94c0585e8ac1a8c377c68d22ef25ce5863694a5499e.mp4"
);
//setVideoSrc(videoSource);
- //
- setVideoSrc(videoSource);
- // setVideoSrc("https://www.w3schools.com/tags/movie.mp4");
+ //
+ setVideoSrc(videoSource);
+ // setVideoSrc("https://www.w3schools.com/tags/movie.mp4");
};
useEffect(() => {
@@ -57,6 +55,16 @@ export default function AdvancedDropzoneDemo() {
console.log("checkFiles error", error);
}
}
+ const handleAbort = (id) => {
+ // alert(id);
+ setExtFiles(
+ extFiles.map((ef) => {
+ if (ef.id === id) {
+ return { ...ef, uploadStatus: undefined };
+ } else return { ...ef };
+ })
+ );
+ };
return (
<>
<Dropzone
@@ -67,7 +75,7 @@ export default function AdvancedDropzoneDemo() {
/* maxFiles={3}
maxFileSize={2998000 * 20} */
label="Drag'n drop files here or click to browse"
- // accept=".png,image/*, video/*"
+ // accept=".png,image/*, video/*"
uploadConfig={{
/* autoUpload: true */
method: "POST",
@@ -98,6 +106,7 @@ export default function AdvancedDropzoneDemo() {
onDelete={onDelete}
onSee={handleSee}
onWatch={handleWatch}
+ onAbort={handleAbort}
resultOnTooltip
alwaysActive
preview
--
GitLab