diff --git a/editor.planx.uk/src/@planx/components/FileUploadAndLabel/Modal.tsx b/editor.planx.uk/src/@planx/components/FileUploadAndLabel/Modal.tsx index db5aafc6e1..f12796d522 100644 --- a/editor.planx.uk/src/@planx/components/FileUploadAndLabel/Modal.tsx +++ b/editor.planx.uk/src/@planx/components/FileUploadAndLabel/Modal.tsx @@ -35,6 +35,7 @@ interface FileTaggingModalProps { fileList: FileList; setFileList: (value: React.SetStateAction) => void; setShowModal: (value: React.SetStateAction) => void; + removeFile: (slot: FileUploadSlot) => void; } const ListHeader = styled(Box)(({ theme }) => ({ @@ -52,6 +53,7 @@ export const FileTaggingModal = ({ fileList, setFileList, setShowModal, + removeFile, }: FileTaggingModalProps) => { const [error, setError] = useState(); @@ -95,7 +97,11 @@ export const FileTaggingModal = ({ {uploadedFiles.map((slot) => ( - + removeFile(slot)} + /> { + setSlots(slots.filter((currentSlot) => currentSlot.file !== slot.file)); + setFileUploadStatus(`${slot.file.path} was deleted`); + const updatedFileList = removeSlots( + getTagsForSlot(slot.id, fileList), + slot, + fileList, + ); + setFileList(updatedFileList); + }; + return ( )} {slots.map((slot) => { @@ -231,20 +243,7 @@ function Component(props: Props) { key={slot.id} tags={getTagsForSlot(slot.id, fileList)} onChange={onUploadedFileCardChange} - removeFile={() => { - setSlots( - slots.filter( - (currentSlot) => currentSlot.file !== slot.file, - ), - ); - setFileUploadStatus(`${slot.file.path} was deleted`); - const updatedFileList = removeSlots( - getTagsForSlot(slot.id, fileList), - slot, - fileList, - ); - setFileList(updatedFileList); - }} + removeFile={() => removeFile(slot)} /> ); })} diff --git a/editor.planx.uk/src/@planx/components/shared/PrivateFileUpload/UploadedFileCard.tsx b/editor.planx.uk/src/@planx/components/shared/PrivateFileUpload/UploadedFileCard.tsx index 14d92d2a63..00265ee4d9 100644 --- a/editor.planx.uk/src/@planx/components/shared/PrivateFileUpload/UploadedFileCard.tsx +++ b/editor.planx.uk/src/@planx/components/shared/PrivateFileUpload/UploadedFileCard.tsx @@ -12,7 +12,7 @@ import ImagePreview from "components/ImagePreview"; import React from "react"; interface Props extends FileUploadSlot { - removeFile?: () => void; + removeFile: () => void; onChange?: () => void; tags?: string[]; }