diff --git a/src/Explorer/Panes/UploadItemsPane/UploadItemsPane.tsx b/src/Explorer/Panes/UploadItemsPane/UploadItemsPane.tsx index 344dc13c7..b2f8fe590 100644 --- a/src/Explorer/Panes/UploadItemsPane/UploadItemsPane.tsx +++ b/src/Explorer/Panes/UploadItemsPane/UploadItemsPane.tsx @@ -13,7 +13,7 @@ import { import { Upload } from "Common/Upload/Upload"; import { UploadDetailsRecord } from "Contracts/ViewModels"; import { logConsoleError } from "Utils/NotificationConsoleUtils"; -import React, { ChangeEvent, FunctionComponent, useState } from "react"; +import React, { ChangeEvent, FunctionComponent, useReducer, useState } from "react"; import { getErrorMessage } from "../../Tables/Utilities"; import { useSelectedNode } from "../../useSelectedNode"; import { RightPaneForm, RightPaneFormProps } from "../RightPaneForm/RightPaneForm"; @@ -57,6 +57,7 @@ export const UploadItemsPane: FunctionComponent = ({ onUpl const [uploadFileData, setUploadFileData] = useState([]); const [formError, setFormError] = useState(""); const [isExecuting, setIsExecuting] = useState(); + const [reducer, setReducer] = useReducer((x) => x + 1, 1); const onSubmit = () => { setFormError(""); @@ -75,6 +76,7 @@ export const UploadItemsPane: FunctionComponent = ({ onUpl (uploadDetails) => { setUploadFileData(uploadDetails.data); setFiles(undefined); + setReducer(); // Trigger a re-render to update the UI with new upload details // Emit the upload details to the parent component onUpload && onUpload(uploadDetails.data); }, @@ -95,6 +97,7 @@ export const UploadItemsPane: FunctionComponent = ({ onUpl const props: RightPaneFormProps = { formError, isExecuting: isExecuting, + isSubmitButtonDisabled: !files || files.length === 0, submitButtonText: "Upload", onSubmit, }; @@ -192,6 +195,7 @@ export const UploadItemsPane: FunctionComponent = ({ onUpl