diff --git a/src/Components/Files/FileUpload.tsx b/src/Components/Files/FileUpload.tsx
index 85d991d7c3b..ae42a8fdb73 100644
--- a/src/Components/Files/FileUpload.tsx
+++ b/src/Components/Files/FileUpload.tsx
@@ -271,7 +271,7 @@ export const FileUpload = (props: FileUploadProps) => {
                       label={t("enter_file_name")}
                       id="upload-file-name"
                       required
-                      value={fileUpload.fileNames[0]}
+                      value={fileUpload.fileNames[0] || ""}
                       disabled={!!fileUpload.progress}
                       onChange={(e) => fileUpload.setFileName(e.value)}
                       error={fileUpload.error || undefined}
diff --git a/src/Components/Patient/PatientConsentRecords.tsx b/src/Components/Patient/PatientConsentRecords.tsx
index 564d72ac435..4080e30e124 100644
--- a/src/Components/Patient/PatientConsentRecords.tsx
+++ b/src/Components/Patient/PatientConsentRecords.tsx
@@ -181,7 +181,7 @@ export default function PatientConsentRecords(props: {
           <TextFormField
             name="filename"
             label="File Name"
-            value={fileUpload.fileNames[0]}
+            value={fileUpload.fileNames[0] || ""}
             onChange={(e) => fileUpload.setFileName(e.value)}
           />
           <div className="flex gap-2">
diff --git a/src/Locale/en/FileUpload.json b/src/Locale/en/FileUpload.json
index 33914134602..4b3097eb9d3 100644
--- a/src/Locale/en/FileUpload.json
+++ b/src/Locale/en/FileUpload.json
@@ -21,6 +21,7 @@
   "file_list_headings__supporting_info": "Supporting Info",
   "file_error__choose_file": "Please choose a file to upload",
   "file_error__file_name": "Please give a name for all files!",
+  "file_error__single_file_name": "Please give a name for the file",
   "change_file": "Change File",
   "file_error__file_size": "Maximum size of files is 100 MB",
   "file_error__file_type": "Invalid file type \".{{extension}}\" Allowed types: {{allowedExtensions}}",
diff --git a/src/Utils/useFileUpload.tsx b/src/Utils/useFileUpload.tsx
index ac246287196..bba4957dedc 100644
--- a/src/Utils/useFileUpload.tsx
+++ b/src/Utils/useFileUpload.tsx
@@ -2,6 +2,7 @@ import {
   ChangeEvent,
   DetailedHTMLProps,
   InputHTMLAttributes,
+  useEffect,
   useState,
 } from "react";
 import {
@@ -104,6 +105,11 @@ export default function useFileUpload(
     });
   };
 
+  useEffect(() => {
+    const blanks = Array(files.length).fill("");
+    setUploadFileNames((names) => [...names, ...blanks].slice(0, files.length));
+  }, [files]);
+
   const validateFileUpload = () => {
     if (files.length === 0) {
       setError(t("file_error__choose_file"));
@@ -198,10 +204,11 @@ export default function useFileUpload(
     setProgress(0);
 
     for (const [index, file] of files.entries()) {
-      const filename =
-        uploadFileNames[index] === "" && file
-          ? file.name
-          : uploadFileNames[index];
+      const filename = uploadFileNames[index];
+      if (!filename) {
+        setError(t("file_error__single_file_name"));
+        return;
+      }
 
       const { data } = await request(routes.createUpload, {
         body: {