From 3770e6fddef68993bd889a7d1bc59007b09bbad3 Mon Sep 17 00:00:00 2001
From: kgopal <kgopal@pinterest.com>
Date: Tue, 10 May 2022 12:30:49 -0700
Subject: [PATCH] fix: add primary button loading state to modals

---
 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 9e53589d8321..389982cc2202 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 7e7e7429bddd..10a3b7bb77e4 100644
--- a/superset-frontend/src/views/CRUD/data/dataset/AddDatasetModal.tsx
+++ b/superset-frontend/src/views/CRUD/data/dataset/AddDatasetModal.tsx
@@ -56,7 +56,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,
@@ -114,6 +117,7 @@ const DatasetModal: FunctionComponent<DatasetModalProps> = ({
   return (
     <Modal
       disablePrimaryButton={disableSave}
+      primaryButtonLoading={loading}
       onHandledPrimaryAction={onSave}
       onHide={hide}
       primaryButtonName={t('Add')}