From 8a4ff629cced16551f140f9d85bd00c104f62246 Mon Sep 17 00:00:00 2001
From: Arash <arash.afghahi@gmail.com>
Date: Thu, 17 Jun 2021 11:24:32 -0400
Subject: [PATCH] spinner

---
 .../src/views/CRUD/data/database/DatabaseModal/index.tsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
index a2f3145a78886..83e5fc06c5f14 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
@@ -49,6 +49,7 @@ import {
   DatabaseForm,
   CONFIGURATION_METHOD,
 } from 'src/views/CRUD/data/database/types';
+import Loading from 'src/components/Loading';
 import ExtraOptions from './ExtraOptions';
 import SqlAlchemyForm from './SqlAlchemyForm';
 import DatabaseConnectionForm from './DatabaseConnectionForm';
@@ -376,7 +377,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
           ),
         });
       }
-
+      setLoading(true);
       const result = await updateResource(
         db.id as number,
         update as DatabaseObject,
@@ -411,7 +412,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
           ),
         });
       }
-
+      setLoading(true);
       const dbId = await createResource(update as DatabaseObject);
       if (dbId) {
         setHasConnectedDb(true);
@@ -425,6 +426,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
         }
       }
     }
+    setLoading(false);
   };
 
   const onChange = (type: any, payload: any) => {
@@ -593,7 +595,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
     if (isLoading) {
       setLoading(false);
     }
-  }, [availableDbs, isLoading]);
+  }, [availableDbs]);
 
   const tabChange = (key: string) => {
     setTabKey(key);
@@ -910,6 +912,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
             ))}
         </>
       )}
+      {isLoading && <Loading />}
     </Modal>
   );
 };