diff --git a/superset-frontend/src/components/Button/index.tsx b/superset-frontend/src/components/Button/index.tsx index 1f9d737836b0..62e1214d3dff 100644 --- a/superset-frontend/src/components/Button/index.tsx +++ b/superset-frontend/src/components/Button/index.tsx @@ -62,6 +62,7 @@ export interface ButtonProps { href?: string; htmlType?: 'button' | 'submit' | 'reset'; cta?: boolean; + loading?: boolean | { delay?: number | undefined } | undefined; } export default function Button(props: ButtonProps) { diff --git a/superset-frontend/src/components/ImportModal/index.tsx b/superset-frontend/src/components/ImportModal/index.tsx index f22149436d4f..193d3c568e21 100644 --- a/superset-frontend/src/components/ImportModal/index.tsx +++ b/superset-frontend/src/components/ImportModal/index.tsx @@ -136,6 +136,7 @@ const ImportModelsModal: FunctionComponent = ({ ); const [confirmedOverwrite, setConfirmedOverwrite] = useState(false); const [fileList, setFileList] = useState([]); + const [importingModel, setImportingModel] = useState(false); const clearModal = () => { setFileList([]); @@ -143,6 +144,7 @@ const ImportModelsModal: FunctionComponent = ({ setPasswords({}); setNeedsOverwriteConfirm(false); setConfirmedOverwrite(false); + setImportingModel(false); }; const handleErrorMsg = (msg: string) => { @@ -157,10 +159,16 @@ const ImportModelsModal: FunctionComponent = ({ useEffect(() => { setPasswordFields(passwordsNeeded); + if (passwordsNeeded.length > 0) { + setImportingModel(false); + } }, [passwordsNeeded, setPasswordFields]); useEffect(() => { setNeedsOverwriteConfirm(alreadyExists.length > 0); + if (alreadyExists.length > 0) { + setImportingModel(false); + } }, [alreadyExists, setNeedsOverwriteConfirm]); // Functions @@ -175,6 +183,7 @@ const ImportModelsModal: FunctionComponent = ({ return; } + setImportingModel(true); importResource( fileList[0].originFileObj, passwords, @@ -270,7 +279,9 @@ const ImportModelsModal: FunctionComponent = ({ name="model" className="import-model-modal" disablePrimaryButton={ - fileList.length === 0 || (needsOverwriteConfirm && !confirmedOverwrite) + fileList.length === 0 || + (needsOverwriteConfirm && !confirmedOverwrite) || + importingModel } onHandledPrimaryAction={onUpload} onHide={hide} @@ -292,7 +303,7 @@ const ImportModelsModal: FunctionComponent = ({ // upload is handled by hook customRequest={() => {}} > - + {renderPasswordFields()}