From dbbf58c10d20ffccd1d2e035db79e9fafe02a9d7 Mon Sep 17 00:00:00 2001
From: AAfghahi <48933336+AAfghahi@users.noreply.github.com>
Date: Fri, 11 Jun 2021 11:55:17 -0400
Subject: [PATCH 1/2] fix: add icons (#15122)

* added alerts

* revisions

* added icon
---
 .../src/views/CRUD/data/database/DatabaseModal/index.tsx      | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

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 40721000a9ed0..e35020065974d 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
@@ -361,6 +361,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
         ))}
       </Select>
       <Alert
+        showIcon
         css={(theme: SupersetTheme) => antDAlertStyles(theme)}
         type="info"
         message={t('Want to add a new database?')}
@@ -532,6 +533,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
             <Alert
               css={(theme: SupersetTheme) => antDAlertStyles(theme)}
               message="Additional fields may be required"
+              showIcon
               description={
                 <>
                   Select databases require additional fields to be completed in
@@ -548,7 +550,6 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
                 </>
               }
               type="info"
-              showIcon
             />
           )}
         </StyledBasicTab>
@@ -660,6 +661,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
                   <Alert
                     css={(theme: SupersetTheme) => antDAlertStyles(theme)}
                     type="info"
+                    showIcon
                     message={t('Whitelisting IPs')}
                     description={connectionAlert.WHITELISTED_IPS}
                   />

From 72335cec9d86bf19ab8e471ebd2f5b4b565673b9 Mon Sep 17 00:00:00 2001
From: Arash <arash.afghahi@gmail.com>
Date: Wed, 16 Jun 2021 12:52:18 -0400
Subject: [PATCH 2/2] editDBModal footer

---
 .../DatabaseModal/DatabaseConnectionForm.tsx         | 10 +++++-----
 .../views/CRUD/data/database/DatabaseModal/index.tsx | 12 +++++++++++-
 .../views/CRUD/data/database/DatabaseModal/styles.ts |  7 ++++++-
 3 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm.tsx b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm.tsx
index 3c6adc0200d4f..28fdb78b2ea37 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm.tsx
@@ -63,7 +63,7 @@ interface FieldPropTypes {
   db?: DatabaseObject;
   isEditMode?: boolean;
   sslForced?: boolean;
-  name?: string;
+  defaultDBName?: string;
 }
 
 const CredentialsInfo = ({ changeMethods }: FieldPropTypes) => {
@@ -258,13 +258,13 @@ const displayField = ({
   getValidation,
   validationErrors,
   db,
-  name,
+  defaultDBName,
 }: FieldPropTypes) => (
   <ValidatedInput
     id="database_name"
     name="database_name"
     required={required}
-    value={db?.database_name || name}
+    value={db?.database_name || defaultDBName}
     validationMethods={{ onBlur: getValidation }}
     errorMessage={validationErrors?.database_name}
     placeholder=""
@@ -337,7 +337,7 @@ const FORM_FIELD_MAP = {
 };
 
 const DatabaseConnectionForm = ({
-  dbModel: { name, parameters },
+  dbModel: { name: defaultDBName, parameters },
   onParametersChange,
   onChange,
   onParametersUploadFileChange,
@@ -384,7 +384,7 @@ const DatabaseConnectionForm = ({
               onChange,
               onParametersUploadFileChange,
             },
-            name,
+            defaultDBName,
             validationErrors,
             getValidation,
             db,
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 46011d228345d..89dde3d398ce0 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
@@ -541,6 +541,16 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
         ]
       : [];
 
+  const renderEditModalFooter = () => (
+    <>
+      <StyledFooterButton key="close" onClick={onClose}>
+        Close
+      </StyledFooterButton>
+      <StyledFooterButton key="submit" buttonStyle="primary" onClick={onSave}>
+        Finish
+      </StyledFooterButton>
+    </>
+  );
   useEffect(() => {
     if (show) {
       setTabKey(DEFAULT_TAB_KEY);
@@ -593,7 +603,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
       title={
         <h4>{isEditMode ? t('Edit database') : t('Connect a database')}</h4>
       }
-      footer={renderModalFooter()}
+      footer={isEditMode ? renderEditModalFooter() : renderModalFooter()}
     >
       <TabHeader>
         <ModalHeader
diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/styles.ts b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/styles.ts
index 55226b4264ed7..08aca05d389d0 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/styles.ts
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/styles.ts
@@ -32,6 +32,10 @@ export const no_margin_bottom = css`
   margin-bottom: 0;
 `;
 
+export const marginBottom = (theme: SupersetTheme) => css`
+  margin-bottom: ${theme.gridUnit * 4}px;
+`;
+
 export const StyledFormHeader = styled.header`
   border-bottom: ${({ theme }) => `${theme.gridUnit * 0.25}px solid
     ${theme.colors.grayscale.light2};`}
@@ -137,7 +141,8 @@ export const antDModalStyles = (theme: SupersetTheme) => css`
 export const antDAlertStyles = (theme: SupersetTheme) => css`
   border: 1px solid ${theme.colors.info.base};
   padding: ${theme.gridUnit * 4}px;
-  margin: ${theme.gridUnit * 8}px ${theme.gridUnit * 3}px 0;
+  margin: ${theme.gridUnit * 8}px ${theme.gridUnit * 3}px
+    ${theme.gridUnit * 4}px;
   .ant-alert-message {
     color: ${theme.colors.info.dark2};
     font-size: ${theme.typography.sizes.s + 1}px;