From aec033a27287991c2901ce57fe989b201a128ed6 Mon Sep 17 00:00:00 2001
From: Arash <arash.afghahi@gmail.com>
Date: Thu, 10 Jun 2021 17:44:01 -0400
Subject: [PATCH 1/2] added alerts

---
 .../data/database/DatabaseModal/index.tsx     | 28 +++++++++++++++++++
 .../data/database/DatabaseModal/styles.ts     |  2 +-
 superset-frontend/src/views/CRUD/hooks.ts     |  2 ++
 3 files changed, 31 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 794729732fe42..40721000a9ed0 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
@@ -41,6 +41,7 @@ import {
   useAvailableDatabases,
   useDatabaseValidation,
   getDatabaseImages,
+  getConnectionAlert,
 } from 'src/views/CRUD/hooks';
 import { useCommonConf } from 'src/views/CRUD/data/database/state';
 import {
@@ -208,6 +209,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
   const [isLoading, setLoading] = useState<boolean>(false);
   const conf = useCommonConf();
   const dbImages = getDatabaseImages();
+  const connectionAlert = getConnectionAlert();
   const isEditMode = !!databaseId;
   const sslForced = isFeatureEnabled(
     FeatureFlag.FORCE_DATABASE_CONNECTIONS_SSL,
@@ -358,6 +360,24 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
           </Select.Option>
         ))}
       </Select>
+      <Alert
+        css={(theme: SupersetTheme) => antDAlertStyles(theme)}
+        type="info"
+        message={t('Want to add a new database?')}
+        description={
+          <>
+            Any databases that allow connetions via SQL Alchemy URIs can be
+            added. Learn about how to connect a database driver{' '}
+            <a
+              href={DOCUMENTATION_LINK}
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              here.
+            </a>
+          </>
+        }
+      />
     </div>
   );
 
@@ -636,6 +656,14 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
                   dbName={dbName}
                   dbModel={dbModel}
                 />
+                {connectionAlert && (
+                  <Alert
+                    css={(theme: SupersetTheme) => antDAlertStyles(theme)}
+                    type="info"
+                    message={t('Whitelisting IPs')}
+                    description={connectionAlert.WHITELISTED_IPS}
+                  />
+                )}
                 <DatabaseConnectionForm
                   db={db}
                   sslForced={sslForced}
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 00badbb285927..ce24ad3eeaa26 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/styles.ts
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/styles.ts
@@ -127,7 +127,7 @@ 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 0 0;
+  margin: ${theme.gridUnit * 8}px ${theme.gridUnit * 3}px 0;
   .ant-alert-message {
     color: ${theme.colors.info.dark2};
     font-size: ${theme.typography.sizes.s + 1}px;
diff --git a/superset-frontend/src/views/CRUD/hooks.ts b/superset-frontend/src/views/CRUD/hooks.ts
index 64bec4770df2a..d0f1c3e3748da 100644
--- a/superset-frontend/src/views/CRUD/hooks.ts
+++ b/superset-frontend/src/views/CRUD/hooks.ts
@@ -598,6 +598,8 @@ export const copyQueryLink = (
 
 export const getDatabaseImages = () => SupersetText.DB_IMAGES;
 
+export const getConnectionAlert = () => SupersetText.ALERTS;
+
 export const testDatabaseConnection = (
   connection: DatabaseObject,
   handleErrorMsg: (errorMsg: string) => void,

From c1a376a1db37aff5699a8eec9ae80ccb724e1832 Mon Sep 17 00:00:00 2001
From: Arash <arash.afghahi@gmail.com>
Date: Fri, 11 Jun 2021 11:37:08 -0400
Subject: [PATCH 2/2] revisions

---
 superset-frontend/src/views/CRUD/hooks.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/superset-frontend/src/views/CRUD/hooks.ts b/superset-frontend/src/views/CRUD/hooks.ts
index d0f1c3e3748da..d22931516a1e0 100644
--- a/superset-frontend/src/views/CRUD/hooks.ts
+++ b/superset-frontend/src/views/CRUD/hooks.ts
@@ -598,7 +598,7 @@ export const copyQueryLink = (
 
 export const getDatabaseImages = () => SupersetText.DB_IMAGES;
 
-export const getConnectionAlert = () => SupersetText.ALERTS;
+export const getConnectionAlert = () => SupersetText.DB_CONNECTION_ALERTS;
 
 export const testDatabaseConnection = (
   connection: DatabaseObject,