From 0cb0727ead5aa0be8d3c663e6c4193aaff408ee0 Mon Sep 17 00:00:00 2001
From: Krishna Gopal <gopalk@usc.edu>
Date: Tue, 17 May 2022 19:58:53 -0500
Subject: [PATCH] fix: add primary button loading state to modals (#20018)

---
 superset-frontend/src/components/Modal/Modal.tsx            | 3 +++
 .../src/views/CRUD/data/dataset/AddDatasetModal.tsx         | 6 +++++-
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/superset-frontend/src/components/Modal/Modal.tsx b/superset-frontend/src/components/Modal/Modal.tsx
index 9e53589d8321a..389982cc22021 100644
--- a/superset-frontend/src/components/Modal/Modal.tsx
+++ b/superset-frontend/src/components/Modal/Modal.tsx
@@ -34,6 +34,7 @@ export interface ModalProps {
   className?: string;
   children: React.ReactNode;
   disablePrimaryButton?: boolean;
+  primaryButtonLoading?: boolean;
   onHide: () => void;
   onHandledPrimaryAction?: () => void;
   primaryButtonName?: string;
@@ -190,6 +191,7 @@ export const StyledModal = styled(BaseModal)<StyledModalProps>`
 const CustomModal = ({
   children,
   disablePrimaryButton = false,
+  primaryButtonLoading = false,
   onHide,
   onHandledPrimaryAction,
   primaryButtonName = t('OK'),
@@ -240,6 +242,7 @@ const CustomModal = ({
           key="submit"
           buttonStyle={primaryButtonType}
           disabled={disablePrimaryButton}
+          loading={primaryButtonLoading}
           onClick={onHandledPrimaryAction}
           cta
           data-test="modal-confirm-button"
diff --git a/superset-frontend/src/views/CRUD/data/dataset/AddDatasetModal.tsx b/superset-frontend/src/views/CRUD/data/dataset/AddDatasetModal.tsx
index dca78a60ec68e..e24954077f1e7 100644
--- a/superset-frontend/src/views/CRUD/data/dataset/AddDatasetModal.tsx
+++ b/superset-frontend/src/views/CRUD/data/dataset/AddDatasetModal.tsx
@@ -57,7 +57,10 @@ const DatasetModal: FunctionComponent<DatasetModalProps> = ({
   const [currentSchema, setSchema] = useState<string | undefined>('');
   const [currentTableName, setTableName] = useState('');
   const [disableSave, setDisableSave] = useState(true);
-  const { createResource } = useSingleViewResource<Partial<DatasetAddObject>>(
+  const {
+    createResource,
+    state: { loading },
+  } = useSingleViewResource<Partial<DatasetAddObject>>(
     'dataset',
     t('dataset'),
     addDangerToast,
@@ -115,6 +118,7 @@ const DatasetModal: FunctionComponent<DatasetModalProps> = ({
   return (
     <Modal
       disablePrimaryButton={disableSave}
+      primaryButtonLoading={loading}
       onHandledPrimaryAction={onSave}
       onHide={hide}
       primaryButtonName={t('Add')}