From c0572c53023d4df2d7b7dcf0a6422ed47446d4e0 Mon Sep 17 00:00:00 2001
From: AAfghahi <48933336+AAfghahi@users.noreply.github.com>
Date: Mon, 9 Aug 2021 14:08:06 -0400
Subject: [PATCH] feat: added google alert to DB Connection Form (#16095)

* added google alert

* using superset_text

* made google alert public and others private

* Hugh revisions

(cherry picked from commit a51851308be5884f60bf758f68c8a58431a10c30)
---
 .../data/database/DatabaseModal/index.tsx     | 48 ++++++++++++++-----
 1 file changed, 35 insertions(+), 13 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 119f15fddeb..99d9169b87c 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
@@ -76,6 +76,18 @@ import {
 } from './styles';
 import ModalHeader, { DOCUMENTATION_LINK } from './ModalHeader';
 
+const engineSpecificAlertMapping = {
+  gsheets: {
+    message: 'Why do I need to create a database?',
+    description:
+      'To begin using your Google Sheets, you need to create a database first. ' +
+      'Databases are used as a way to identify ' +
+      'your data so that it can be queried and visualized. This ' +
+      'database will hold all of your individual Google Sheets ' +
+      'you choose to connect here.',
+  },
+};
+
 const errorAlertMapping = {
   CONNECTION_MISSING_PARAMETERS_ERROR: {
     message: 'Missing Required Fields',
@@ -454,10 +466,11 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
   const sslForced = isFeatureEnabled(
     FeatureFlag.FORCE_DATABASE_CONNECTIONS_SSL,
   );
+  const hasAlert =
+    connectionAlert || !!(db?.engine && engineSpecificAlertMapping[db.engine]);
   const useSqlAlchemyForm =
     db?.configuration_method === CONFIGURATION_METHOD.SQLALCHEMY_URI;
   const useTabLayout = isEditMode || useSqlAlchemyForm;
-
   // Database fetch logic
   const {
     state: { loading: dbLoading, resource: dbFetched, error: dbErrors },
@@ -834,6 +847,26 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
     setTabKey(key);
   };
 
+  const renderStepTwoAlert = () =>
+    db?.engine && (
+      <StyledAlertMargin>
+        <Alert
+          closable={false}
+          css={(theme: SupersetTheme) => antDAlertStyles(theme)}
+          type="info"
+          showIcon
+          message={
+            engineSpecificAlertMapping[db.engine]?.message ||
+            connectionAlert?.DEFAULT?.message
+          }
+          description={
+            engineSpecificAlertMapping[db.engine]?.description ||
+            connectionAlert?.DEFAULT?.description
+          }
+        />
+      </StyledAlertMargin>
+    );
+
   const errorAlert = () => {
     if (
       isEmpty(dbErrors) ||
@@ -1188,18 +1221,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
                   dbName={dbName}
                   dbModel={dbModel}
                 />
-                {connectionAlert && (
-                  <StyledAlertMargin>
-                    <Alert
-                      closable={false}
-                      css={(theme: SupersetTheme) => antDAlertStyles(theme)}
-                      type="info"
-                      showIcon
-                      message={t('IP Allowlist')}
-                      description={connectionAlert.ALLOWED_IPS}
-                    />
-                  </StyledAlertMargin>
-                )}
+                {hasAlert && renderStepTwoAlert()}
                 <DatabaseConnectionForm
                   db={db}
                   sslForced={sslForced}