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}
/>