diff --git a/src/components/Files/CameraCaptureDialog.tsx b/src/components/Files/CameraCaptureDialog.tsx index cfbaff19dab..54b9debc21e 100644 --- a/src/components/Files/CameraCaptureDialog.tsx +++ b/src/components/Files/CameraCaptureDialog.tsx @@ -16,10 +16,11 @@ export interface CameraCaptureDialogProps { onHide: () => void; onCapture: (file: File, fileName: string) => void; onResetCapture: () => void; + setPreview?: (isPreview: boolean) => void; } export default function CameraCaptureDialog(props: CameraCaptureDialogProps) { - const { show, onHide, onCapture, onResetCapture } = props; + const { show, onHide, onCapture, onResetCapture, setPreview } = props; const isLaptopScreen = useBreakpoints({ lg: true, default: false }); const [cameraFacingMode, setCameraFacingMode] = useState( @@ -149,6 +150,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) { variant="primary" onClick={() => { captureImage(); + setPreview?.(true); }} className="m-2" > @@ -164,6 +166,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) { onClick={() => { setPreviewImage(null); onResetCapture(); + setPreview?.(false); }} className="m-2" > @@ -174,6 +177,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) { onClick={() => { setPreviewImage(null); onHide(); + setPreview?.(false); }} className="m-2" > @@ -215,6 +219,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) { variant="primary" onClick={() => { captureImage(); + setPreview?.(true); }} > @@ -230,6 +235,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) { onClick={() => { setPreviewImage(null); onResetCapture(); + setPreview?.(false); }} > {t("retake")} @@ -239,6 +245,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) { onClick={() => { onHide(); setPreviewImage(null); + setPreview?.(false); }} > {t("submit")} @@ -254,6 +261,7 @@ export default function CameraCaptureDialog(props: CameraCaptureDialogProps) { setPreviewImage(null); onResetCapture(); onHide(); + setPreview?.(false); }} > {`${t("close")} ${t("camera")}`} diff --git a/src/components/Files/FilesTab.tsx b/src/components/Files/FilesTab.tsx index e3797c79ea4..8a3078ae2ec 100644 --- a/src/components/Files/FilesTab.tsx +++ b/src/components/Files/FilesTab.tsx @@ -157,12 +157,16 @@ export const FilesTab = (props: FilesTabProps) => { }); useEffect(() => { - if (fileUpload.files.length > 0 && fileUpload.files[0] !== undefined) { + if ( + fileUpload.files.length > 0 && + fileUpload.files[0] !== undefined && + !fileUpload.previewing + ) { setOpenUploadDialog(true); } else { setOpenUploadDialog(false); } - }, [fileUpload.files]); + }, [fileUpload.files, fileUpload.previewing]); useEffect(() => { if (!openUploadDialog) { diff --git a/src/hooks/useFileUpload.tsx b/src/hooks/useFileUpload.tsx index 04128a169a3..0cf0ac09fd8 100644 --- a/src/hooks/useFileUpload.tsx +++ b/src/hooks/useFileUpload.tsx @@ -61,6 +61,7 @@ export type FileUploadReturn = { removeFile: (index: number) => void; clearFiles: () => void; uploading: boolean; + previewing?: boolean; }; // Array of image extensions @@ -92,6 +93,7 @@ export default function useFileUpload( const [cameraModalOpen, setCameraModalOpen] = useState(false); const [audioModalOpen, setAudioModalOpen] = useState(false); const [uploading, setUploading] = useState(false); + const [previewing, setPreviewing] = useState(false); const [files, setFiles] = useState([]); const queryClient = useQueryClient(); @@ -285,6 +287,7 @@ export default function useFileUpload( setFiles(errors); setUploadFileNames(errors?.map((f) => f.name) ?? []); setError(t("file_error__network")); + setCameraModalOpen(false); }; const clearFiles = () => { @@ -302,6 +305,7 @@ export default function useFileUpload( setFiles((prev) => [...prev, file]); }} onResetCapture={clearFiles} + setPreview={setPreviewing} />