From 7401ac3a65b6a2d0d8490b5b24362223970a4e16 Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Mon, 30 Jan 2023 11:21:30 +0100 Subject: [PATCH 01/15] fix: autoupload --- src/components/FileUpload/FileUpload.const.js | 1 + src/components/FileUpload/FileUpload.jsx | 33 ++++++++++++++++--- .../FileUpload/FileUpload.stories.mdx | 31 ++++++++++++++++- .../FileUploadZone/FileUploadZone.jsx | 27 ++++++++++++--- 4 files changed, 81 insertions(+), 11 deletions(-) diff --git a/src/components/FileUpload/FileUpload.const.js b/src/components/FileUpload/FileUpload.const.js index 654465d..9fab7c0 100644 --- a/src/components/FileUpload/FileUpload.const.js +++ b/src/components/FileUpload/FileUpload.const.js @@ -11,4 +11,5 @@ export const UPLOAD_OPTIONS_DEFAULT = { maxFileSize: 0, // 0 is infinite url: '', messages: VALIDATION_MESSAGES_DEFAULT, + autoUpload: true, }; diff --git a/src/components/FileUpload/FileUpload.jsx b/src/components/FileUpload/FileUpload.jsx index e480020..2307309 100644 --- a/src/components/FileUpload/FileUpload.jsx +++ b/src/components/FileUpload/FileUpload.jsx @@ -1,5 +1,8 @@ +/* eslint-disable react/require-default-props */ import PropTypes from 'prop-types'; -import React, { useEffect, useMemo, useState } from 'react'; +import React, { + forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState, +} from 'react'; import { isNumber } from '../../helpers'; import { useSlot } from '../../hooks/useSlot'; @@ -10,7 +13,7 @@ import { FileUploadZone } from './FileUploadZone'; import { Uploader } from './Uploader'; import { ValidationList } from './ValidationList'; -const FileUpload = ({ +const FileUpload = forwardRef(({ id = '', ariaLabelRemove = 'Verwijder', disabled = false, @@ -19,7 +22,7 @@ const FileUpload = ({ selectUploadedFiles = () => null, removeFile = () => null, children, -}) => { +}, ref) => { /** * Hooks */ @@ -27,6 +30,14 @@ const FileUpload = ({ const fileUploadMessageSlot = useSlot(FileUploadMessage, children); const [uploader, setUploader] = useState(null); const [invalidFiles, setInvalidFiles] = useState([]); + const [queuedFiles, setQueuedFiles] = useState([]); + const uploadZoneRef = useRef(); + + useImperativeHandle(ref, () => ({ + startUpload() { + uploadZoneRef.current.uploadFiles(queuedFiles); + }, + })); useEffect(() => { if (!uploader) { @@ -49,6 +60,10 @@ const FileUpload = ({ setInvalidFiles(invFiles); }; + const onQueuedFiles = (qFiles) => { + setQueuedFiles(qFiles); + }; + const onRequestError = (error) => { setInvalidFiles(error.files.map((file) => ({ file, @@ -91,7 +106,10 @@ const FileUpload = ({ return (
) } - { renderFiles(files) } + { renderFiles([...files, ...queuedFiles]) }
); -}; +}); FileUpload.propTypes = { id: PropTypes.string.isRequired, disabled: PropTypes.bool, ariaLabelRemove: PropTypes.string, options: PropTypes.shape({ + autoUpload: PropTypes.bool, allowedMimeTypes: PropTypes.arrayOf(PropTypes.string), allowedFileTypes: PropTypes.arrayOf(PropTypes.string), maxFileSize: PropTypes.number, @@ -146,6 +165,10 @@ FileUpload.propTypes = { key: PropTypes.string, value: PropTypes.string, }), + requestHeaders: PropTypes.arrayOf(PropTypes.shape({ + key: PropTypes.string, + value: PropTypes.string, + })), }), files: PropTypes.arrayOf(PropTypes.shape({ id: PropTypes.string.isRequired, diff --git a/src/components/FileUpload/FileUpload.stories.mdx b/src/components/FileUpload/FileUpload.stories.mdx index ab8132b..fa3941d 100644 --- a/src/components/FileUpload/FileUpload.stories.mdx +++ b/src/components/FileUpload/FileUpload.stories.mdx @@ -1,4 +1,4 @@ -import { useState, useMemo } from 'react'; +import { useState, useMemo, useRef } from 'react'; import { action } from '@storybook/addon-actions' import { Meta, Story, Preview, Props } from '@storybook/addon-docs/blocks'; @@ -183,6 +183,35 @@ A file upload component ) }} + + {() => { + const [files, setFiles] = useState([]); + const ref = useRef(); + return ( + <> + setFiles(files.filter(file => file.id === id))} + selectUploadedFiles={action()} + > + Drag your files here or click to upload + Optional description message + + + + ) + }} + ## Props diff --git a/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx b/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx index d403231..b3db4d8 100644 --- a/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx +++ b/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx @@ -1,13 +1,16 @@ +/* eslint-disable react/require-default-props */ import classnames from 'classnames'; import PropTypes from 'prop-types'; -import React, { useMemo, useRef, useState } from 'react'; +import React, { + forwardRef, useImperativeHandle, useMemo, useRef, useState, +} from 'react'; import { useSlot } from '../../../hooks/useSlot'; import { ProgressBar } from '../../ProgressBar'; import { FileUploadDescription, FileUploadMessage } from '../FileUpload.slots'; import { Uploader } from '../Uploader'; -const FileUploadZone = ({ +const FileUploadZone = forwardRef(({ autoUpload = true, id = '', ariaId = '', @@ -18,12 +21,12 @@ const FileUploadZone = ({ onCustomDrop, uploadedFiles = () => null, invalidFiles = () => null, + queuedFiles = () => null, onRequestError = () => null, allowedMimeTypes = [], allowedFileTypes = [], children, - -}) => { +}, ref) => { /** * Hooks */ @@ -36,6 +39,13 @@ const FileUploadZone = ({ const accept = useMemo(() => allowedFileTypes.map((type) => `.${type}`).concat(allowedMimeTypes).join(','), [allowedFileTypes, allowedMimeTypes]); + useImperativeHandle(ref, () => ({ + uploadFiles(files) { + // eslint-disable-next-line no-use-before-define + uploadFiles(files); + }, + })); + /** * Methods */ @@ -49,6 +59,7 @@ const FileUploadZone = ({ const uploadFiles = (files) => { // Reset progress + queuedFiles([]); setUploadProgress(0); setUploadingFiles(files); @@ -95,9 +106,14 @@ const FileUploadZone = ({ if (customHandler) { customHandler(response.validFiles); } + if (autoUpload && response.validFiles.length > 0) { uploadFiles(response.validFiles); } + + if (!autoUpload && response.validFiles.length > 0) { + queuedFiles(response.validFiles); + } }; const handleCustomClick = (e) => { @@ -200,7 +216,7 @@ const FileUploadZone = ({ ); -}; +}); FileUploadZone.propTypes = { autoUpload: PropTypes.bool, @@ -211,6 +227,7 @@ FileUploadZone.propTypes = { ariaId: PropTypes.string, uploadedFiles: PropTypes.func, invalidFiles: PropTypes.func, + queuedFiles: PropTypes.func, onRequestError: PropTypes.func, onCustomClick: PropTypes.func, onCustomDrop: PropTypes.func, From 354d9bf5f56cc12de5b4385a7fcf4c6a40780783 Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Mon, 30 Jan 2023 12:49:04 +0100 Subject: [PATCH 02/15] feat: more headers --- src/components/FileUpload/FileUpload.stories.mdx | 9 ++++++++- src/components/FileUpload/Uploader/uploader.class.js | 6 ++++++ 2 files changed, 14 insertions(+), 1 deletion(-) diff --git a/src/components/FileUpload/FileUpload.stories.mdx b/src/components/FileUpload/FileUpload.stories.mdx index fa3941d..2767899 100644 --- a/src/components/FileUpload/FileUpload.stories.mdx +++ b/src/components/FileUpload/FileUpload.stories.mdx @@ -198,7 +198,14 @@ A file upload component maxFileSize: 5000000000000000, url: 'api/upload', fileLimit: 3, - autoUpload: false + autoUpload: false, + requestHeaders: [{ + key: 'x-custom-header-1', + value: 'value-1' + }, { + key: 'x-custom-header-2', + value: 'value-2' + }] }} files={files} removeFile={(id, index) => setFiles(files.filter(file => file.id === id))} diff --git a/src/components/FileUpload/Uploader/uploader.class.js b/src/components/FileUpload/Uploader/uploader.class.js index 0763439..4208b08 100644 --- a/src/components/FileUpload/Uploader/uploader.class.js +++ b/src/components/FileUpload/Uploader/uploader.class.js @@ -52,6 +52,12 @@ export class Uploader { xhr.setRequestHeader(this.options.requestHeader.key, this.options.requestHeader.value); } + if (this.options.requestHeaders && Array.isArray(this.options.requestHeaders)) { + this.options.requestHeaders.forEach(({ key, value }) => { + xhr.setRequestHeader(key, value); + }); + } + xhr.send(formData); }); } From 71ccc99863494a19a3e3028767d7d0442d832a83 Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Mon, 30 Jan 2023 12:55:34 +0100 Subject: [PATCH 03/15] 1.5.7-0 --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 15991ce..9765a64 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.6", + "version": "1.5.7-0", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 6abc233..8aa8617 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.6", + "version": "1.5.7-0", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "scripts": { From a4e7e20bb6b2547b7f5688f0d62463cb62e92df4 Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Mon, 30 Jan 2023 13:14:04 +0100 Subject: [PATCH 04/15] fix: lock version --- package-lock.json | 35 +++++++++++++++++++++++++---------- package.json | 2 +- 2 files changed, 26 insertions(+), 11 deletions(-) diff --git a/package-lock.json b/package-lock.json index 9765a64..c1afd10 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19866,7 +19866,7 @@ "parse-srcset": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/parse-srcset/-/parse-srcset-1.0.2.tgz", - "integrity": "sha1-8r0iH2zJcKk42IVWq8WJyqqiveE=" + "integrity": "sha512-/2qh0lav6CmI15FzA3i/2Bzk2zCgQhGMkvhOhKNcBVQ1ldgpbfiNTVslmooUmWJcADi1f1kIeynbDRVzNlfR6Q==" }, "parse5": { "version": "6.0.1", @@ -24692,9 +24692,9 @@ } }, "sanitize-html": { - "version": "2.5.2", - "resolved": "https://registry.npmjs.org/sanitize-html/-/sanitize-html-2.5.2.tgz", - "integrity": "sha512-sJ1rO2YixFIqs2kIcEUb6PTrCjvz8DMq1XqWWuy0kjgjrn58GNLK1DKSIRybFZDO1WNgsEgD+WiEzTEYS8xEug==", + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/sanitize-html/-/sanitize-html-2.4.0.tgz", + "integrity": "sha512-Y1OgkUiTPMqwZNRLPERSEi39iOebn2XJLbeiGOBhaJD/yLqtLGu6GE5w7evx177LeGgSE+4p4e107LMiydOf6A==", "requires": { "deepmerge": "^4.2.2", "escape-string-regexp": "^4.0.0", @@ -24715,15 +24715,30 @@ "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz", "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==" }, + "nanoid": { + "version": "3.3.4", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", + "integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==" + }, + "picocolors": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", + "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==" + }, "postcss": { - "version": "8.3.9", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.9.tgz", - "integrity": "sha512-f/ZFyAKh9Dnqytx5X62jgjhhzttjZS7hMsohcI7HEI5tjELX/HxCy3EFhsRxyzGvrzFF+82XPvCS8T9TFleVJw==", + "version": "8.4.21", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.21.tgz", + "integrity": "sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==", "requires": { - "nanoid": "^3.1.28", - "picocolors": "^0.2.1", - "source-map-js": "^0.6.2" + "nanoid": "^3.3.4", + "picocolors": "^1.0.0", + "source-map-js": "^1.0.2" } + }, + "source-map-js": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", + "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==" } } }, diff --git a/package.json b/package.json index 8aa8617..1535adc 100644 --- a/package.json +++ b/package.json @@ -46,7 +46,7 @@ "react-dom": "^16.13.0", "react-popper": "^2.2.4", "rxjs": "^6.6.3", - "sanitize-html": "^2.4.0" + "sanitize-html": "2.4.0" }, "devDependencies": { "@a-ui/flexboxgrid": "^1.0.1", From da795368c0d7f6f4d660683c14977ef9f5c24650 Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Mon, 30 Jan 2023 13:14:09 +0100 Subject: [PATCH 05/15] 1.5.7-1 --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index c1afd10..5a6488b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.7-0", + "version": "1.5.7-1", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 1535adc..a1a192b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.7-0", + "version": "1.5.7-1", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "scripts": { From b8e21c9fb9165afbbd6a47ad6ce3a7b07f382a8b Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Mon, 30 Jan 2023 14:51:16 +0100 Subject: [PATCH 06/15] feat: pass queued files --- src/components/FileUpload/FileUpload.jsx | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/components/FileUpload/FileUpload.jsx b/src/components/FileUpload/FileUpload.jsx index 2307309..8c6af1b 100644 --- a/src/components/FileUpload/FileUpload.jsx +++ b/src/components/FileUpload/FileUpload.jsx @@ -20,6 +20,7 @@ const FileUpload = forwardRef(({ files = [], options = UPLOAD_OPTIONS_DEFAULT, selectUploadedFiles = () => null, + selectQueuedFiles = () => null, removeFile = () => null, children, }, ref) => { @@ -53,6 +54,14 @@ const FileUpload = forwardRef(({ return true; }, [options.fileLimit, files]); + useEffect(() => { + if (!selectQueuedFiles) { + return; + } + + selectQueuedFiles(queuedFiles); + }, [queuedFiles, selectQueuedFiles]); + /** * Methods */ @@ -175,6 +184,7 @@ FileUpload.propTypes = { name: PropTypes.string.isRequired, })), selectUploadedFiles: PropTypes.func, + selectQueuedFiles: PropTypes.func, removeFile: PropTypes.func, children: PropTypes.node, }; From 217b5170f2b85807e5256455a0877b57d48f0af1 Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Mon, 30 Jan 2023 14:51:21 +0100 Subject: [PATCH 07/15] 1.5.7-2 --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 5a6488b..5d73d2e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.7-1", + "version": "1.5.7-2", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index a1a192b..55f5f5f 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.7-1", + "version": "1.5.7-2", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "scripts": { From b51b74ca668b96dea95770e5f2b0168aa0bb1e3e Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Mon, 30 Jan 2023 15:15:32 +0100 Subject: [PATCH 08/15] feat: add extra headers --- src/components/FileUpload/FileUpload.jsx | 4 ++-- src/components/FileUpload/FileUpload.stories.mdx | 1 + .../FileUpload/FileUploadZone/FileUploadZone.jsx | 9 ++++----- src/components/FileUpload/Uploader/uploader.class.js | 8 +++++++- 4 files changed, 14 insertions(+), 8 deletions(-) diff --git a/src/components/FileUpload/FileUpload.jsx b/src/components/FileUpload/FileUpload.jsx index 8c6af1b..c5cee58 100644 --- a/src/components/FileUpload/FileUpload.jsx +++ b/src/components/FileUpload/FileUpload.jsx @@ -35,8 +35,8 @@ const FileUpload = forwardRef(({ const uploadZoneRef = useRef(); useImperativeHandle(ref, () => ({ - startUpload() { - uploadZoneRef.current.uploadFiles(queuedFiles); + startUpload(extraHeaders) { + uploadZoneRef.current.uploadFiles(queuedFiles, extraHeaders); }, })); diff --git a/src/components/FileUpload/FileUpload.stories.mdx b/src/components/FileUpload/FileUpload.stories.mdx index 2767899..b2c9d63 100644 --- a/src/components/FileUpload/FileUpload.stories.mdx +++ b/src/components/FileUpload/FileUpload.stories.mdx @@ -207,6 +207,7 @@ A file upload component value: 'value-2' }] }} + selectQueuedFiles={(files) => console.log(files)} files={files} removeFile={(id, index) => setFiles(files.filter(file => file.id === id))} selectUploadedFiles={action()} diff --git a/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx b/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx index b3db4d8..49b3cfe 100644 --- a/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx +++ b/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx @@ -40,9 +40,9 @@ const FileUploadZone = forwardRef(({ [allowedFileTypes, allowedMimeTypes]); useImperativeHandle(ref, () => ({ - uploadFiles(files) { + uploadFiles(files, extraHeaders) { // eslint-disable-next-line no-use-before-define - uploadFiles(files); + uploadFiles(files, extraHeaders); }, })); @@ -57,14 +57,13 @@ const FileUploadZone = forwardRef(({ } }; - const uploadFiles = (files) => { + const uploadFiles = (files, extraHeaders) => { // Reset progress - queuedFiles([]); setUploadProgress(0); setUploadingFiles(files); // upload - uploader.uploadFiles(files).subscribe( + uploader.uploadFiles(files, extraHeaders).subscribe( (response) => { if (response.progress) { setUploadProgress(Math.floor(response.progress * 100)); diff --git a/src/components/FileUpload/Uploader/uploader.class.js b/src/components/FileUpload/Uploader/uploader.class.js index 4208b08..d065663 100644 --- a/src/components/FileUpload/Uploader/uploader.class.js +++ b/src/components/FileUpload/Uploader/uploader.class.js @@ -16,7 +16,7 @@ export class Uploader { }; } - uploadFiles(files = []) { + uploadFiles(files = [], extraHeaders) { const formData = this.filesToFormData(files); return new Observable((observer) => { @@ -58,6 +58,12 @@ export class Uploader { }); } + if (extraHeaders && Array.isArray(extraHeaders)) { + extraHeaders.forEach(({ key, value }) => { + xhr.setRequestHeader(key, value); + }); + } + xhr.send(formData); }); } From 95d262a7945c3d9d11349d2b85bc705a21f92574 Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Mon, 30 Jan 2023 15:15:35 +0100 Subject: [PATCH 09/15] 1.5.7-3 --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 5d73d2e..de5b8c6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.7-2", + "version": "1.5.7-3", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 55f5f5f..6269ea9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.7-2", + "version": "1.5.7-3", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "scripts": { From 9b8dd57d66facdb4d96e14f5932e79c7d0da678a Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Tue, 31 Jan 2023 09:28:52 +0100 Subject: [PATCH 10/15] 1.5.7 --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index de5b8c6..97af218 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.7-3", + "version": "1.5.7", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 6269ea9..45c6173 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.7-3", + "version": "1.5.7", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "scripts": { From 1cd31add161e82bdfc910a1c5c6851c5ee8d5907 Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Fri, 3 Feb 2023 09:24:18 +0100 Subject: [PATCH 11/15] feat: add remove --- src/components/FileUpload/FileUpload.jsx | 13 +++++++++++-- .../FileUpload/FileUploadZone/FileUploadZone.jsx | 10 +++++++--- 2 files changed, 18 insertions(+), 5 deletions(-) diff --git a/src/components/FileUpload/FileUpload.jsx b/src/components/FileUpload/FileUpload.jsx index c5cee58..aecb593 100644 --- a/src/components/FileUpload/FileUpload.jsx +++ b/src/components/FileUpload/FileUpload.jsx @@ -36,7 +36,7 @@ const FileUpload = forwardRef(({ useImperativeHandle(ref, () => ({ startUpload(extraHeaders) { - uploadZoneRef.current.uploadFiles(queuedFiles, extraHeaders); + return uploadZoneRef.current.uploadFiles(queuedFiles, extraHeaders); }, })); @@ -84,6 +84,15 @@ const FileUpload = forwardRef(({ setInvalidFiles(invalidFiles.filter((file, i) => i !== index)); }; + const onRemoveFile = (fileId, index): void => { + // If the file is queued, just delete it. + if (!fileId && queuedFiles?.[index]) { + return setQueuedFiles(queuedFiles.filter((_, fIndex) => index !== fIndex)); + } + + removeFile(fileId, index); + }; + /** * Render */ @@ -103,7 +112,7 @@ const FileUpload = forwardRef(({
  • {file.name} -
    • diff --git a/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx b/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx index 49b3cfe..acd7fc7 100644 --- a/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx +++ b/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx @@ -42,7 +42,7 @@ const FileUploadZone = forwardRef(({ useImperativeHandle(ref, () => ({ uploadFiles(files, extraHeaders) { // eslint-disable-next-line no-use-before-define - uploadFiles(files, extraHeaders); + return uploadFiles(files, extraHeaders); }, })); @@ -57,7 +57,7 @@ const FileUploadZone = forwardRef(({ } }; - const uploadFiles = (files, extraHeaders) => { + const uploadFiles = (files, extraHeaders): Promise => new Promise((resolve, reject) => { // Reset progress setUploadProgress(0); setUploadingFiles(files); @@ -89,14 +89,18 @@ const FileUploadZone = forwardRef(({ files, error, }); + + reject(error); }, () => { setUploadProgress(0); setUploadingFiles([]); clearFileInput(); + + resolve(); }, ); - }; + }); const handleFiles = async (files, customHandler) => { const response = await Promise.resolve(uploader.validateFiles(files)); From 25fe4e2af274d119bfcbf1716880f35b443e8dc1 Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Fri, 3 Feb 2023 09:24:24 +0100 Subject: [PATCH 12/15] 1.5.8 --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 97af218..5a763b3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.7", + "version": "1.5.8", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 45c6173..e56b2a8 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.7", + "version": "1.5.8", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "scripts": { From e731c566c2e8c1be17f518544520ca2917437e55 Mon Sep 17 00:00:00 2001 From: Pieterjan Van Saet Date: Fri, 3 Feb 2023 09:25:15 +0100 Subject: [PATCH 13/15] feat: add remove --- src/components/FileUpload/FileUpload.jsx | 2 +- src/components/FileUpload/FileUploadZone/FileUploadZone.jsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/FileUpload/FileUpload.jsx b/src/components/FileUpload/FileUpload.jsx index aecb593..bf8f853 100644 --- a/src/components/FileUpload/FileUpload.jsx +++ b/src/components/FileUpload/FileUpload.jsx @@ -84,7 +84,7 @@ const FileUpload = forwardRef(({ setInvalidFiles(invalidFiles.filter((file, i) => i !== index)); }; - const onRemoveFile = (fileId, index): void => { + const onRemoveFile = (fileId, index) => { // If the file is queued, just delete it. if (!fileId && queuedFiles?.[index]) { return setQueuedFiles(queuedFiles.filter((_, fIndex) => index !== fIndex)); diff --git a/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx b/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx index acd7fc7..3ae9222 100644 --- a/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx +++ b/src/components/FileUpload/FileUploadZone/FileUploadZone.jsx @@ -57,7 +57,7 @@ const FileUploadZone = forwardRef(({ } }; - const uploadFiles = (files, extraHeaders): Promise => new Promise((resolve, reject) => { + const uploadFiles = (files, extraHeaders) => new Promise((resolve, reject) => { // Reset progress setUploadProgress(0); setUploadingFiles(files); From d07ce0ad13972b88a404e0e80abdbb4aca2494ab Mon Sep 17 00:00:00 2001 From: smtsj Date: Mon, 6 Feb 2023 14:57:46 +0100 Subject: [PATCH 14/15] chore: update package lock --- package-lock.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package-lock.json b/package-lock.json index 5a763b3..1bc100a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19866,7 +19866,7 @@ "parse-srcset": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/parse-srcset/-/parse-srcset-1.0.2.tgz", - "integrity": "sha512-/2qh0lav6CmI15FzA3i/2Bzk2zCgQhGMkvhOhKNcBVQ1ldgpbfiNTVslmooUmWJcADi1f1kIeynbDRVzNlfR6Q==" + "integrity": "sha1-8r0iH2zJcKk42IVWq8WJyqqiveE=" }, "parse5": { "version": "6.0.1", From 92c7f5287e3aa95e1983c7f56b9c9a96b8f364e1 Mon Sep 17 00:00:00 2001 From: smtsj Date: Mon, 6 Feb 2023 14:58:08 +0100 Subject: [PATCH 15/15] 1.5.9 --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 1bc100a..4bccc22 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.8", + "version": "1.5.9", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index e56b2a8..bb49610 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@acpaas-ui/react-editorial-components", - "version": "1.5.8", + "version": "1.5.9", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "scripts": {