From e3fc8af1f0ed59024ba9ebf665fccfb2aaacc9d4 Mon Sep 17 00:00:00 2001 From: gearnode Date: Mon, 17 Mar 2025 13:42:08 +0100 Subject: [PATCH] Fix upload modal Signed-off-by: gearnode --- .../console/src/pages/ControlOverviewPage.tsx | 108 +++++------------- ...rviewPageUploadEvidenceMutation.graphql.ts | 16 ++- 2 files changed, 41 insertions(+), 83 deletions(-) diff --git a/apps/console/src/pages/ControlOverviewPage.tsx b/apps/console/src/pages/ControlOverviewPage.tsx index cea9d0101..689bfd492 100644 --- a/apps/console/src/pages/ControlOverviewPage.tsx +++ b/apps/console/src/pages/ControlOverviewPage.tsx @@ -48,7 +48,6 @@ import { DialogTitle, DialogTrigger, } from "@/components/ui/dialog"; -import { Label } from "@/components/ui/label"; import { Popover, PopoverContent, @@ -218,6 +217,7 @@ const uploadEvidenceMutation = graphql` evidenceEdge @appendEdge(connections: $connections) { node { id + filename fileUrl mimeType size @@ -450,13 +450,11 @@ function ControlOverviewPageContent({ name: string; } | null>(null); - const [isUploadEvidenceOpen, setIsUploadEvidenceOpen] = useState(false); const [taskForEvidence, setTaskForEvidence] = useState<{ id: string; name: string; } | null>(null); - const [evidenceName, setEvidenceName] = useState(""); - const fileInputRef = useRef(null); + const hiddenFileInputRef = useRef(null); const [draggedOverTaskId, setDraggedOverTaskId] = useState( null @@ -702,15 +700,24 @@ function ControlOverviewPageContent({ const handleUploadEvidence = (taskId: string, taskName: string) => { setTaskForEvidence({ id: taskId, name: taskName }); - setIsUploadEvidenceOpen(true); + // Instead of opening a modal, directly trigger the file input click + if (hiddenFileInputRef.current) { + hiddenFileInputRef.current.click(); + } }; - const confirmUploadEvidence = (event: React.FormEvent) => { - event.preventDefault(); + const handleFileSelected = (e: React.ChangeEvent) => { + if (!e.target.files || e.target.files.length === 0 || !taskForEvidence) + return; - if (!taskForEvidence || !fileInputRef.current?.files?.[0]) return; + const file = e.target.files[0]; - const file = fileInputRef.current.files[0]; + // Show toast for upload started + toast({ + title: "Upload started", + description: `Uploading ${file.name}...`, + variant: "default", + }); // Get the evidence connection ID for this task const evidenceConnectionId = getEvidenceConnectionId(taskForEvidence.id); @@ -719,7 +726,7 @@ function ControlOverviewPageContent({ variables: { input: { taskId: taskForEvidence.id, - name: evidenceName || file.name, + name: file.name, file: null, }, connections: evidenceConnectionId ? [evidenceConnectionId] : [], @@ -733,11 +740,10 @@ function ControlOverviewPageContent({ description: "Evidence has been uploaded successfully.", variant: "default", }); - setIsUploadEvidenceOpen(false); setTaskForEvidence(null); - setEvidenceName(""); - if (fileInputRef.current) { - fileInputRef.current.value = ""; + // Reset the file input + if (hiddenFileInputRef.current) { + hiddenFileInputRef.current.value = ""; } }, onError: (error) => { @@ -1625,6 +1631,15 @@ function ControlOverviewPageContent({ + {/* Hidden file input for direct uploads */} + + {/* Delete Task Confirmation Dialog */} @@ -1649,71 +1664,6 @@ function ControlOverviewPageContent({ - {/* Upload Evidence Dialog */} - - - - Upload Evidence - - Upload evidence for the task "{taskForEvidence?.name} - ". - - -
-
-
- - setEvidenceName(e.target.value)} - className="w-full" - /> -
-
- -
-
- -
-

- Drag and drop your file here, or click to browse -

-

- Supported file types: PDF, images, documents -

-
- -
-
-
-
- - - - -
- - - {/* Add the Preview Modal */} diff --git a/apps/console/src/pages/__generated__/ControlOverviewPageUploadEvidenceMutation.graphql.ts b/apps/console/src/pages/__generated__/ControlOverviewPageUploadEvidenceMutation.graphql.ts index a7649a7b6..b09d15f50 100644 --- a/apps/console/src/pages/__generated__/ControlOverviewPageUploadEvidenceMutation.graphql.ts +++ b/apps/console/src/pages/__generated__/ControlOverviewPageUploadEvidenceMutation.graphql.ts @@ -1,5 +1,5 @@ /** - * @generated SignedSource<> + * @generated SignedSource<<313084c3c2422d51df42fe4d6b848d49>> * @lightSyntaxTransform * @nogrep */ @@ -25,6 +25,7 @@ export type ControlOverviewPageUploadEvidenceMutation$data = { readonly node: { readonly createdAt: string; readonly fileUrl: string; + readonly filename: string; readonly id: string; readonly mimeType: string; readonly size: number; @@ -79,6 +80,13 @@ v3 = { "name": "id", "storageKey": null }, + { + "alias": null, + "args": null, + "kind": "ScalarField", + "name": "filename", + "storageKey": null + }, { "alias": null, "args": null, @@ -186,16 +194,16 @@ return { ] }, "params": { - "cacheID": "76c2ba38a9ba243840027c997b01b51b", + "cacheID": "5edaf64bde176530d9952e3e8aeb15af", "id": null, "metadata": {}, "name": "ControlOverviewPageUploadEvidenceMutation", "operationKind": "mutation", - "text": "mutation ControlOverviewPageUploadEvidenceMutation(\n $input: UploadEvidenceInput!\n) {\n uploadEvidence(input: $input) {\n evidenceEdge {\n node {\n id\n fileUrl\n mimeType\n size\n state\n createdAt\n }\n }\n }\n}\n" + "text": "mutation ControlOverviewPageUploadEvidenceMutation(\n $input: UploadEvidenceInput!\n) {\n uploadEvidence(input: $input) {\n evidenceEdge {\n node {\n id\n filename\n fileUrl\n mimeType\n size\n state\n createdAt\n }\n }\n }\n}\n" } }; })(); -(node as any).hash = "b43bb6fc3d2a70fd8f81ccfb2532f067"; +(node as any).hash = "51f35fe735a747ddaeb0f0cfa298f7e2"; export default node;