From 8bf6d801553a13552831be0fe8ed41bf5171824c Mon Sep 17 00:00:00 2001
From: wanghong1314 <498213175@qq.com>
Date: Tue, 10 Jan 2023 22:52:07 +0800
Subject: [PATCH 01/15] fix: Stop query in SQL Lab with impala engine (#22635)

---
 superset/config.py                 |  4 +-
 superset/db_engine_specs/hive.py   | 10 +++-
 superset/db_engine_specs/impala.py | 90 ++++++++++++++++++++++++++++++
 superset/views/core.py             |  4 ++
 4 files changed, 105 insertions(+), 3 deletions(-)

diff --git a/superset/config.py b/superset/config.py
index 8a1b5220db92..a3fc3df00ef5 100644
--- a/superset/config.py
+++ b/superset/config.py
@@ -1131,8 +1131,8 @@ def CSV_TO_HIVE_UPLOAD_DIRECTORY_FUNC(  # pylint: disable=invalid-name
 TRACKING_URL_TRANSFORMER = lambda url: url
 
 
-# Interval between consecutive polls when using Hive Engine
-HIVE_POLL_INTERVAL = int(timedelta(seconds=5).total_seconds())
+# customize the polling time of each engine
+DB_POLL_INTERVAL_SECONDS: Dict[str, int] = {}
 
 # Interval between consecutive polls when using Presto Engine
 # See here: https://github.com/dropbox/PyHive/blob/8eb0aeab8ca300f3024655419b93dad926c1a351/pyhive/presto.py#L93  # pylint: disable=line-too-long,useless-suppression
diff --git a/superset/db_engine_specs/hive.py b/superset/db_engine_specs/hive.py
index c69908976728..1d27978e9d23 100644
--- a/superset/db_engine_specs/hive.py
+++ b/superset/db_engine_specs/hive.py
@@ -375,7 +375,15 @@ def handle_cursor(  # pylint: disable=too-many-locals
                     last_log_line = len(log_lines)
                 if needs_commit:
                     session.commit()
-            time.sleep(current_app.config["HIVE_POLL_INTERVAL"])
+            if sleep_interval := current_app.config.get("HIVE_POLL_INTERVAL"):
+                logger.warning(
+                    "HIVE_POLL_INTERVAL is deprecated and will be removed in 3.0. Please use DB_POLL_INTERVAL_SECONDS instead"
+                )
+            else:
+                sleep_interval = current_app.config["DB_POLL_INTERVAL_SECONDS"].get(
+                    cls.engine, 5
+                )
+            time.sleep(sleep_interval)
             polled = cursor.poll()
 
     @classmethod
diff --git a/superset/db_engine_specs/impala.py b/superset/db_engine_specs/impala.py
index 048588c046fd..177a9728fe0f 100644
--- a/superset/db_engine_specs/impala.py
+++ b/superset/db_engine_specs/impala.py
@@ -14,14 +14,25 @@
 # KIND, either express or implied.  See the License for the
 # specific language governing permissions and limitations
 # under the License.
+import logging
+import re
+import time
 from datetime import datetime
 from typing import Any, Dict, List, Optional
 
+from flask import current_app
 from sqlalchemy.engine.reflection import Inspector
+from sqlalchemy.orm import Session
 
+from superset.constants import QUERY_EARLY_CANCEL_KEY
 from superset.db_engine_specs.base import BaseEngineSpec
+from superset.models.sql_lab import Query
 from superset.utils import core as utils
 
+logger = logging.getLogger(__name__)
+# Query 5543ffdf692b7d02:f78a944000000000: 3% Complete (17 out of 547)
+QUERY_PROGRESS_REGEX = re.compile(r"Query.*: (?P<query_progress>[0-9]+)%")
+
 
 class ImpalaEngineSpec(BaseEngineSpec):
     """Engine spec for Cloudera's Impala"""
@@ -63,3 +74,82 @@ def get_schema_names(cls, inspector: Inspector) -> List[str]:
             if not row[0].startswith("_")
         ]
         return schemas
+
+    @classmethod
+    def has_implicit_cancel(cls) -> bool:
+        """
+        Return True if the live cursor handles the implicit cancelation of the query,
+        False otherise.
+
+        :return: Whether the live cursor implicitly cancels the query
+        :see: handle_cursor
+        """
+
+        return True
+
+    @classmethod
+    def execute(
+        cls,
+        cursor: Any,
+        query: str,
+        **kwargs: Any,  # pylint: disable=unused-argument
+    ) -> None:
+        try:
+            cursor.execute_async(query)
+        except Exception as ex:
+            raise cls.get_dbapi_mapped_exception(ex)
+
+    @classmethod
+    def handle_cursor(cls, cursor: Any, query: Query, session: Session) -> None:
+        """Stop query and updates progress information"""
+
+        query_id = query.id
+        unfinished_states = (
+            "INITIALIZED_STATE",
+            "RUNNING_STATE",
+        )
+
+        try:
+            status = cursor.status()
+            while status in unfinished_states:
+                session.refresh(query)
+                query = session.query(Query).filter_by(id=query_id).one()
+                # if query cancelation was requested prior to the handle_cursor call, but
+                # the query was still executed
+                # modified in stop_query in views / core.py is reflected  here.
+                # stop query
+                if query.extra.get(QUERY_EARLY_CANCEL_KEY):
+                    cursor.cancel_operation()
+                    cursor.close_operation()
+                    cursor.close()
+                    break
+
+                #  updates progress info by log
+                try:
+                    log = cursor.get_log() or ""
+                except Exception:  # pylint: disable=broad-except
+                    logger.warning("Call to GetLog() failed")
+                    log = ""
+
+                if log:
+                    match = QUERY_PROGRESS_REGEX.match(log)
+                    if match:
+                        progress = int(match.groupdict()["query_progress"])
+                    logger.debug(
+                        "Query %s: Progress total: %s", str(query_id), str(progress)
+                    )
+                    needs_commit = False
+                    if progress > query.progress:
+                        query.progress = progress
+                        needs_commit = True
+
+                    if needs_commit:
+                        session.commit()
+                sleep_interval = current_app.config["DB_POLL_INTERVAL_SECONDS"].get(
+                    cls.engine, 5
+                )
+                time.sleep(sleep_interval)
+                status = cursor.status()
+        except Exception:  # pylint: disable=broad-except
+            logger.debug("Call to status() failed ")
+            return
diff --git a/superset/views/core.py b/superset/views/core.py
index d0db5e9b2e94..34e59947e7dd 100755
--- a/superset/views/core.py
+++ b/superset/views/core.py
@@ -67,6 +67,7 @@
     SqlMetric,
     TableColumn,
 )
+from superset.constants import QUERY_EARLY_CANCEL_KEY
 from superset.dashboards.commands.importers.v0 import ImportDashboardsCommand
 from superset.dashboards.dao import DashboardDAO
 from superset.dashboards.permalink.commands.get import GetDashboardPermalinkCommand
@@ -2318,6 +2319,9 @@ def stop_query(self) -> FlaskResponse:
             raise SupersetCancelQueryException("Could not cancel query")
 
         query.status = QueryStatus.STOPPED
+        # Add the stop identity attribute because the sqlalchemy thread is unsafe
+        # because of multiple updates to the status in the query table
+        query.set_extra_json_key(QUERY_EARLY_CANCEL_KEY, True)
         query.end_time = now_as_float()
         db.session.commit()
 

From 399f6e3ddc8bb21fd7b39cdf850510b2692fbe12 Mon Sep 17 00:00:00 2001
From: Kamil Gabryjelski <kamil.gabryjelski@gmail.com>
Date: Tue, 10 Jan 2023 16:48:51 +0100
Subject: [PATCH 02/15] feat(dashboard): Display a loading spinner while
 dashboard is being saved (#22588)

---
 .../src/dashboard/actions/dashboardState.js        | 14 ++++++++++++++
 .../src/dashboard/actions/dashboardState.test.js   |  8 +++++---
 superset-frontend/src/dashboard/actions/hydrate.js |  1 +
 .../DashboardBuilder/DashboardBuilder.test.tsx     | 14 ++++++++++++++
 .../DashboardBuilder/DashboardBuilder.tsx          | 12 ++++++++++++
 .../src/dashboard/reducers/dashboardState.js       | 14 ++++++++++++++
 superset-frontend/src/dashboard/types.ts           |  1 +
 7 files changed, 61 insertions(+), 3 deletions(-)

diff --git a/superset-frontend/src/dashboard/actions/dashboardState.js b/superset-frontend/src/dashboard/actions/dashboardState.js
index 9bbe618c88da..518dd7b5dc31 100644
--- a/superset-frontend/src/dashboard/actions/dashboardState.js
+++ b/superset-frontend/src/dashboard/actions/dashboardState.js
@@ -203,9 +203,20 @@ export function setOverrideConfirm(overwriteConfirmMetadata) {
   };
 }
 
+export const SAVE_DASHBOARD_STARTED = 'SAVE_DASHBOARD_STARTED';
+export function saveDashboardStarted() {
+  return { type: SAVE_DASHBOARD_STARTED };
+}
+
+export const SAVE_DASHBOARD_FINISHED = 'SAVE_DASHBOARD_FINISHED';
+export function saveDashboardFinished() {
+  return { type: SAVE_DASHBOARD_FINISHED };
+}
+
 export function saveDashboardRequest(data, id, saveType) {
   return (dispatch, getState) => {
     dispatch({ type: UPDATE_COMPONENTS_PARENTS_LIST });
+    dispatch(saveDashboardStarted());
 
     const { dashboardFilters, dashboardLayout } = getState();
     const layout = dashboardLayout.present;
@@ -291,6 +302,7 @@ export function saveDashboardRequest(data, id, saveType) {
         const chartConfiguration = handleChartConfiguration();
         dispatch(setChartConfiguration(chartConfiguration));
       }
+      dispatch(saveDashboardFinished());
       dispatch(addSuccessToast(t('This dashboard was saved successfully.')));
       return response;
     };
@@ -322,6 +334,7 @@ export function saveDashboardRequest(data, id, saveType) {
       if (lastModifiedTime) {
         dispatch(saveDashboardRequestSuccess(lastModifiedTime));
       }
+      dispatch(saveDashboardFinished());
       // redirect to the new slug or id
       window.history.pushState(
         { event: 'dashboard_properties_changed' },
@@ -347,6 +360,7 @@ export function saveDashboardRequest(data, id, saveType) {
       if (typeof message === 'string' && message === 'Forbidden') {
         errorText = t('You do not have permission to edit this dashboard');
       }
+      dispatch(saveDashboardFinished());
       dispatch(addDangerToast(errorText));
     };
 
diff --git a/superset-frontend/src/dashboard/actions/dashboardState.test.js b/superset-frontend/src/dashboard/actions/dashboardState.test.js
index 25aa54ed6638..00b358bc4397 100644
--- a/superset-frontend/src/dashboard/actions/dashboardState.test.js
+++ b/superset-frontend/src/dashboard/actions/dashboardState.test.js
@@ -22,6 +22,7 @@ import { waitFor } from '@testing-library/react';
 
 import {
   removeSliceFromDashboard,
+  SAVE_DASHBOARD_STARTED,
   saveDashboardRequest,
   SET_OVERRIDE_CONFIRM,
 } from 'src/dashboard/actions/dashboardState';
@@ -104,10 +105,11 @@ describe('dashboardState actions', () => {
       });
       const thunk = saveDashboardRequest(newDashboardData, 1, 'save_dash');
       thunk(dispatch, getState);
-      expect(dispatch.callCount).toBe(1);
+      expect(dispatch.callCount).toBe(2);
       expect(dispatch.getCall(0).args[0].type).toBe(
         UPDATE_COMPONENTS_PARENTS_LIST,
       );
+      expect(dispatch.getCall(1).args[0].type).toBe(SAVE_DASHBOARD_STARTED);
     });
 
     it('should post dashboard data with updated redux state', () => {
@@ -162,10 +164,10 @@ describe('dashboardState actions', () => {
         expect(getStub.callCount).toBe(1);
         expect(postStub.callCount).toBe(0);
         await waitFor(() =>
-          expect(dispatch.getCall(1).args[0].type).toBe(SET_OVERRIDE_CONFIRM),
+          expect(dispatch.getCall(2).args[0].type).toBe(SET_OVERRIDE_CONFIRM),
         );
         expect(
-          dispatch.getCall(1).args[0].overwriteConfirmMetadata.dashboardId,
+          dispatch.getCall(2).args[0].overwriteConfirmMetadata.dashboardId,
         ).toBe(id);
       });
 
diff --git a/superset-frontend/src/dashboard/actions/hydrate.js b/superset-frontend/src/dashboard/actions/hydrate.js
index 917492bd7b20..ed359a8cee10 100644
--- a/superset-frontend/src/dashboard/actions/hydrate.js
+++ b/superset-frontend/src/dashboard/actions/hydrate.js
@@ -454,6 +454,7 @@ export const hydrateDashboard =
           editMode: canEdit && editMode,
           isPublished: dashboard.published,
           hasUnsavedChanges: false,
+          dashboardIsSaving: false,
           maxUndoHistoryExceeded: false,
           lastModifiedTime: dashboard.changed_on,
           isRefreshing: false,
diff --git a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.test.tsx b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.test.tsx
index 65969e2ca6d7..b5f249b89602 100644
--- a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.test.tsx
+++ b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.test.tsx
@@ -249,6 +249,20 @@ describe('DashboardBuilder', () => {
     (setDirectPathToChild as jest.Mock).mockReset();
   });
 
+  it('should not display a loading spinner when saving is not in progress', () => {
+    const { queryByAltText } = setup();
+
+    expect(queryByAltText('Loading...')).not.toBeInTheDocument();
+  });
+
+  it('should display a loading spinner when saving is in progress', async () => {
+    const { findByAltText } = setup({
+      dashboardState: { dashboardIsSaving: true },
+    });
+
+    expect(await findByAltText('Loading...')).toBeVisible();
+  });
+
   describe('when nativeFiltersEnabled', () => {
     beforeEach(() => {
       (isFeatureEnabled as jest.Mock).mockImplementation(
diff --git a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
index d2ce6a2f1a3e..ab14c4d93205 100644
--- a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
+++ b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
@@ -246,6 +246,9 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
   const canEdit = useSelector<RootState, boolean>(
     ({ dashboardInfo }) => dashboardInfo.dash_edit_perm,
   );
+  const dashboardIsSaving = useSelector<RootState, boolean>(
+    ({ dashboardState }) => dashboardState.dashboardIsSaving,
+  );
   const nativeFilters = useSelector((state: RootState) => state.nativeFilters);
   const focusedFilterId = nativeFilters?.focusedFilterId;
   const fullSizeChartId = useSelector<RootState, number | null>(
@@ -533,6 +536,15 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
           </StyledDashboardContent>
         </div>
       </StyledContent>
+      {dashboardIsSaving && (
+        <Loading
+          css={css`
+            && {
+              position: fixed;
+            }
+          `}
+        />
+      )}
     </StyledDiv>
   );
 };
diff --git a/superset-frontend/src/dashboard/reducers/dashboardState.js b/superset-frontend/src/dashboard/reducers/dashboardState.js
index 1c339001d17d..5d81cd8ac11f 100644
--- a/superset-frontend/src/dashboard/reducers/dashboardState.js
+++ b/superset-frontend/src/dashboard/reducers/dashboardState.js
@@ -43,6 +43,8 @@ import {
   ON_FILTERS_REFRESH_SUCCESS,
   SET_DATASETS_STATUS,
   SET_OVERRIDE_CONFIRM,
+  SAVE_DASHBOARD_STARTED,
+  SAVE_DASHBOARD_FINISHED,
 } from '../actions/dashboardState';
 import { HYDRATE_DASHBOARD } from '../actions/hydrate';
 
@@ -111,6 +113,18 @@ export default function dashboardStateReducer(state = {}, action) {
     [ON_CHANGE]() {
       return { ...state, hasUnsavedChanges: true };
     },
+    [SAVE_DASHBOARD_STARTED]() {
+      return {
+        ...state,
+        dashboardIsSaving: true,
+      };
+    },
+    [SAVE_DASHBOARD_FINISHED]() {
+      return {
+        ...state,
+        dashboardIsSaving: false,
+      };
+    },
     [ON_SAVE]() {
       return {
         ...state,
diff --git a/superset-frontend/src/dashboard/types.ts b/superset-frontend/src/dashboard/types.ts
index 1bdd1c14a1c7..e24356be6191 100644
--- a/superset-frontend/src/dashboard/types.ts
+++ b/superset-frontend/src/dashboard/types.ts
@@ -70,6 +70,7 @@ export type DashboardState = {
   isRefreshing: boolean;
   isFiltersRefreshing: boolean;
   hasUnsavedChanges: boolean;
+  dashboardIsSaving: boolean;
   colorScheme: string;
   sliceIds: number[];
   directPathLastUpdated: number;

From 1e3746be215e5c2060b00d4c3196518f7c71697a Mon Sep 17 00:00:00 2001
From: Artem Shumeiko <53895552+artemonsh@users.noreply.github.com>
Date: Tue, 10 Jan 2023 19:10:46 +0300
Subject: [PATCH 03/15] fix(dockerfile): fix "unhealthy" container state
 (#22663)

---
 Dockerfile | 1 +
 1 file changed, 1 insertion(+)

diff --git a/Dockerfile b/Dockerfile
index a0aed973e5f0..a30eaaa165dc 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -58,6 +58,7 @@ RUN mkdir -p ${PYTHONPATH} \
         && apt-get update -y \
         && apt-get install -y --no-install-recommends \
             build-essential \
+            curl \
             default-libmysqlclient-dev \
             libsasl2-dev \
             libsasl2-modules-gssapi-mit \

From 08f45ef207fb159bf0de49dd0a90f423c77965a7 Mon Sep 17 00:00:00 2001
From: Ville Brofeldt <33317356+villebro@users.noreply.github.com>
Date: Tue, 10 Jan 2023 19:08:30 +0200
Subject: [PATCH 04/15] fix(viz-gallery): respect denylist in viz gallery
 (#22658)

---
 .../spec/helpers/reducerIndex.ts              |  8 ++---
 superset-frontend/spec/helpers/setup.ts       |  2 +-
 superset-frontend/src/SqlLab/App.jsx          |  4 +--
 .../components/ScheduleQueryButton/index.tsx  |  6 ++--
 .../src/SqlLab/components/SqlEditor/index.jsx |  6 ++--
 .../components/TabbedSqlEditors/index.jsx     |  8 ++---
 .../src/addSlice/AddSliceContainer.test.tsx   |  2 +-
 .../src/addSlice/AddSliceContainer.tsx        |  5 +++
 .../src/dashboard/components/Dashboard.jsx    |  4 +--
 superset-frontend/src/embedded/api.tsx        |  4 ++-
 superset-frontend/src/embedded/index.tsx      |  3 +-
 .../VizTypeControl/VizTypeControl.test.tsx    |  2 +-
 .../VizTypeControl/VizTypeGallery.tsx         |  2 ++
 .../controls/VizTypeControl/index.tsx         |  4 +++
 .../src/middleware/asyncEvent.ts              | 17 ++--------
 superset-frontend/src/preamble.ts             | 31 ++++++-------------
 superset-frontend/src/profile/App.tsx         |  8 ++---
 .../src/profile/components/App.tsx            |  4 +--
 .../src/profile/components/CreatedContent.tsx |  6 ++--
 .../src/profile/components/Favorites.tsx      |  7 ++---
 .../src/profile/components/RecentActivity.tsx |  6 ++--
 .../src/profile/components/Security.tsx       | 13 ++++----
 .../src/profile/components/UserInfo.tsx       | 19 ++++++------
 .../src/showSavedQuery/index.jsx              |  5 ++-
 .../src/utils/getBootstrapData.ts             |  3 +-
 .../src/utils/hostNamesConfig.js              |  5 +--
 superset-frontend/src/views/App.tsx           | 15 ++++-----
 .../src/views/CRUD/chart/ChartList.tsx        |  6 ++--
 .../views/CRUD/dashboard/DashboardList.tsx    |  4 ++-
 .../src/views/RootContextProviders.tsx        |  6 ++--
 superset-frontend/src/views/menu.tsx          |  7 ++---
 superset-frontend/src/views/store.ts          | 11 ++++---
 superset/views/base.py                        |  1 +
 33 files changed, 111 insertions(+), 123 deletions(-)

diff --git a/superset-frontend/spec/helpers/reducerIndex.ts b/superset-frontend/spec/helpers/reducerIndex.ts
index edfaf7bb5c8c..459a112e2201 100644
--- a/superset-frontend/spec/helpers/reducerIndex.ts
+++ b/superset-frontend/spec/helpers/reducerIndex.ts
@@ -31,13 +31,13 @@ import explore from 'src/explore/reducers/exploreReducer';
 import sqlLab from 'src/SqlLab/reducers/sqlLab';
 import localStorageUsageInKilobytes from 'src/SqlLab/reducers/localStorageUsage';
 import reports from 'src/reports/reducers/reports';
+import getBootstrapData from 'src/utils/getBootstrapData';
 
 const impressionId = (state = '') => state;
 
-const container = document.getElementById('app');
-const bootstrap = JSON.parse(container?.getAttribute('data-bootstrap') ?? '{}');
-const common = { ...bootstrap.common };
-const user = { ...bootstrap.user };
+const bootstrapData = getBootstrapData();
+const common = { ...bootstrapData.common };
+const user = { ...bootstrapData.user };
 
 const noopReducer =
   (initialState: unknown) =>
diff --git a/superset-frontend/spec/helpers/setup.ts b/superset-frontend/spec/helpers/setup.ts
index bd2961e23cec..281ab4ae4bb1 100644
--- a/superset-frontend/spec/helpers/setup.ts
+++ b/superset-frontend/spec/helpers/setup.ts
@@ -25,5 +25,5 @@ configureTestingLibrary({
   testIdAttribute: 'data-test',
 });
 
-document.body.innerHTML = '<div id="app" data-bootstrap="{}"></div>';
+document.body.innerHTML = '<div id="app" data-bootstrap=""></div>';
 expect.extend(matchers);
diff --git a/superset-frontend/src/SqlLab/App.jsx b/superset-frontend/src/SqlLab/App.jsx
index 812202eec20f..4a300958031d 100644
--- a/superset-frontend/src/SqlLab/App.jsx
+++ b/superset-frontend/src/SqlLab/App.jsx
@@ -30,6 +30,7 @@ import {
   FeatureFlag,
 } from 'src/featureFlags';
 import setupExtensions from 'src/setup/setupExtensions';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import getInitialState from './reducers/getInitialState';
 import rootReducer from './reducers/index';
 import { initEnhancer } from '../reduxUtils';
@@ -48,8 +49,7 @@ import { theme } from '../preamble';
 setupApp();
 setupExtensions();
 
-const appContainer = document.getElementById('app');
-const bootstrapData = JSON.parse(appContainer.getAttribute('data-bootstrap'));
+const bootstrapData = getBootstrapData();
 
 initFeatureFlags(bootstrapData.common.feature_flags);
 
diff --git a/superset-frontend/src/SqlLab/components/ScheduleQueryButton/index.tsx b/superset-frontend/src/SqlLab/components/ScheduleQueryButton/index.tsx
index 780bc4d96d70..c78e2bd32d0b 100644
--- a/superset-frontend/src/SqlLab/components/ScheduleQueryButton/index.tsx
+++ b/superset-frontend/src/SqlLab/components/ScheduleQueryButton/index.tsx
@@ -25,11 +25,9 @@ import * as chrono from 'chrono-node';
 import ModalTrigger, { ModalTriggerRef } from 'src/components/ModalTrigger';
 import { Form, FormItem } from 'src/components/Form';
 import Button from 'src/components/Button';
+import getBootstrapData from 'src/utils/getBootstrapData';
 
-const appContainer = document.getElementById('app');
-const bootstrapData = JSON.parse(
-  appContainer?.getAttribute('data-bootstrap') || '{}',
-);
+const bootstrapData = getBootstrapData();
 const scheduledQueriesConf = bootstrapData?.common?.conf?.SCHEDULED_QUERIES;
 
 const validators = {
diff --git a/superset-frontend/src/SqlLab/components/SqlEditor/index.jsx b/superset-frontend/src/SqlLab/components/SqlEditor/index.jsx
index 8e48cbefbe69..e27f6c1e0be2 100644
--- a/superset-frontend/src/SqlLab/components/SqlEditor/index.jsx
+++ b/superset-frontend/src/SqlLab/components/SqlEditor/index.jsx
@@ -74,6 +74,7 @@ import {
 } from 'src/utils/localStorageHelpers';
 import { FeatureFlag, isFeatureEnabled } from 'src/featureFlags';
 import { EmptyStateBig } from 'src/components/EmptyState';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import { isEmpty } from 'lodash';
 import TemplateParamsEditor from '../TemplateParamsEditor';
 import SouthPane from '../SouthPane';
@@ -86,10 +87,7 @@ import AceEditorWrapper from '../AceEditorWrapper';
 import RunQueryActionButton from '../RunQueryActionButton';
 import QueryLimitSelect from '../QueryLimitSelect';
 
-const appContainer = document.getElementById('app');
-const bootstrapData = JSON.parse(
-  appContainer.getAttribute('data-bootstrap') || '{}',
-);
+const bootstrapData = getBootstrapData();
 const validatorMap =
   bootstrapData?.common?.conf?.SQL_VALIDATORS_BY_ENGINE || {};
 const scheduledQueriesConf = bootstrapData?.common?.conf?.SCHEDULED_QUERIES;
diff --git a/superset-frontend/src/SqlLab/components/TabbedSqlEditors/index.jsx b/superset-frontend/src/SqlLab/components/TabbedSqlEditors/index.jsx
index 63c7cc862caf..ca53fed70947 100644
--- a/superset-frontend/src/SqlLab/components/TabbedSqlEditors/index.jsx
+++ b/superset-frontend/src/SqlLab/components/TabbedSqlEditors/index.jsx
@@ -28,6 +28,7 @@ import { Tooltip } from 'src/components/Tooltip';
 import { detectOS } from 'src/utils/common';
 import * as Actions from 'src/SqlLab/actions/sqlLab';
 import { EmptyStateBig } from 'src/components/EmptyState';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import SqlEditor from '../SqlEditor';
 import SqlEditorTabHeader from '../SqlEditorTabHeader';
 
@@ -106,13 +107,10 @@ class TabbedSqlEditors extends React.PureComponent {
     }
 
     // merge post form data with GET search params
-    // Hack: this data should be comming from getInitialState
+    // Hack: this data should be coming from getInitialState
     // but for some reason this data isn't being passed properly through
     // the reducer.
-    const appContainer = document.getElementById('app');
-    const bootstrapData = JSON.parse(
-      appContainer?.getAttribute('data-bootstrap') || '{}',
-    );
+    const bootstrapData = getBootstrapData();
     const query = {
       ...bootstrapData.requested_query,
       ...URI(window.location).search(true),
diff --git a/superset-frontend/src/addSlice/AddSliceContainer.test.tsx b/superset-frontend/src/addSlice/AddSliceContainer.test.tsx
index e5f62fd258eb..1e26c849955d 100644
--- a/superset-frontend/src/addSlice/AddSliceContainer.test.tsx
+++ b/superset-frontend/src/addSlice/AddSliceContainer.test.tsx
@@ -84,7 +84,7 @@ async function getWrapper(user = mockUser) {
   return wrapper;
 }
 
-test('renders a select and a VizTypeControl', async () => {
+test('renders a select and a VizTypeGallery', async () => {
   const wrapper = await getWrapper();
   expect(wrapper.find(AsyncSelect)).toExist();
   expect(wrapper.find(VizTypeGallery)).toExist();
diff --git a/superset-frontend/src/addSlice/AddSliceContainer.tsx b/superset-frontend/src/addSlice/AddSliceContainer.tsx
index f63c53f3370e..c50bcad9a2a5 100644
--- a/superset-frontend/src/addSlice/AddSliceContainer.tsx
+++ b/superset-frontend/src/addSlice/AddSliceContainer.tsx
@@ -39,6 +39,7 @@ import VizTypeGallery, {
 } from 'src/explore/components/controls/VizTypeControl/VizTypeGallery';
 import { findPermission } from 'src/utils/findPermission';
 import { UserWithPermissionsAndRoles } from 'src/types/bootstrapTypes';
+import getBootstrapData from 'src/utils/getBootstrapData';
 
 type Dataset = {
   id: number;
@@ -62,6 +63,9 @@ export type AddSliceContainerState = {
 const ESTIMATED_NAV_HEIGHT = 56;
 const ELEMENTS_EXCEPT_VIZ_GALLERY = ESTIMATED_NAV_HEIGHT + 250;
 
+const bootstrapData = getBootstrapData();
+const denyList: string[] = bootstrapData.common.conf.VIZ_TYPE_DENYLIST || [];
+
 const StyledContainer = styled.div`
   ${({ theme }) => `
     flex: 1 1 auto;
@@ -395,6 +399,7 @@ export class AddSliceContainer extends React.PureComponent<
             description={
               <StyledStepDescription>
                 <VizTypeGallery
+                  denyList={denyList}
                   className="viz-gallery"
                   onChange={this.changeVizType}
                   onDoubleClick={this.onVizTypeDoubleClick}
diff --git a/superset-frontend/src/dashboard/components/Dashboard.jsx b/superset-frontend/src/dashboard/components/Dashboard.jsx
index 5da8f501f8eb..2df6e668179c 100644
--- a/superset-frontend/src/dashboard/components/Dashboard.jsx
+++ b/superset-frontend/src/dashboard/components/Dashboard.jsx
@@ -22,6 +22,7 @@ import { isFeatureEnabled, t, FeatureFlag } from '@superset-ui/core';
 
 import { PluginContext } from 'src/components/DynamicPlugins';
 import Loading from 'src/components/Loading';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import getChartIdsFromLayout from '../util/getChartIdsFromLayout';
 import getLayoutComponentFromChartId from '../util/getLayoutComponentFromChartId';
 import DashboardBuilder from './DashboardBuilder/DashboardBuilder';
@@ -97,8 +98,7 @@ class Dashboard extends React.PureComponent {
   }
 
   componentDidMount() {
-    const appContainer = document.getElementById('app');
-    const bootstrapData = appContainer?.getAttribute('data-bootstrap') || '{}';
+    const bootstrapData = getBootstrapData();
     const { dashboardState, layout } = this.props;
     const eventData = {
       is_soft_navigation: Logger.timeOriginOffset > 0,
diff --git a/superset-frontend/src/embedded/api.tsx b/superset-frontend/src/embedded/api.tsx
index 675e97ac542f..9d37daf2e01b 100644
--- a/superset-frontend/src/embedded/api.tsx
+++ b/superset-frontend/src/embedded/api.tsx
@@ -16,10 +16,12 @@
  * specific language governing permissions and limitations
  * under the License.
  */
+import getBootstrapData from 'src/utils/getBootstrapData';
 import { store } from '../views/store';
-import { bootstrapData } from '../preamble';
 import { getDashboardPermalink as getDashboardPermalinkUtil } from '../utils/urlUtils';
 
+const bootstrapData = getBootstrapData();
+
 type Size = {
   width: number;
   height: number;
diff --git a/superset-frontend/src/embedded/index.tsx b/superset-frontend/src/embedded/index.tsx
index 832c76a767ca..50c026fba8f9 100644
--- a/superset-frontend/src/embedded/index.tsx
+++ b/superset-frontend/src/embedded/index.tsx
@@ -21,7 +21,7 @@ import ReactDOM from 'react-dom';
 import { BrowserRouter as Router, Route } from 'react-router-dom';
 import { makeApi, t, logging } from '@superset-ui/core';
 import Switchboard from '@superset-ui/switchboard';
-import { bootstrapData } from 'src/preamble';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import setupClient from 'src/setup/setupClient';
 import { RootContextProviders } from 'src/views/RootContextProviders';
 import { store, USER_LOADED } from 'src/views/store';
@@ -33,6 +33,7 @@ import { UserWithPermissionsAndRoles } from 'src/types/bootstrapTypes';
 import { embeddedApi } from './api';
 
 const debugMode = process.env.WEBPACK_MODE === 'development';
+const bootstrapData = getBootstrapData();
 
 function log(...info: unknown[]) {
   if (debugMode) {
diff --git a/superset-frontend/src/explore/components/controls/VizTypeControl/VizTypeControl.test.tsx b/superset-frontend/src/explore/components/controls/VizTypeControl/VizTypeControl.test.tsx
index 2ee9bfab0e56..034b339cda94 100644
--- a/superset-frontend/src/explore/components/controls/VizTypeControl/VizTypeControl.test.tsx
+++ b/superset-frontend/src/explore/components/controls/VizTypeControl/VizTypeControl.test.tsx
@@ -40,7 +40,7 @@ import {
 } from '@superset-ui/plugin-chart-echarts';
 import TableChartPlugin from '@superset-ui/plugin-chart-table';
 import { LineChartPlugin } from '@superset-ui/preset-chart-xy';
-import TimeTableChartPlugin from '../../../../visualizations/TimeTable';
+import TimeTableChartPlugin from 'src/visualizations/TimeTable';
 import VizTypeControl, { VIZ_TYPE_CONTROL_TEST_ID } from './index';
 
 jest.useFakeTimers();
diff --git a/superset-frontend/src/explore/components/controls/VizTypeControl/VizTypeGallery.tsx b/superset-frontend/src/explore/components/controls/VizTypeControl/VizTypeGallery.tsx
index c11ae9f94804..6b1466007512 100644
--- a/superset-frontend/src/explore/components/controls/VizTypeControl/VizTypeGallery.tsx
+++ b/superset-frontend/src/explore/components/controls/VizTypeControl/VizTypeGallery.tsx
@@ -50,6 +50,7 @@ interface VizTypeGalleryProps {
   onDoubleClick: () => void;
   selectedViz: string | null;
   className?: string;
+  denyList: string[];
 }
 
 type VizEntry = {
@@ -506,6 +507,7 @@ export default function VizTypeGallery(props: VizTypeGalleryProps) {
   const chartMetadata: VizEntry[] = useMemo(() => {
     const result = Object.entries(mountedPluginMetadata)
       .map(([key, value]) => ({ key, value }))
+      .filter(({ key }) => !props.denyList.includes(key))
       .filter(
         ({ value }) =>
           nativeFilterGate(value.behaviors || []) && !value.deprecated,
diff --git a/superset-frontend/src/explore/components/controls/VizTypeControl/index.tsx b/superset-frontend/src/explore/components/controls/VizTypeControl/index.tsx
index 2059e1138b38..802c04f8a995 100644
--- a/superset-frontend/src/explore/components/controls/VizTypeControl/index.tsx
+++ b/superset-frontend/src/explore/components/controls/VizTypeControl/index.tsx
@@ -27,6 +27,7 @@ import {
 import { usePluginContext } from 'src/components/DynamicPlugins';
 import Modal from 'src/components/Modal';
 import { noOp } from 'src/utils/common';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import VizTypeGallery, {
   MAX_ADVISABLE_VIZ_GALLERY_WIDTH,
 } from './VizTypeGallery';
@@ -41,6 +42,8 @@ interface VizTypeControlProps {
   isModalOpenInit?: boolean;
 }
 
+const bootstrapData = getBootstrapData();
+const denyList: string[] = bootstrapData.common.conf.VIZ_TYPE_DENYLIST || [];
 const metadataRegistry = getChartMetadataRegistry();
 
 export const VIZ_TYPE_CONTROL_TEST_ID = 'viz-type-control';
@@ -141,6 +144,7 @@ const VizTypeControl = ({
           selectedViz={selectedViz}
           onChange={setSelectedViz}
           onDoubleClick={onSubmit}
+          denyList={denyList}
         />
       </UnpaddedModal>
     </>
diff --git a/superset-frontend/src/middleware/asyncEvent.ts b/superset-frontend/src/middleware/asyncEvent.ts
index f76b0a713fbb..f1eee02ab4d5 100644
--- a/superset-frontend/src/middleware/asyncEvent.ts
+++ b/superset-frontend/src/middleware/asyncEvent.ts
@@ -23,6 +23,7 @@ import {
   logging,
 } from '@superset-ui/core';
 import { SupersetError } from 'src/components/ErrorMessage/types';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import { FeatureFlag, isFeatureEnabled } from '../featureFlags';
 import {
   getClientErrorObject,
@@ -235,21 +236,7 @@ export const init = (appConfig?: AppConfig) => {
   retriesByJobId = {};
   lastReceivedEventId = null;
 
-  if (appConfig) {
-    config = appConfig;
-  } else {
-    // load bootstrap data from DOM
-    const appContainer = document.getElementById('app');
-    if (appContainer) {
-      const bootstrapData = JSON.parse(
-        appContainer?.getAttribute('data-bootstrap') || '{}',
-      );
-      config = bootstrapData?.common?.conf;
-    } else {
-      config = {};
-      logging.warn('asyncEvent: app config data not found');
-    }
-  }
+  config = appConfig || getBootstrapData().config;
   transport = config.GLOBAL_ASYNC_QUERIES_TRANSPORT || TRANSPORT_POLLING;
   pollingDelayMs = config.GLOBAL_ASYNC_QUERIES_POLLING_DELAY || 500;
 
diff --git a/superset-frontend/src/preamble.ts b/superset-frontend/src/preamble.ts
index c5026cdb8b79..1d5c2ae10c50 100644
--- a/superset-frontend/src/preamble.ts
+++ b/superset-frontend/src/preamble.ts
@@ -26,47 +26,34 @@ import setupClient from './setup/setupClient';
 import setupColors from './setup/setupColors';
 import setupFormatters from './setup/setupFormatters';
 import setupDashboardComponents from './setup/setupDasboardComponents';
-import { BootstrapData, User } from './types/bootstrapTypes';
+import { User } from './types/bootstrapTypes';
 import { initFeatureFlags } from './featureFlags';
-import { DEFAULT_COMMON_BOOTSTRAP_DATA } from './constants';
+import getBootstrapData from './utils/getBootstrapData';
 
 if (process.env.WEBPACK_MODE === 'development') {
   setHotLoaderConfig({ logLevel: 'debug', trackTailUpdates: false });
 }
 
 // eslint-disable-next-line import/no-mutable-exports
-export let bootstrapData: BootstrapData = {
-  common: {
-    ...DEFAULT_COMMON_BOOTSTRAP_DATA,
-  },
-};
+const bootstrapData = getBootstrapData();
 
 // Configure translation
 if (typeof window !== 'undefined') {
-  const root = document.getElementById('app');
-  bootstrapData = root
-    ? JSON.parse(root.getAttribute('data-bootstrap') || '{}')
-    : {};
-  if (bootstrapData?.common?.language_pack) {
-    const languagePack = bootstrapData.common.language_pack;
-    configure({ languagePack });
-    moment.locale(bootstrapData.common.locale);
-  } else {
-    configure();
-  }
+  configure({ languagePack: bootstrapData.common.language_pack });
+  moment.locale(bootstrapData.common.locale);
 } else {
   configure();
 }
 
 // Configure feature flags
-initFeatureFlags(bootstrapData?.common?.feature_flags);
+initFeatureFlags(bootstrapData.common.feature_flags);
 
 // Setup SupersetClient
 setupClient();
 
 setupColors(
-  bootstrapData?.common?.extra_categorical_color_schemes,
-  bootstrapData?.common?.extra_sequential_color_schemes,
+  bootstrapData.common.extra_categorical_color_schemes,
+  bootstrapData.common.extra_sequential_color_schemes,
 );
 
 // Setup number formatters
@@ -76,7 +63,7 @@ setupDashboardComponents();
 
 export const theme = merge(
   supersetTheme,
-  bootstrapData?.common?.theme_overrides ?? {},
+  bootstrapData.common.theme_overrides ?? {},
 );
 
 const getMe = makeApi<void, User>({
diff --git a/superset-frontend/src/profile/App.tsx b/superset-frontend/src/profile/App.tsx
index 3704dcb4b5f4..ed331ce73725 100644
--- a/superset-frontend/src/profile/App.tsx
+++ b/superset-frontend/src/profile/App.tsx
@@ -30,14 +30,12 @@ import setupApp from 'src/setup/setupApp';
 import setupExtensions from 'src/setup/setupExtensions';
 import { theme } from 'src/preamble';
 import ToastContainer from 'src/components/MessageToasts/ToastContainer';
+import getBootstrapData from 'src/utils/getBootstrapData';
 
 setupApp();
 setupExtensions();
 
-const profileViewContainer = document.getElementById('app');
-const bootstrap = JSON.parse(
-  profileViewContainer?.getAttribute('data-bootstrap') ?? '{}',
-);
+const bootstrapData = getBootstrapData();
 
 const store = createStore(
   combineReducers({
@@ -51,7 +49,7 @@ const Application = () => (
   <Provider store={store}>
     <ThemeProvider theme={theme}>
       <GlobalStyles />
-      <App user={bootstrap.user} />
+      <App user={bootstrapData.user} />
       <ToastContainer />
     </ThemeProvider>
   </Provider>
diff --git a/superset-frontend/src/profile/components/App.tsx b/superset-frontend/src/profile/components/App.tsx
index e2c910abd2f5..08130176fe61 100644
--- a/superset-frontend/src/profile/components/App.tsx
+++ b/superset-frontend/src/profile/components/App.tsx
@@ -20,7 +20,7 @@ import React from 'react';
 import { t, styled } from '@superset-ui/core';
 import { Row, Col } from 'src/components';
 import Tabs from 'src/components/Tabs';
-import { UserWithPermissionsAndRoles } from 'src/types/bootstrapTypes';
+import { BootstrapUser } from 'src/types/bootstrapTypes';
 import Favorites from './Favorites';
 import UserInfo from './UserInfo';
 import Security from './Security';
@@ -28,7 +28,7 @@ import RecentActivity from './RecentActivity';
 import CreatedContent from './CreatedContent';
 
 interface AppProps {
-  user: UserWithPermissionsAndRoles;
+  user: BootstrapUser;
 }
 
 const StyledTabPane = styled(Tabs.TabPane)`
diff --git a/superset-frontend/src/profile/components/CreatedContent.tsx b/superset-frontend/src/profile/components/CreatedContent.tsx
index e32fde86b1d2..a972ea5db90f 100644
--- a/superset-frontend/src/profile/components/CreatedContent.tsx
+++ b/superset-frontend/src/profile/components/CreatedContent.tsx
@@ -22,13 +22,13 @@ import { t } from '@superset-ui/core';
 
 import TableLoader from 'src/components/TableLoader';
 import {
-  User,
-  DashboardResponse,
+  BootstrapUser,
   ChartResponse,
+  DashboardResponse,
 } from 'src/types/bootstrapTypes';
 
 interface CreatedContentProps {
-  user: User;
+  user: BootstrapUser;
 }
 
 class CreatedContent extends React.PureComponent<CreatedContentProps> {
diff --git a/superset-frontend/src/profile/components/Favorites.tsx b/superset-frontend/src/profile/components/Favorites.tsx
index 1a7daa750f06..1e28cd989aab 100644
--- a/superset-frontend/src/profile/components/Favorites.tsx
+++ b/superset-frontend/src/profile/components/Favorites.tsx
@@ -20,13 +20,12 @@ import React from 'react';
 import rison from 'rison';
 import moment from 'moment';
 import { t } from '@superset-ui/core';
-
+import { DashboardResponse, BootstrapUser } from 'src/types/bootstrapTypes';
 import TableLoader from '../../components/TableLoader';
 import { Slice } from '../types';
-import { User, DashboardResponse } from '../../types/bootstrapTypes';
 
 interface FavoritesProps {
-  user: User;
+  user: BootstrapUser;
 }
 
 export default class Favorites extends React.PureComponent<FavoritesProps> {
@@ -40,7 +39,7 @@ export default class Favorites extends React.PureComponent<FavoritesProps> {
       }));
     return (
       <TableLoader
-        dataEndpoint={`/superset/fave_slices/${this.props.user.userId}/`}
+        dataEndpoint={`/superset/fave_slices/${this.props.user?.userId}/`}
         className="table-condensed"
         columns={['slice', 'creator', 'favorited']}
         mutator={mutator}
diff --git a/superset-frontend/src/profile/components/RecentActivity.tsx b/superset-frontend/src/profile/components/RecentActivity.tsx
index d1bb83866b5c..4c1e81cb7cdb 100644
--- a/superset-frontend/src/profile/components/RecentActivity.tsx
+++ b/superset-frontend/src/profile/components/RecentActivity.tsx
@@ -21,10 +21,10 @@ import moment from 'moment';
 
 import TableLoader from '../../components/TableLoader';
 import { Activity } from '../types';
-import { User } from '../../types/bootstrapTypes';
+import { BootstrapUser } from '../../types/bootstrapTypes';
 
 interface RecentActivityProps {
-  user: User;
+  user: BootstrapUser;
 }
 
 export default function RecentActivity({ user }: RecentActivityProps) {
@@ -45,7 +45,7 @@ export default function RecentActivity({ user }: RecentActivityProps) {
         className="table-condensed"
         mutator={mutator}
         sortable
-        dataEndpoint={`/superset/recent_activity/${user.userId}/?limit=${rowLimit}`}
+        dataEndpoint={`/superset/recent_activity/${user?.userId}/?limit=${rowLimit}`}
       />
     </div>
   );
diff --git a/superset-frontend/src/profile/components/Security.tsx b/superset-frontend/src/profile/components/Security.tsx
index 078fc42e4c74..a102e5599287 100644
--- a/superset-frontend/src/profile/components/Security.tsx
+++ b/superset-frontend/src/profile/components/Security.tsx
@@ -21,10 +21,10 @@ import Badge from 'src/components/Badge';
 import { t } from '@superset-ui/core';
 
 import Label from 'src/components/Label';
-import { UserWithPermissionsAndRoles } from '../../types/bootstrapTypes';
+import { BootstrapUser } from 'src/types/bootstrapTypes';
 
 interface SecurityProps {
-  user: UserWithPermissionsAndRoles;
+  user: BootstrapUser;
 }
 
 export default function Security({ user }: SecurityProps) {
@@ -32,15 +32,16 @@ export default function Security({ user }: SecurityProps) {
     <div>
       <div className="roles">
         <h4>
-          {t('Roles')} <Badge count={Object.keys(user.roles).length} showZero />
+          {t('Roles')}{' '}
+          <Badge count={Object.keys(user?.roles || {}).length} showZero />
         </h4>
-        {Object.keys(user.roles).map(role => (
+        {Object.keys(user?.roles || {}).map(role => (
           <Label key={role}>{role}</Label>
         ))}
         <hr />
       </div>
       <div className="databases">
-        {user.permissions.database_access && (
+        {user?.permissions.database_access && (
           <div>
             <h4>
               {t('Databases')}{' '}
@@ -54,7 +55,7 @@ export default function Security({ user }: SecurityProps) {
         )}
       </div>
       <div className="datasources">
-        {user.permissions.datasource_access && (
+        {user?.permissions.datasource_access && (
           <div>
             <h4>
               {t('Datasets')}{' '}
diff --git a/superset-frontend/src/profile/components/UserInfo.tsx b/superset-frontend/src/profile/components/UserInfo.tsx
index 887b4ec50c13..6b44e35caeaf 100644
--- a/superset-frontend/src/profile/components/UserInfo.tsx
+++ b/superset-frontend/src/profile/components/UserInfo.tsx
@@ -20,10 +20,10 @@ import React from 'react';
 import Gravatar from 'react-gravatar';
 import moment from 'moment';
 import { t, styled } from '@superset-ui/core';
-import { UserWithPermissionsAndRoles } from '../../types/bootstrapTypes';
+import { BootstrapUser } from 'src/types/bootstrapTypes';
 
 interface UserInfoProps {
-  user: UserWithPermissionsAndRoles;
+  user: BootstrapUser;
 }
 
 const StyledContainer = styled.div`
@@ -37,7 +37,7 @@ export default function UserInfo({ user }: UserInfoProps) {
     <StyledContainer>
       <a href="https://en.gravatar.com/">
         <Gravatar
-          email={user.email}
+          email={user?.email}
           width="100%"
           height=""
           size={220}
@@ -51,29 +51,30 @@ export default function UserInfo({ user }: UserInfoProps) {
         <div className="header">
           <h3>
             <strong>
-              {user.firstName} {user.lastName}
+              {user?.firstName} {user?.lastName}
             </strong>
           </h3>
           <h4 className="username">
-            <i className="fa fa-user-o" /> {user.username}
+            <i className="fa fa-user-o" /> {user?.username}
           </h4>
         </div>
         <hr />
         <p>
           <i className="fa fa-clock-o" data-test="clock-icon-test" />{' '}
-          {t('joined')} {moment(user.createdOn, 'YYYYMMDD').fromNow()}
+          {t('joined')} {moment(user?.createdOn, 'YYYYMMDD').fromNow()}
         </p>
         <p className="email">
-          <i className="fa fa-envelope-o" /> {user.email}
+          <i className="fa fa-envelope-o" /> {user?.email}
         </p>
         <p className="roles">
-          <i className="fa fa-lock" /> {Object.keys(user.roles).join(', ')}
+          <i className="fa fa-lock" />{' '}
+          {Object.keys(user?.roles || {}).join(', ')}
         </p>
         <p>
           <i className="fa fa-key" />
           &nbsp;
           <span className="text-muted">{t('id:')}</span>&nbsp;
-          <span className="user-id">{user.userId}</span>
+          <span className="user-id">{user?.userId}</span>
         </p>
       </div>
     </StyledContainer>
diff --git a/superset-frontend/src/showSavedQuery/index.jsx b/superset-frontend/src/showSavedQuery/index.jsx
index 6b8adcd60d7a..10c09703f720 100644
--- a/superset-frontend/src/showSavedQuery/index.jsx
+++ b/superset-frontend/src/showSavedQuery/index.jsx
@@ -21,11 +21,10 @@ import ReactDom from 'react-dom';
 import Form from 'react-jsonschema-form';
 import { interpolate } from 'src/showSavedQuery/utils';
 import { styled } from '@superset-ui/core';
+import getBootstrapData from 'src/utils/getBootstrapData';
 
 const scheduleInfoContainer = document.getElementById('schedule-info');
-const bootstrapData = JSON.parse(
-  scheduleInfoContainer.getAttribute('data-bootstrap'),
-);
+const bootstrapData = getBootstrapData();
 const config = bootstrapData.common.conf.SCHEDULED_QUERIES;
 const { query } = bootstrapData.common;
 const scheduleInfo = query.extra_json.schedule_info;
diff --git a/superset-frontend/src/utils/getBootstrapData.ts b/superset-frontend/src/utils/getBootstrapData.ts
index e8d708e40dc4..e426498e5738 100644
--- a/superset-frontend/src/utils/getBootstrapData.ts
+++ b/superset-frontend/src/utils/getBootstrapData.ts
@@ -18,9 +18,10 @@
  */
 
 import { BootstrapData } from 'src/types/bootstrapTypes';
+import { DEFAULT_BOOTSTRAP_DATA } from 'src/constants';
 
 export default function getBootstrapData(): BootstrapData {
   const appContainer = document.getElementById('app');
   const dataBootstrap = appContainer?.getAttribute('data-bootstrap');
-  return dataBootstrap ? JSON.parse(dataBootstrap) : {};
+  return dataBootstrap ? JSON.parse(dataBootstrap) : DEFAULT_BOOTSTRAP_DATA;
 }
diff --git a/superset-frontend/src/utils/hostNamesConfig.js b/superset-frontend/src/utils/hostNamesConfig.js
index f2a1638cc775..2fda95c46ab6 100644
--- a/superset-frontend/src/utils/hostNamesConfig.js
+++ b/superset-frontend/src/utils/hostNamesConfig.js
@@ -21,6 +21,7 @@ import {
   isFeatureEnabled,
   FeatureFlag,
 } from 'src/featureFlags';
+import getBootstrapData from './getBootstrapData';
 
 function getDomainsConfig() {
   const appContainer = document.getElementById('app');
@@ -38,11 +39,11 @@ function getDomainsConfig() {
     return Array.from(availableDomains);
   }
 
-  const bootstrapData = JSON.parse(appContainer.getAttribute('data-bootstrap'));
+  const bootstrapData = getBootstrapData();
   // this module is a little special, it may be loaded before index.jsx,
   // where window.featureFlags get initialized
   // eslint-disable-next-line camelcase
-  initFeatureFlags(bootstrapData?.common?.feature_flags);
+  initFeatureFlags(bootstrapData.common.feature_flags);
 
   if (
     isFeatureEnabled(FeatureFlag.ALLOW_DASHBOARD_DOMAIN_SHARDING) &&
diff --git a/superset-frontend/src/views/App.tsx b/superset-frontend/src/views/App.tsx
index e780242dae35..cacfaa145528 100644
--- a/superset-frontend/src/views/App.tsx
+++ b/superset-frontend/src/views/App.tsx
@@ -29,7 +29,7 @@ import { GlobalStyles } from 'src/GlobalStyles';
 import ErrorBoundary from 'src/components/ErrorBoundary';
 import Loading from 'src/components/Loading';
 import Menu from 'src/views/components/Menu';
-import { bootstrapData } from 'src/preamble';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import ToastContainer from 'src/components/MessageToasts/ToastContainer';
 import setupApp from 'src/setup/setupApp';
 import setupPlugins from 'src/setup/setupPlugins';
@@ -46,10 +46,8 @@ setupApp();
 setupPlugins();
 setupExtensions();
 
-const user = { ...bootstrapData.user };
-const menu = {
-  ...bootstrapData.common.menu_data,
-};
+const bootstrapData = getBootstrapData();
+
 let lastLocationPathname: string;
 
 const boundActions = bindActionCreators({ logEvent }, store.dispatch);
@@ -78,13 +76,16 @@ const App = () => (
       <LocationPathnameLogger />
       <RootContextProviders>
         <GlobalStyles />
-        <Menu data={menu} isFrontendRoute={isFrontendRoute} />
+        <Menu
+          data={bootstrapData.common.menu_data}
+          isFrontendRoute={isFrontendRoute}
+        />
         <Switch>
           {routes.map(({ path, Component, props = {}, Fallback = Loading }) => (
             <Route path={path} key={path}>
               <Suspense fallback={<Fallback />}>
                 <ErrorBoundary>
-                  <Component user={user} {...props} />
+                  <Component user={bootstrapData.user} {...props} />
                 </ErrorBoundary>
               </Suspense>
             </Route>
diff --git a/superset-frontend/src/views/CRUD/chart/ChartList.tsx b/superset-frontend/src/views/CRUD/chart/ChartList.tsx
index 1bbaddb41191..d449321686bc 100644
--- a/superset-frontend/src/views/CRUD/chart/ChartList.tsx
+++ b/superset-frontend/src/views/CRUD/chart/ChartList.tsx
@@ -65,7 +65,7 @@ import setupPlugins from 'src/setup/setupPlugins';
 import InfoTooltip from 'src/components/InfoTooltip';
 import CertifiedBadge from 'src/components/CertifiedBadge';
 import { GenericLink } from 'src/components/GenericLink/GenericLink';
-import { bootstrapData } from 'src/preamble';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import Owner from 'src/types/Owner';
 import ChartCard from './ChartCard';
 
@@ -157,6 +157,8 @@ const Actions = styled.div`
   color: ${({ theme }) => theme.colors.grayscale.base};
 `;
 
+const bootstrapData = getBootstrapData();
+
 function ChartList(props: ChartListProps) {
   const {
     addDangerToast,
@@ -224,7 +226,7 @@ function ChartList(props: ChartListProps) {
     hasPerm('can_export') && isFeatureEnabled(FeatureFlag.VERSIONED_EXPORT);
   const initialSort = [{ id: 'changed_on_delta_humanized', desc: true }];
   const enableBroadUserAccess =
-    bootstrapData?.common?.conf?.ENABLE_BROAD_ACTIVITY_ACCESS;
+    bootstrapData.common.conf.ENABLE_BROAD_ACTIVITY_ACCESS;
   const handleBulkChartExport = (chartsToExport: Chart[]) => {
     const ids = chartsToExport.map(({ id }) => id);
     handleResourceExport('chart', ids, () => {
diff --git a/superset-frontend/src/views/CRUD/dashboard/DashboardList.tsx b/superset-frontend/src/views/CRUD/dashboard/DashboardList.tsx
index 23b9543423b8..6fe5bf2b202b 100644
--- a/superset-frontend/src/views/CRUD/dashboard/DashboardList.tsx
+++ b/superset-frontend/src/views/CRUD/dashboard/DashboardList.tsx
@@ -49,7 +49,7 @@ import ImportModelsModal from 'src/components/ImportModal/index';
 
 import Dashboard from 'src/dashboard/containers/Dashboard';
 import CertifiedBadge from 'src/components/CertifiedBadge';
-import { bootstrapData } from 'src/preamble';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import DashboardCard from './DashboardCard';
 import { DashboardStatus } from './types';
 
@@ -95,6 +95,8 @@ const Actions = styled.div`
   color: ${({ theme }) => theme.colors.grayscale.base};
 `;
 
+const bootstrapData = getBootstrapData();
+
 function DashboardList(props: DashboardListProps) {
   const {
     addDangerToast,
diff --git a/superset-frontend/src/views/RootContextProviders.tsx b/superset-frontend/src/views/RootContextProviders.tsx
index 99f620611b53..795ea7c5ee25 100644
--- a/superset-frontend/src/views/RootContextProviders.tsx
+++ b/superset-frontend/src/views/RootContextProviders.tsx
@@ -24,14 +24,14 @@ import { Provider as ReduxProvider } from 'react-redux';
 import { QueryParamProvider } from 'use-query-params';
 import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
-
+import getBootstrapData from 'src/utils/getBootstrapData';
 import { store } from './store';
 import FlashProvider from '../components/FlashProvider';
-import { bootstrapData, theme } from '../preamble';
+import { theme } from '../preamble';
 import { EmbeddedUiConfigProvider } from '../components/UiConfigContext';
 import { DynamicPluginProvider } from '../components/DynamicPlugins';
 
-const common = { ...bootstrapData.common };
+const { common } = getBootstrapData();
 
 const extensionsRegistry = getExtensionsRegistry();
 
diff --git a/superset-frontend/src/views/menu.tsx b/superset-frontend/src/views/menu.tsx
index 4d27e3d6a46d..287634a29b60 100644
--- a/superset-frontend/src/views/menu.tsx
+++ b/superset-frontend/src/views/menu.tsx
@@ -26,6 +26,7 @@ import createCache from '@emotion/cache';
 import { ThemeProvider } from '@superset-ui/core';
 import Menu from 'src/views/components/Menu';
 import { theme } from 'src/preamble';
+import getBootstrapData from 'src/utils/getBootstrapData';
 
 import { Provider } from 'react-redux';
 import { setupStore } from './store';
@@ -33,10 +34,8 @@ import { setupStore } from './store';
 // Disable connecting to redux debugger so that the React app injected
 // Below the menu like SqlLab or Explore can connect its redux store to the debugger
 const store = setupStore(true);
-const container = document.getElementById('app');
-const bootstrapJson = container?.getAttribute('data-bootstrap') ?? '{}';
-const bootstrap = JSON.parse(bootstrapJson);
-const menu = { ...bootstrap.common.menu_data };
+const bootstrapData = getBootstrapData();
+const menu = { ...bootstrapData.common.menu_data };
 
 const emotionCache = createCache({
   key: 'menu',
diff --git a/superset-frontend/src/views/store.ts b/superset-frontend/src/views/store.ts
index 251feeec515b..a143deb7379f 100644
--- a/superset-frontend/src/views/store.ts
+++ b/superset-frontend/src/views/store.ts
@@ -48,10 +48,12 @@ import {
 import shortid from 'shortid';
 import {
   BootstrapUser,
+  UndefinedUser,
   UserWithPermissionsAndRoles,
 } from 'src/types/bootstrapTypes';
 import { AnyDatasourcesAction } from 'src/explore/actions/datasourcesActions';
 import { HydrateExplore } from 'src/explore/actions/hydrateExplore';
+import getBootstrapData from 'src/utils/getBootstrapData';
 import { Dataset } from '@superset-ui/chart-controls';
 
 // Some reducers don't do anything, and redux is just used to reference the initial "state".
@@ -61,8 +63,7 @@ const noopReducer =
   (state: STATE = initialState) =>
     state;
 
-const container = document.getElementById('app');
-const bootstrap = JSON.parse(container?.getAttribute('data-bootstrap') ?? '{}');
+const bootstrapData = getBootstrapData();
 
 export const USER_LOADED = 'USER_LOADED';
 
@@ -72,9 +73,9 @@ export type UserLoadedAction = {
 };
 
 const userReducer = (
-  user: BootstrapUser = bootstrap.user || {},
+  user = bootstrapData.user || {},
   action: UserLoadedAction,
-): BootstrapUser => {
+): BootstrapUser | UndefinedUser => {
   if (action.type === USER_LOADED) {
     return action.user;
   }
@@ -104,7 +105,7 @@ const CombinedDatasourceReducers = (
 // exported for tests
 export const rootReducer = combineReducers({
   messageToasts: messageToastReducer,
-  common: noopReducer(bootstrap.common || {}),
+  common: noopReducer(bootstrapData.common),
   user: userReducer,
   impressionId: noopReducer(shortid.generate()),
   charts,
diff --git a/superset/views/base.py b/superset/views/base.py
index 74a2e2a2d7e6..d16baecc735c 100644
--- a/superset/views/base.py
+++ b/superset/views/base.py
@@ -115,6 +115,7 @@
     "HTML_SANITIZATION",
     "HTML_SANITIZATION_SCHEMA_EXTENSIONS",
     "WELCOME_PAGE_LAST_TAB",
+    "VIZ_TYPE_DENYLIST",
 )
 
 logger = logging.getLogger(__name__)

From 0b22287ad9f3908ce62f51e2a17de8975beafed2 Mon Sep 17 00:00:00 2001
From: Cemre Mengu <cemremengu@gmail.com>
Date: Tue, 10 Jan 2023 21:52:54 +0300
Subject: [PATCH 05/15] feat: make CTA text in Alerts & Reports mails
 configurable (#19779)

---
 superset/config.py                      | 3 +++
 superset/reports/notifications/email.py | 2 +-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/superset/config.py b/superset/config.py
index a3fc3df00ef5..64ff09a5c838 100644
--- a/superset/config.py
+++ b/superset/config.py
@@ -1259,6 +1259,9 @@ def EMAIL_HEADER_MUTATOR(  # pylint: disable=invalid-name,unused-argument
 # A custom prefix to use on all Alerts & Reports emails
 EMAIL_REPORTS_SUBJECT_PREFIX = "[Report] "
 
+# The text for call-to-action link in Alerts & Reports emails
+EMAIL_REPORTS_CTA = "Explore in Superset"
+
 # Slack API token for the superset reports, either string or callable
 SLACK_API_TOKEN: Optional[Union[Callable[[], str], str]] = None
 SLACK_PROXY = None
diff --git a/superset/reports/notifications/email.py b/superset/reports/notifications/email.py
index f8b38cc3eae2..4b061c8ef6b6 100644
--- a/superset/reports/notifications/email.py
+++ b/superset/reports/notifications/email.py
@@ -128,7 +128,7 @@ def _get_content(self) -> EmailContent:
         else:
             html_table = ""
 
-        call_to_action = __("Explore in Superset")
+        call_to_action = __(app.config["EMAIL_REPORTS_CTA"])
         url = (
             modify_url_query(self._content.url, standalone="0")
             if self._content.url is not None

From 73e53fab7a5141881711a0269740627fd0527d30 Mon Sep 17 00:00:00 2001
From: Ville Brofeldt <33317356+villebro@users.noreply.github.com>
Date: Tue, 10 Jan 2023 22:14:51 +0200
Subject: [PATCH 06/15] fix(bootstrap-data): always check flashes (#22659)

---
 superset/views/base.py | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/superset/views/base.py b/superset/views/base.py
index d16baecc735c..41a27b4139e9 100644
--- a/superset/views/base.py
+++ b/superset/views/base.py
@@ -388,13 +388,12 @@ def menu_data(user: User) -> Dict[str, Any]:
 
 
 @cache_manager.cache.memoize(timeout=60)
-def common_bootstrap_payload(user: User) -> Dict[str, Any]:
+def cached_common_bootstrap_data(user: User) -> Dict[str, Any]:
     """Common data always sent to the client
 
-    The function is memoized as the return value only changes based
-    on configuration and feature flag values.
+    The function is memoized as the return value only changes when user permissions
+    or configuration values change.
     """
-    messages = get_flashed_messages(with_categories=True)
     locale = str(get_locale())
 
     # should not expose API TOKEN to frontend
@@ -418,7 +417,6 @@ def common_bootstrap_payload(user: User) -> Dict[str, Any]:
     frontend_config["HAS_GSHEETS_INSTALLED"] = bool(available_specs[GSheetsEngineSpec])
 
     bootstrap_data = {
-        "flash_messages": messages,
         "conf": frontend_config,
         "locale": locale,
         "language_pack": get_language_pack(locale),
@@ -432,6 +430,13 @@ def common_bootstrap_payload(user: User) -> Dict[str, Any]:
     return bootstrap_data
 
 
+def common_bootstrap_payload(user: User) -> Dict[str, Any]:
+    return {
+        **(cached_common_bootstrap_data(user)),
+        "flash_messages": get_flashed_messages(with_categories=True),
+    }
+
+
 def get_error_level_from_status_code(  # pylint: disable=invalid-name
     status: int,
 ) -> ErrorLevel:

From c0aeb2a75a06694402be0f15d1eb64631d3b9ef9 Mon Sep 17 00:00:00 2001
From: Ville Brofeldt <33317356+villebro@users.noreply.github.com>
Date: Wed, 11 Jan 2023 11:42:46 +0200
Subject: [PATCH 07/15] chore(embedded): bump package versions (#22676)

---
 superset-embedded-sdk/package.json                              | 2 +-
 superset-frontend/packages/superset-ui-switchboard/package.json | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/superset-embedded-sdk/package.json b/superset-embedded-sdk/package.json
index fea75d7af58c..055f44191a7e 100644
--- a/superset-embedded-sdk/package.json
+++ b/superset-embedded-sdk/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@superset-ui/embedded-sdk",
-  "version": "0.1.0-alpha.7",
+  "version": "0.1.0-alpha.8",
   "description": "SDK for embedding resources from Superset into your own application",
   "access": "public",
   "keywords": [
diff --git a/superset-frontend/packages/superset-ui-switchboard/package.json b/superset-frontend/packages/superset-ui-switchboard/package.json
index f7e6c69a1b50..1e49d7eb9cde 100644
--- a/superset-frontend/packages/superset-ui-switchboard/package.json
+++ b/superset-frontend/packages/superset-ui-switchboard/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@superset-ui/switchboard",
-  "version": "0.18.26-0",
+  "version": "0.18.26-1",
   "description": "Switchboard is a library to make it easier to communicate across browser windows using the MessageChannel API",
   "sideEffects": false,
   "main": "lib/index.js",

From 8f98c469fd16caa74ba4d9bf0b6a0f0e5ded7f1c Mon Sep 17 00:00:00 2001
From: SamraHanifCareem <106157603+SamraHanifCareem@users.noreply.github.com>
Date: Wed, 11 Jan 2023 18:10:15 +0500
Subject: [PATCH 08/15] docs: Add Careem to the user's list (#22669)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: “SamraHanifCareem” <“samra.hanif@careem.com”>
---
 RESOURCES/INTHEWILD.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/RESOURCES/INTHEWILD.md b/RESOURCES/INTHEWILD.md
index 39ea878bd57a..deb6e91e478d 100644
--- a/RESOURCES/INTHEWILD.md
+++ b/RESOURCES/INTHEWILD.md
@@ -72,6 +72,7 @@ Join our growing community!
 - [Apollo GraphQL](https://www.apollographql.com/) [@evans]
 - [Astronomer](https://www.astronomer.io) [@ryw]
 - [Avesta Technologies](https://avestatechnologies.com/) [@TheRum]
+- [Careem](https://www.careem.com/) [@SamraHanifCareem]
 - [Cloudsmith](https://cloudsmith.io) [@alancarson]
 - [CnOvit](http://www.cnovit.com/) [@xieshaohu]
 - [Deepomatic](https://deepomatic.com/) [@Zanoellia]

From 1fe0290a60773f958fd65857cbe853d99617e218 Mon Sep 17 00:00:00 2001
From: "Byungjin Park (Claud)" <posquit0.bj@gmail.com>
Date: Thu, 12 Jan 2023 01:20:51 +0900
Subject: [PATCH 09/15] chore: Add KarrotPay in INTHEWILD.md (#22666)

---
 RESOURCES/INTHEWILD.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/RESOURCES/INTHEWILD.md b/RESOURCES/INTHEWILD.md
index deb6e91e478d..193899b814d6 100644
--- a/RESOURCES/INTHEWILD.md
+++ b/RESOURCES/INTHEWILD.md
@@ -40,6 +40,7 @@ Join our growing community!
 - [Cape Crypto](https://capecrypto.com)
 - [Capital Service S.A.](http://capitalservice.pl) [@pkonarzewski]
 - [Clark.de](http://clark.de/)
+- [KarrotPay](https://www.daangnpay.com/)
 - [Wise](https://wise.com) [@koszti]
 - [Xendit](http://xendit.co/) [@LieAlbertTriAdrian]
 

From 44c9cf4de52e764b2d3c5e875bee517635f1ba1c Mon Sep 17 00:00:00 2001
From: Diego Medina <diegomedina24@gmail.com>
Date: Wed, 11 Jan 2023 13:22:41 -0300
Subject: [PATCH 10/15] chore: Migrate /superset/search_queries to API v1
 (#22579)

---
 .../QuerySearch/QuerySearch.test.jsx          | 139 ---------
 .../SqlLab/components/QuerySearch/index.tsx   | 289 ------------------
 .../translations/de/LC_MESSAGES/messages.po   |  30 --
 .../translations/en/LC_MESSAGES/messages.po   |  30 --
 .../translations/es/LC_MESSAGES/messages.po   |  30 --
 .../translations/fr/LC_MESSAGES/messages.po   |  30 --
 .../translations/it/LC_MESSAGES/messages.po   |  30 --
 .../translations/ja/LC_MESSAGES/messages.po   |  30 --
 .../translations/ko/LC_MESSAGES/messages.po   |  30 --
 superset/translations/messages.pot            |  30 --
 .../translations/nl/LC_MESSAGES/messages.po   |  30 --
 .../translations/pt/LC_MESSAGES/message.po    |  30 --
 .../pt_BR/LC_MESSAGES/messages.po             |  30 --
 .../translations/ru/LC_MESSAGES/messages.po   |  30 --
 .../translations/sk/LC_MESSAGES/messages.po   |  30 --
 .../translations/sl/LC_MESSAGES/messages.po   |  33 --
 .../translations/zh/LC_MESSAGES/messages.po   |  30 --
 superset/views/core.py                        |   1 +
 18 files changed, 1 insertion(+), 881 deletions(-)
 delete mode 100644 superset-frontend/src/SqlLab/components/QuerySearch/QuerySearch.test.jsx
 delete mode 100644 superset-frontend/src/SqlLab/components/QuerySearch/index.tsx

diff --git a/superset-frontend/src/SqlLab/components/QuerySearch/QuerySearch.test.jsx b/superset-frontend/src/SqlLab/components/QuerySearch/QuerySearch.test.jsx
deleted file mode 100644
index 2a891d34af84..000000000000
--- a/superset-frontend/src/SqlLab/components/QuerySearch/QuerySearch.test.jsx
+++ /dev/null
@@ -1,139 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import React from 'react';
-import thunk from 'redux-thunk';
-import configureStore from 'redux-mock-store';
-import fetchMock from 'fetch-mock';
-import QuerySearch from 'src/SqlLab/components/QuerySearch';
-import { Provider } from 'react-redux';
-import { supersetTheme, ThemeProvider } from '@superset-ui/core';
-import { fireEvent, render, screen, act } from '@testing-library/react';
-import '@testing-library/jest-dom/extend-expect';
-import userEvent from '@testing-library/user-event';
-import { user } from 'src/SqlLab/fixtures';
-
-const mockStore = configureStore([thunk]);
-const store = mockStore({
-  sqlLab: user,
-});
-
-const SEARCH_ENDPOINT = 'glob:*/superset/search_queries?*';
-const USER_ENDPOINT = 'glob:*/api/v1/query/related/user';
-const DATABASE_ENDPOINT = 'glob:*/api/v1/database/?*';
-
-fetchMock.get(SEARCH_ENDPOINT, []);
-fetchMock.get(USER_ENDPOINT, []);
-fetchMock.get(DATABASE_ENDPOINT, []);
-
-describe('QuerySearch', () => {
-  const mockedProps = {
-    displayLimit: 50,
-  };
-
-  it('is valid', () => {
-    expect(
-      React.isValidElement(
-        <ThemeProvider theme={supersetTheme}>
-          <Provider store={store}>
-            <QuerySearch {...mockedProps} />
-          </Provider>
-        </ThemeProvider>,
-      ),
-    ).toBe(true);
-  });
-
-  beforeEach(async () => {
-    // You need this await function in order to change state in the app. In fact you need it everytime you re-render.
-    await act(async () => {
-      render(
-        <ThemeProvider theme={supersetTheme}>
-          <Provider store={store}>
-            <QuerySearch {...mockedProps} />
-          </Provider>
-        </ThemeProvider>,
-      );
-    });
-  });
-
-  it('should have three Selects', () => {
-    expect(screen.getByText(/28 days ago/i)).toBeInTheDocument();
-    expect(screen.getByText(/now/i)).toBeInTheDocument();
-    expect(screen.getByText(/success/i)).toBeInTheDocument();
-  });
-
-  it('updates fromTime on user selects from time', () => {
-    const role = screen.getByText(/28 days ago/i);
-    fireEvent.keyDown(role, { key: 'ArrowDown', keyCode: 40 });
-    userEvent.click(screen.getByText(/1 hour ago/i));
-    expect(screen.getByText(/1 hour ago/i)).toBeInTheDocument();
-  });
-
-  it('updates toTime on user selects on time', () => {
-    const role = screen.getByText(/now/i);
-    fireEvent.keyDown(role, { key: 'ArrowDown', keyCode: 40 });
-    userEvent.click(screen.getByText(/1 hour ago/i));
-    expect(screen.getByText(/1 hour ago/i)).toBeInTheDocument();
-  });
-
-  it('updates status on user selects status', () => {
-    const role = screen.getByText(/success/i);
-    fireEvent.keyDown(role, { key: 'ArrowDown', keyCode: 40 });
-    userEvent.click(screen.getByText(/failed/i));
-    expect(screen.getByText(/failed/i)).toBeInTheDocument();
-  });
-
-  it('should have one input for searchText', () => {
-    expect(
-      screen.getByPlaceholderText(/Query search string/i),
-    ).toBeInTheDocument();
-  });
-
-  it('updates search text on user inputs search text', () => {
-    const search = screen.getByPlaceholderText(/Query search string/i);
-    userEvent.type(search, 'text');
-    expect(search.value).toBe('text');
-  });
-
-  it('should have one Button', () => {
-    const button = screen.getAllByRole('button');
-    expect(button.length).toEqual(1);
-  });
-
-  it('should call API when search button is pressed', async () => {
-    fetchMock.resetHistory();
-    const button = screen.getByRole('button');
-    await act(async () => {
-      userEvent.click(button);
-    });
-    expect(fetchMock.calls(SEARCH_ENDPOINT)).toHaveLength(1);
-  });
-
-  it('should call API when (only)enter key is pressed', async () => {
-    fetchMock.resetHistory();
-    const search = screen.getByPlaceholderText(/Query search string/i);
-    await act(async () => {
-      userEvent.type(search, 'a');
-    });
-    expect(fetchMock.calls(SEARCH_ENDPOINT)).toHaveLength(0);
-    await act(async () => {
-      userEvent.type(search, '{enter}');
-    });
-    expect(fetchMock.calls(SEARCH_ENDPOINT)).toHaveLength(1);
-  });
-});
diff --git a/superset-frontend/src/SqlLab/components/QuerySearch/index.tsx b/superset-frontend/src/SqlLab/components/QuerySearch/index.tsx
deleted file mode 100644
index 3018ff192458..000000000000
--- a/superset-frontend/src/SqlLab/components/QuerySearch/index.tsx
+++ /dev/null
@@ -1,289 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import React, { useState, useEffect } from 'react';
-import { useDispatch } from 'react-redux';
-
-import { setDatabases, addDangerToast } from 'src/SqlLab/actions/sqlLab';
-import Button from 'src/components/Button';
-import Select from 'src/components/DeprecatedSelect';
-import { styled, t, SupersetClient, QueryResponse } from '@superset-ui/core';
-import { debounce } from 'lodash';
-import Loading from 'src/components/Loading';
-import {
-  now,
-  epochTimeXHoursAgo,
-  epochTimeXDaysAgo,
-  epochTimeXYearsAgo,
-} from 'src/utils/dates';
-import AsyncSelect from 'src/components/AsyncSelect';
-import { STATUS_OPTIONS, TIME_OPTIONS } from 'src/SqlLab/constants';
-import QueryTable from '../QueryTable';
-
-interface QuerySearchProps {
-  displayLimit: number;
-}
-
-interface UserMutatorProps {
-  value: number;
-  text: string;
-}
-
-interface DbMutatorProps {
-  id: number;
-  database_name: string;
-}
-
-const TableWrapper = styled.div`
-  display: flex;
-  flex-direction: column;
-  flex: 1;
-  height: 100%;
-`;
-
-const TableStyles = styled.div`
-  table {
-    background-color: ${({ theme }) => theme.colors.grayscale.light4};
-  }
-
-  .table > thead > tr > th {
-    border-bottom: ${({ theme }) => theme.gridUnit / 2}px solid
-      ${({ theme }) => theme.colors.grayscale.light2};
-    background: ${({ theme }) => theme.colors.grayscale.light4};
-  }
-`;
-
-const StyledTableStylesContainer = styled.div`
-  overflow: auto;
-`;
-
-const QuerySearch = ({ displayLimit }: QuerySearchProps) => {
-  const dispatch = useDispatch();
-
-  const [databaseId, setDatabaseId] = useState<string>('');
-  const [userId, setUserId] = useState<string>('');
-  const [searchText, setSearchText] = useState<string>('');
-  const [from, setFrom] = useState<string>('28 days ago');
-  const [to, setTo] = useState<string>('now');
-  const [status, setStatus] = useState<string>('success');
-  const [queriesArray, setQueriesArray] = useState<QueryResponse[]>([]);
-  const [queriesLoading, setQueriesLoading] = useState<boolean>(true);
-
-  const getTimeFromSelection = (selection: string) => {
-    switch (selection) {
-      case 'now':
-        return now();
-      case '1 hour ago':
-        return epochTimeXHoursAgo(1);
-      case '1 day ago':
-        return epochTimeXDaysAgo(1);
-      case '7 days ago':
-        return epochTimeXDaysAgo(7);
-      case '28 days ago':
-        return epochTimeXDaysAgo(28);
-      case '90 days ago':
-        return epochTimeXDaysAgo(90);
-      case '1 year ago':
-        return epochTimeXYearsAgo(1);
-      default:
-        return null;
-    }
-  };
-
-  const insertParams = (baseUrl: string, params: string[]) => {
-    const validParams = params.filter(function (p) {
-      return p !== '';
-    });
-    return `${baseUrl}?${validParams.join('&')}`;
-  };
-
-  const refreshQueries = async () => {
-    setQueriesLoading(true);
-    const params = [
-      userId && `user_id=${userId}`,
-      databaseId && `database_id=${databaseId}`,
-      searchText && `search_text=${searchText}`,
-      status && `status=${status}`,
-      from && `from=${getTimeFromSelection(from)}`,
-      to && `to=${getTimeFromSelection(to)}`,
-    ];
-
-    try {
-      const response = await SupersetClient.get({
-        endpoint: insertParams('/superset/search_queries', params),
-      });
-      const queries = Object.values(response.json);
-      setQueriesArray(queries);
-    } catch (err) {
-      dispatch(addDangerToast(t('An error occurred when refreshing queries')));
-    } finally {
-      setQueriesLoading(false);
-    }
-  };
-  useEffect(() => {
-    refreshQueries();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  const onUserClicked = (userId: string) => {
-    setUserId(userId);
-    refreshQueries();
-  };
-
-  const onDbClicked = (dbId: string) => {
-    setDatabaseId(dbId);
-    refreshQueries();
-  };
-
-  const onKeyDown = (event: React.KeyboardEvent) => {
-    if (event.keyCode === 13) {
-      refreshQueries();
-    }
-  };
-
-  const onChange = (e: React.ChangeEvent) => {
-    e.persist();
-    const handleChange = debounce(e => {
-      setSearchText(e.target.value);
-    }, 200);
-    handleChange(e);
-  };
-
-  const userMutator = ({ result }: { result: UserMutatorProps[] }) =>
-    result.map(({ value, text }: UserMutatorProps) => ({
-      label: text,
-      value,
-    }));
-
-  const dbMutator = ({ result }: { result: DbMutatorProps[] }) => {
-    const options = result.map(({ id, database_name }: DbMutatorProps) => ({
-      value: id,
-      label: database_name,
-    }));
-    dispatch(setDatabases(result));
-    if (result.length === 0) {
-      dispatch(
-        addDangerToast(t("It seems you don't have access to any database")),
-      );
-    }
-    return options;
-  };
-
-  return (
-    <TableWrapper>
-      <div id="search-header" className="row space-1">
-        <div className="col-sm-2">
-          <AsyncSelect
-            dataEndpoint="api/v1/query/related/user"
-            mutator={userMutator}
-            value={userId}
-            onChange={(selected: any) => setUserId(selected?.value)}
-            placeholder={t('Filter by user')}
-          />
-        </div>
-        <div className="col-sm-2">
-          <AsyncSelect
-            onChange={(db: any) => setDatabaseId(db?.value)}
-            dataEndpoint="/api/v1/database/?q=(filters:!((col:expose_in_sqllab,opr:eq,value:!t)))"
-            value={databaseId}
-            mutator={dbMutator}
-            placeholder={t('Filter by database')}
-          />
-        </div>
-        <div className="col-sm-4">
-          <input
-            type="text"
-            onChange={onChange}
-            onKeyDown={onKeyDown}
-            className="form-control input-sm"
-            placeholder={t('Query search string')}
-          />
-        </div>
-        <div className="col-sm-4 search-date-filter-container">
-          <Select
-            name="select-from"
-            placeholder={t('[From]-')}
-            options={TIME_OPTIONS.slice(1, TIME_OPTIONS.length).map(xt => ({
-              value: xt,
-              label: xt,
-            }))}
-            value={{ value: from, label: from }}
-            autosize={false}
-            onChange={(selected: any) => setFrom(selected?.value)}
-          />
-
-          <Select
-            name="select-to"
-            placeholder={t('[To]-')}
-            options={TIME_OPTIONS.map(xt => ({ value: xt, label: xt }))}
-            value={{ value: to, label: to }}
-            autosize={false}
-            onChange={(selected: any) => setTo(selected?.value)}
-          />
-
-          <Select
-            name="select-status"
-            placeholder={t('Filter by status')}
-            options={Object.keys(STATUS_OPTIONS).map(s => ({
-              value: s,
-              label: s,
-            }))}
-            value={{ value: status, label: status }}
-            isLoading={false}
-            autosize={false}
-            onChange={(selected: any) => setStatus(selected?.value)}
-          />
-
-          <Button
-            buttonSize="small"
-            buttonStyle="success"
-            onClick={refreshQueries}
-          >
-            {t('Search')}
-          </Button>
-        </div>
-      </div>
-      <StyledTableStylesContainer>
-        {queriesLoading ? (
-          <Loading />
-        ) : (
-          <TableStyles>
-            <QueryTable
-              columns={[
-                'state',
-                'db',
-                'user',
-                'time',
-                'progress',
-                'rows',
-                'sql',
-                'querylink',
-              ]}
-              onUserClicked={onUserClicked}
-              onDbClicked={onDbClicked}
-              queries={queriesArray}
-              displayLimit={displayLimit}
-            />
-          </TableStyles>
-        )}
-      </StyledTableStylesContainer>
-    </TableWrapper>
-  );
-};
-
-export default QuerySearch;
diff --git a/superset/translations/de/LC_MESSAGES/messages.po b/superset/translations/de/LC_MESSAGES/messages.po
index e6d13c5525c7..0ea2edb9aaca 100644
--- a/superset/translations/de/LC_MESSAGES/messages.po
+++ b/superset/translations/de/LC_MESSAGES/messages.po
@@ -1271,10 +1271,6 @@ msgstr "Ein Fehler ist aufgetreten"
 msgid "An error occurred saving dataset"
 msgstr "Beim Speichern des Datensatz ist ein Fehler aufgetreten"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr "Beim Aktualisieren von Abfragen ist ein Fehler aufgetreten"
-
 #: superset/key_value/commands/exceptions.py:33
 msgid "An error occurred while accessing the value."
 msgstr "Beim Zugriff auf den Wert ist ein Fehler aufgetreten."
@@ -5929,18 +5925,6 @@ msgstr "Filtertyp"
 msgid "Filter box"
 msgstr "Filterkomponente"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr "Filtern nach Datenbank"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr "Nach Status filtern"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr "Filtern nach Benutzer*in"
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr "Filterkonfiguration"
@@ -6822,7 +6806,6 @@ msgstr "Problem 1000 - Die Datenquelle ist zu groß, um sie abzufragen."
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr "Problem 1001 - Die Datenbank ist ungewöhnlich belastet."
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -9495,10 +9478,6 @@ msgstr "Abfragename"
 msgid "Query preview"
 msgstr "Abfragen-Voransicht"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr "Abfragen suchen"
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 msgid "Query was stopped"
 msgstr "Abfrage wurde angehalten"
@@ -10541,7 +10520,6 @@ msgid "Scoping"
 msgstr "Auswahlverfahren"
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -15498,10 +15476,6 @@ msgstr "Zoomstufe der Karte"
 msgid "[Alert] %(label)s"
 msgstr "[Alarm] %(label)s"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr "[Von]-"
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr ""
@@ -15521,10 +15495,6 @@ msgstr "[Fehlender Datensatz]"
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr "[Superset] Zugriff auf die Datenquelle %(name)s wurde gewährt"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr "[Bis]-"
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 msgid "[Untitled]"
 msgstr "[Unbenannt]"
diff --git a/superset/translations/en/LC_MESSAGES/messages.po b/superset/translations/en/LC_MESSAGES/messages.po
index 45381a7bc450..fe5deee377be 100644
--- a/superset/translations/en/LC_MESSAGES/messages.po
+++ b/superset/translations/en/LC_MESSAGES/messages.po
@@ -1141,10 +1141,6 @@ msgstr ""
 msgid "An error occurred saving dataset"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr ""
-
 #: superset/key_value/commands/exceptions.py:33
 msgid "An error occurred while accessing the value."
 msgstr ""
@@ -5521,18 +5517,6 @@ msgstr ""
 msgid "Filter box"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr ""
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr ""
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr ""
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr ""
@@ -6345,7 +6329,6 @@ msgstr ""
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -8889,10 +8872,6 @@ msgstr ""
 msgid "Query preview"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr ""
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 msgid "Query was stopped"
 msgstr ""
@@ -9885,7 +9864,6 @@ msgid "Scoping"
 msgstr ""
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -14280,10 +14258,6 @@ msgstr ""
 msgid "[Alert] %(label)s"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr ""
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr ""
@@ -14301,10 +14275,6 @@ msgstr ""
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr ""
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 msgid "[Untitled]"
 msgstr ""
diff --git a/superset/translations/es/LC_MESSAGES/messages.po b/superset/translations/es/LC_MESSAGES/messages.po
index 6d1b32b8e0d0..8a87110015de 100644
--- a/superset/translations/es/LC_MESSAGES/messages.po
+++ b/superset/translations/es/LC_MESSAGES/messages.po
@@ -1194,10 +1194,6 @@ msgstr "Se produjo un error"
 msgid "An error occurred saving dataset"
 msgstr "Se produjo un error al crear el origen de datos"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr ""
-
 #: superset/key_value/commands/exceptions.py:33
 #, fuzzy
 msgid "An error occurred while accessing the value."
@@ -5795,18 +5791,6 @@ msgstr "Filtrar por usuario"
 msgid "Filter box"
 msgstr "Caja de filtro"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr "Filtrar por base de datos"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr "Filtrar por estado"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr "Filtrar por usuario"
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr "Configuración de filtros"
@@ -6672,7 +6656,6 @@ msgstr "Issue 1000 - La fuente de datos es demasiado grande para consultar."
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr "Issue 1001 - La base de datos tiene una carga inusualmente elevada."
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -9340,10 +9323,6 @@ msgstr "Nombre de la consulta"
 msgid "Query preview"
 msgstr "Previsualización de Datos"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr "Cadena de búsqueda de consulta"
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 #, fuzzy
 msgid "Query was stopped"
@@ -10398,7 +10377,6 @@ msgid "Scoping"
 msgstr ""
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -15081,10 +15059,6 @@ msgstr ""
 msgid "[Alert] %(label)s"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr "[De]-"
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr "Las columnas [Longitud] y [Latitud] deben estar presentes en [Group By]"
@@ -15103,10 +15077,6 @@ msgstr "Cambiar fuente"
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr "Se ha otorgado Acceso [Superset] a la fuente de datos %(name)"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr "[A]-"
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 #, fuzzy, python-format
 msgid "[Untitled]"
diff --git a/superset/translations/fr/LC_MESSAGES/messages.po b/superset/translations/fr/LC_MESSAGES/messages.po
index d125ecd3cb6a..342e2af60e6c 100644
--- a/superset/translations/fr/LC_MESSAGES/messages.po
+++ b/superset/translations/fr/LC_MESSAGES/messages.po
@@ -1242,10 +1242,6 @@ msgstr "Un erreur s'est produite"
 msgid "An error occurred saving dataset"
 msgstr "Une erreur s'est produite durant la sauvegarde du jeu de données"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr "Une erreur s'est produite en rafaîchissant les requêtes"
-
 #: superset/key_value/commands/exceptions.py:33
 #, fuzzy
 msgid "An error occurred while accessing the value."
@@ -5932,18 +5928,6 @@ msgstr "Type du filtre"
 msgid "Filter box"
 msgstr "Boite de filtrage"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr "Filtrer par base de données"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr "Filtrer par statut"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr "Filtrer par utilisateur"
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr "Configuration du filtre"
@@ -6837,7 +6821,6 @@ msgstr "Source de données trop volumineuse pour être interrogée."
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr "La base de données est soumise à une charge inhabituelle."
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -9550,10 +9533,6 @@ msgstr "Nom de la requête"
 msgid "Query preview"
 msgstr "Prévisualisation de la requête"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr "Chaîne de recherche"
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 msgid "Query was stopped"
 msgstr "La requête a été arrêtée"
@@ -10618,7 +10597,6 @@ msgid "Scoping"
 msgstr "Portée"
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -15466,10 +15444,6 @@ msgstr ""
 msgid "[Alert] %(label)s"
 msgstr "[Alert] %(label)s"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr "[Depuis]-"
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr ""
@@ -15489,10 +15463,6 @@ msgstr "[jeu de données manquant]"
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr "[Superset] Accès à la source de données %(name)s accordé"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr "[à]-"
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 msgid "[Untitled]"
 msgstr "[Sans titre]"
diff --git a/superset/translations/it/LC_MESSAGES/messages.po b/superset/translations/it/LC_MESSAGES/messages.po
index 1947ea8d9b4e..f57fdcd6badf 100644
--- a/superset/translations/it/LC_MESSAGES/messages.po
+++ b/superset/translations/it/LC_MESSAGES/messages.po
@@ -1169,10 +1169,6 @@ msgstr ""
 msgid "An error occurred saving dataset"
 msgstr "Errore nel creare il datasource"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr "Errore nel creare il datasource"
-
 #: superset/key_value/commands/exceptions.py:33
 #, fuzzy
 msgid "An error occurred while accessing the value."
@@ -5672,18 +5668,6 @@ msgstr "Valore del filtro"
 msgid "Filter box"
 msgstr "Filtri"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr "Mostra database"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr "Valore del filtro"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr "Valore del filtro"
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr "Controlli del filtro"
@@ -6519,7 +6503,6 @@ msgstr ""
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -9140,10 +9123,6 @@ msgstr "Ricerca Query"
 msgid "Query preview"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr "Ricerca Query"
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 #, fuzzy
 msgid "Query was stopped"
@@ -10165,7 +10144,6 @@ msgid "Scoping"
 msgstr ""
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -14708,10 +14686,6 @@ msgstr ""
 msgid "[Alert] %(label)s"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr ""
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr ""
@@ -14730,10 +14704,6 @@ msgstr "Seleziona una destinazione"
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr "[Superset] Accesso al datasource $(name) concesso"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr ""
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 #, fuzzy, python-format
 msgid "[Untitled]"
diff --git a/superset/translations/ja/LC_MESSAGES/messages.po b/superset/translations/ja/LC_MESSAGES/messages.po
index d0f0eae5dce6..52914a8f5cda 100644
--- a/superset/translations/ja/LC_MESSAGES/messages.po
+++ b/superset/translations/ja/LC_MESSAGES/messages.po
@@ -1162,10 +1162,6 @@ msgstr "エラーが発生しました"
 msgid "An error occurred saving dataset"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr ""
-
 #: superset/key_value/commands/exceptions.py:33
 #, fuzzy
 msgid "An error occurred while accessing the value."
@@ -5658,18 +5654,6 @@ msgstr "フィルタタイプ"
 msgid "Filter box"
 msgstr "フィルタボックス"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr ""
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr ""
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr ""
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr "フィルタ構成"
@@ -6500,7 +6484,6 @@ msgstr "Issue 1000 - データ ソースが大きすぎてクエリを実行で
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr "Issue 1001 - データベースに異常な負荷がかかっています。"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -9115,10 +9098,6 @@ msgstr "クエリ名"
 msgid "Query preview"
 msgstr "クエリプレビュー"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr ""
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 msgid "Query was stopped"
 msgstr ""
@@ -10136,7 +10115,6 @@ msgid "Scoping"
 msgstr "スコープ"
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -14672,10 +14650,6 @@ msgstr ""
 msgid "[Alert] %(label)s"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr ""
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr ""
@@ -14693,10 +14667,6 @@ msgstr "[データセットが見つかりません]"
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr "[Superset]　データソース　%(name)s へのアクセスは許可されました"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr ""
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 msgid "[Untitled]"
 msgstr ""
diff --git a/superset/translations/ko/LC_MESSAGES/messages.po b/superset/translations/ko/LC_MESSAGES/messages.po
index 47aeba023897..acd8bf48db12 100644
--- a/superset/translations/ko/LC_MESSAGES/messages.po
+++ b/superset/translations/ko/LC_MESSAGES/messages.po
@@ -1160,10 +1160,6 @@ msgstr ""
 msgid "An error occurred saving dataset"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr ""
-
 #: superset/key_value/commands/exceptions.py:33
 #, fuzzy, python-format
 msgid "An error occurred while accessing the value."
@@ -5625,18 +5621,6 @@ msgstr ""
 msgid "Filter box"
 msgstr "필터"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr "데이터베이스 선택"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr "필터"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr "필터"
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr ""
@@ -6469,7 +6453,6 @@ msgstr "이슈 1000 - 데이터 소스가 쿼리하기에 너무 큽니다."
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -9052,10 +9035,6 @@ msgstr "Query 검색"
 msgid "Query preview"
 msgstr "데이터 미리보기"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr "Query 검색"
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 msgid "Query was stopped"
 msgstr ""
@@ -10067,7 +10046,6 @@ msgid "Scoping"
 msgstr ""
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -14557,10 +14535,6 @@ msgstr ""
 msgid "[Alert] %(label)s"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr ""
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr ""
@@ -14578,10 +14552,6 @@ msgstr ""
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr ""
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 msgid "[Untitled]"
 msgstr ""
diff --git a/superset/translations/messages.pot b/superset/translations/messages.pot
index 28fe2143bced..693f5c414646 100644
--- a/superset/translations/messages.pot
+++ b/superset/translations/messages.pot
@@ -1147,10 +1147,6 @@ msgstr ""
 msgid "An error occurred saving dataset"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr ""
-
 #: superset/key_value/commands/exceptions.py:33
 msgid "An error occurred while accessing the value."
 msgstr ""
@@ -5526,18 +5522,6 @@ msgstr ""
 msgid "Filter box"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr ""
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr ""
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr ""
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr ""
@@ -6351,7 +6335,6 @@ msgstr ""
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -8896,10 +8879,6 @@ msgstr ""
 msgid "Query preview"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr ""
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 msgid "Query was stopped"
 msgstr ""
@@ -9892,7 +9871,6 @@ msgid "Scoping"
 msgstr ""
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -14286,10 +14264,6 @@ msgstr ""
 msgid "[Alert] %(label)s"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr ""
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr ""
@@ -14307,10 +14281,6 @@ msgstr ""
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr ""
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 msgid "[Untitled]"
 msgstr ""
diff --git a/superset/translations/nl/LC_MESSAGES/messages.po b/superset/translations/nl/LC_MESSAGES/messages.po
index 558d58718bb8..8bf6fc972ec4 100644
--- a/superset/translations/nl/LC_MESSAGES/messages.po
+++ b/superset/translations/nl/LC_MESSAGES/messages.po
@@ -2773,7 +2773,6 @@ msgid "Filter List"
 msgstr "Filter Lijst"
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:261
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:94
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -9926,39 +9925,10 @@ msgstr "SQL"
 msgid "No query history yet..."
 msgstr "Nog geen zoekgeschiedenis…"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:137
-msgid "An error occurred when refreshing queries"
-msgstr "Er is een fout opgetreden bij het vernieuwen van de queries"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:185
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:184
 msgid "It seems you don't have access to any database"
 msgstr "Het lijkt erop dat je geen toegang hebt tot een database"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:200
-msgid "Filter by user"
-msgstr "Filter op gebruiker"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:209
-msgid "Filter by database"
-msgstr "Filter op database"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:218
-msgid "Query search string"
-msgstr "Query zoek string"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:224
-msgid "[From]-"
-msgstr "[From]-"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:236
-msgid "[To]-"
-msgstr "[To]-"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:245
-msgid "Filter by status"
-msgstr "Filter op status"
-
 #: superset-frontend/src/SqlLab/components/QueryTable/index.tsx:117
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:54
 #: superset-frontend/src/views/CRUD/data/query/QueryList.tsx:142
diff --git a/superset/translations/pt/LC_MESSAGES/message.po b/superset/translations/pt/LC_MESSAGES/message.po
index b944475c5591..e06a21ce4f42 100644
--- a/superset/translations/pt/LC_MESSAGES/message.po
+++ b/superset/translations/pt/LC_MESSAGES/message.po
@@ -2033,7 +2033,6 @@ msgstr "Nenhum registo encontrado"
 msgid "Filter List"
 msgstr "Filtros"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch.jsx:296
 #: superset-frontend/src/explore/components/DataTableControl.tsx:73
 #: superset-frontend/src/explore/components/controls/VizTypeControl.jsx:226
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:398
@@ -3599,40 +3598,11 @@ msgstr "SQL"
 msgid "No query history yet..."
 msgstr "Ainda não há histórico de queries ..."
 
-#: superset-frontend/src/SqlLab/components/QuerySearch.jsx:193
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar.jsx:101
 #: superset-frontend/src/components/DatabaseSelector.tsx:151
 msgid "It seems you don't have access to any database"
 msgstr "Parece que não tem acesso a nenhuma base de dados"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch.jsx:220
-msgid "An error occurred when refreshing queries"
-msgstr "Ocorreu um erro ao criar a origem dos dados"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch.jsx:235
-msgid "Filter by user"
-msgstr "Valor de filtro"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch.jsx:244
-msgid "Filter by database"
-msgstr "Selecione uma base de dados"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch.jsx:253
-msgid "Query search string"
-msgstr "Pesquisa de Query"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch.jsx:259
-msgid "[From]-"
-msgstr "[A partir de]-"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch.jsx:271
-msgid "[To]-"
-msgstr "[Para]-"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch.jsx:280
-msgid "Filter by status"
-msgstr "Valor de filtro"
-
 #: superset-frontend/src/SqlLab/components/QueryTable.jsx:128
 #: superset-frontend/src/dashboard/components/menu/MarkdownModeDropdown.jsx:34
 #: superset-frontend/src/explore/components/controls/TextAreaControl.jsx:134
diff --git a/superset/translations/pt_BR/LC_MESSAGES/messages.po b/superset/translations/pt_BR/LC_MESSAGES/messages.po
index 92a58e643511..1194ac5b7a1b 100644
--- a/superset/translations/pt_BR/LC_MESSAGES/messages.po
+++ b/superset/translations/pt_BR/LC_MESSAGES/messages.po
@@ -1238,10 +1238,6 @@ msgstr "Ocorreu um erro"
 msgid "An error occurred saving dataset"
 msgstr "Ocorreu um erro ao salvar o conjunto de dados"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr "Ocorreu um erro ao atualizar as consultas"
-
 #: superset/key_value/commands/exceptions.py:33
 #, fuzzy
 msgid "An error occurred while accessing the value."
@@ -5928,18 +5924,6 @@ msgstr "Filtrar por usuário"
 msgid "Filter box"
 msgstr "Caixa de filtro"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr "Filtrar por banco de dados"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr "Filtrar por status"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr "Filtrar por usuário"
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr "Configuração do filtro"
@@ -6830,7 +6814,6 @@ msgstr "Problema 1000 - A fonte de dados é muito grande para consulta."
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr "Problema 1001 - O banco de dados está sob carga atípica."
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -9533,10 +9516,6 @@ msgstr "Nome da consulta"
 msgid "Query preview"
 msgstr "Pré-visualização da consulta"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr "Texto da consulta de busca"
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 #, fuzzy
 msgid "Query was stopped"
@@ -10596,7 +10575,6 @@ msgid "Scoping"
 msgstr "Escopo"
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -15404,10 +15382,6 @@ msgstr ""
 msgid "[Alert] %(label)s"
 msgstr "[Alert] %(label)s"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr "[A partir de]-"
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr "[Longitude] e as colunas [Latitude] devem estar presentes em [Group By]"
@@ -15426,10 +15400,6 @@ msgstr "Mudar conjunto de dados"
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr "[Superset] O acesso à fonte de dados %(name) s foi concedido"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr "[Para]-"
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 #, fuzzy, python-format
 msgid "[Untitled]"
diff --git a/superset/translations/ru/LC_MESSAGES/messages.po b/superset/translations/ru/LC_MESSAGES/messages.po
index 112038870ae6..4061c785528f 100644
--- a/superset/translations/ru/LC_MESSAGES/messages.po
+++ b/superset/translations/ru/LC_MESSAGES/messages.po
@@ -1211,10 +1211,6 @@ msgstr "Произошла ошибка"
 msgid "An error occurred saving dataset"
 msgstr "Произошла ошибка при создании источника данных"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr "Произошла ошибка при создании источника данных"
-
 #: superset/key_value/commands/exceptions.py:33
 #, fuzzy
 msgid "An error occurred while accessing the value."
@@ -5860,18 +5856,6 @@ msgstr "Значение фильтра"
 msgid "Filter box"
 msgstr "Фильтр"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr "Выберите базу данных"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr "Значение фильтра"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr "Значение фильтра"
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr "Фильтруемые срезы"
@@ -6753,7 +6737,6 @@ msgstr "Проблема 1000 - Источник данных слишком в
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr "Проблема 1001 - Необычная загрузка базы данных."
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -9438,10 +9421,6 @@ msgstr "Имя запроса"
 msgid "Query preview"
 msgstr "Предпросмотр данных"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr "Поиск запросов"
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 #, fuzzy
 msgid "Query was stopped"
@@ -10488,7 +10467,6 @@ msgid "Scoping"
 msgstr ""
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -15217,10 +15195,6 @@ msgstr ""
 msgid "[Alert] %(label)s"
 msgstr "[Оповещение] %(label)s"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr "[С]-"
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr "Столбцы [Долгота] и [Широта] должны присутствовать в поле [Группировка]"
@@ -15239,10 +15213,6 @@ msgstr "Выберите источник данных"
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr "Доступ к базе данных предоставлен для пользователя — %(name)s"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr "[До]-"
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 #, fuzzy, python-format
 msgid "[Untitled]"
diff --git a/superset/translations/sk/LC_MESSAGES/messages.po b/superset/translations/sk/LC_MESSAGES/messages.po
index a0e2a0c310b1..aa8b175ad1a6 100644
--- a/superset/translations/sk/LC_MESSAGES/messages.po
+++ b/superset/translations/sk/LC_MESSAGES/messages.po
@@ -1141,10 +1141,6 @@ msgstr ""
 msgid "An error occurred saving dataset"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr ""
-
 #: superset/key_value/commands/exceptions.py:33
 msgid "An error occurred while accessing the value."
 msgstr ""
@@ -5538,18 +5534,6 @@ msgstr ""
 msgid "Filter box"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr ""
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr ""
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr ""
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr ""
@@ -6362,7 +6346,6 @@ msgstr ""
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -8906,10 +8889,6 @@ msgstr ""
 msgid "Query preview"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr ""
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 msgid "Query was stopped"
 msgstr ""
@@ -9906,7 +9885,6 @@ msgid "Scoping"
 msgstr ""
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -14304,10 +14282,6 @@ msgstr ""
 msgid "[Alert] %(label)s"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr ""
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr ""
@@ -14325,10 +14299,6 @@ msgstr ""
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr ""
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr ""
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 msgid "[Untitled]"
 msgstr ""
diff --git a/superset/translations/sl/LC_MESSAGES/messages.po b/superset/translations/sl/LC_MESSAGES/messages.po
index 0f545732a942..8c24c390a327 100644
--- a/superset/translations/sl/LC_MESSAGES/messages.po
+++ b/superset/translations/sl/LC_MESSAGES/messages.po
@@ -2675,7 +2675,6 @@ msgid "Filter List"
 msgstr "Seznam filtrov"
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:122
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:260
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:107
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:453
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:304
@@ -10160,38 +10159,6 @@ msgstr "SQL"
 msgid "Run a query to display query history"
 msgstr "Za prikaz zgodovine poizvedb zaženite poizvedbo"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:136
-msgid "An error occurred when refreshing queries"
-msgstr "Pri osveževanju poizvedb je prišlo do napake"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:184
-msgid "It seems you don't have access to any database"
-msgstr "Zdi se, da nimate dostopa do nobene podatkovne baz"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:199
-msgid "Filter by user"
-msgstr "Filtriraj po uporabniku"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:208
-msgid "Filter by database"
-msgstr "Filtriraj po podatkovni bazi"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:217
-msgid "Query search string"
-msgstr "Iskalni niz za poizvedbo"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:223
-msgid "[From]-"
-msgstr "[Od]-"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:235
-msgid "[To]-"
-msgstr "[Do]-"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:244
-msgid "Filter by status"
-msgstr "Filtriraj po statusu"
-
 #: superset-frontend/src/SqlLab/components/QueryTable/index.tsx:121
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:53
 #: superset-frontend/src/views/CRUD/data/query/QueryList.tsx:142
diff --git a/superset/translations/zh/LC_MESSAGES/messages.po b/superset/translations/zh/LC_MESSAGES/messages.po
index fb4ac8340975..06fbae00355e 100644
--- a/superset/translations/zh/LC_MESSAGES/messages.po
+++ b/superset/translations/zh/LC_MESSAGES/messages.po
@@ -1193,10 +1193,6 @@ msgstr "发生了一个错误"
 msgid "An error occurred saving dataset"
 msgstr "保存数据集时发生错误"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:132
-msgid "An error occurred when refreshing queries"
-msgstr "创建数据源时发生错误"
-
 #: superset/key_value/commands/exceptions.py:33
 #, fuzzy
 msgid "An error occurred while accessing the value."
@@ -5740,18 +5736,6 @@ msgstr "过滤用户"
 msgid "Filter box"
 msgstr "过滤器"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:204
-msgid "Filter by database"
-msgstr "过滤数据库"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:240
-msgid "Filter by status"
-msgstr "过滤状态"
-
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:195
-msgid "Filter by user"
-msgstr "过滤用户"
-
 #: superset-frontend/src/explore/components/controls/FilterBoxItemControl/index.jsx:282
 msgid "Filter configuration"
 msgstr "过滤配置"
@@ -6620,7 +6604,6 @@ msgstr "Issue 1000 - 数据源太大，无法进行查询。"
 msgid "Issue 1001 - The database is under an unusual load."
 msgstr "Issue 1001 - 数据库负载异常。"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:180
 #: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx:125
 #: superset-frontend/src/components/DatabaseSelector/index.tsx:183
 msgid "It seems you don't have access to any database"
@@ -9256,10 +9239,6 @@ msgstr "查询名称"
 msgid "Query preview"
 msgstr "查询预览"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:213
-msgid "Query search string"
-msgstr "查询搜索字符串"
-
 #: superset-frontend/src/SqlLab/components/ResultSet/index.tsx:682
 #, fuzzy
 msgid "Query was stopped"
@@ -10290,7 +10269,6 @@ msgid "Scoping"
 msgstr "范围"
 
 #: superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:121
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:256
 #: superset-frontend/src/explore/components/DataTableControl/index.tsx:77
 #: superset-frontend/src/views/CRUD/alert/AlertList.tsx:419
 #: superset-frontend/src/views/CRUD/annotationlayers/AnnotationLayersList.tsx:305
@@ -14908,10 +14886,6 @@ msgstr "地图缩放等级"
 msgid "[Alert] %(label)s"
 msgstr "[警报] %(label)s"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:219
-msgid "[From]-"
-msgstr "[从]-"
-
 #: superset/viz.py:2349
 msgid "[Longitude] and [Latitude] columns must be present in [Group By]"
 msgstr "[经度] 和 [纬度] 的选择项必须出现在 [Group By]"
@@ -14930,10 +14904,6 @@ msgstr "丢失数据集"
 msgid "[Superset] Access to the datasource %(name)s was granted"
 msgstr "[Superset] 允许访问数据源 %(name)s"
 
-#: superset-frontend/src/SqlLab/components/QuerySearch/index.tsx:231
-msgid "[To]-"
-msgstr "[至]-"
-
 #: superset-frontend/src/views/CRUD/welcome/ActivityTable.tsx:94
 #, fuzzy, python-format
 msgid "[Untitled]"
diff --git a/superset/views/core.py b/superset/views/core.py
index 34e59947e7dd..d52bbfa831fd 100755
--- a/superset/views/core.py
+++ b/superset/views/core.py
@@ -2607,6 +2607,7 @@ def queries_exec(last_updated_ms: Union[float, int]) -> FlaskResponse:
     @has_access
     @event_logger.log_this
     @expose("/search_queries")
+    @deprecated()
     def search_queries(self) -> FlaskResponse:  # pylint: disable=no-self-use
         """
         Search for previously run sqllab queries. Used for Sqllab Query Search

From f3696ceef33246dd6dacd0cff33220dd14bfbdf0 Mon Sep 17 00:00:00 2001
From: Artem Shumeiko <53895552+artemonsh@users.noreply.github.com>
Date: Wed, 11 Jan 2023 19:42:54 +0300
Subject: [PATCH 11/15] chore: Localization of several charts and elements
 (#22150)

Co-authored-by: ashumeiko <ashumeiko@ashumeiko.com>
---
 .../src/sections/advancedAnalytics.tsx        |  50 ++++----
 .../src/sections/chartTitle.tsx               |   9 +-
 .../src/shared-controls/sharedControls.tsx    |  32 ++---
 .../chart/components/FallbackComponent.tsx    |   5 +-
 .../src/chart/components/SuperChartCore.tsx   |   3 +-
 .../shared/components/VerifyCORS.tsx          |   3 +-
 .../src/controlPanel.ts                       |  29 +++--
 .../src/controlPanel.tsx                      |  51 ++++----
 .../src/controlPanel.ts                       |   6 +-
 .../src/controlPanel.ts                       |  50 ++++----
 .../src/controlPanel.tsx                      |  73 ++++++-----
 .../src/controlPanel.ts                       |  17 ++-
 .../src/controlPanel.tsx                      |  81 ++++++------
 .../src/controlPanel.ts                       |   8 +-
 .../src/layers/Arc/Arc.jsx                    |   4 +-
 .../src/layers/Grid/Grid.jsx                  |   6 +-
 .../src/layers/Hex/Hex.jsx                    |   5 +-
 .../src/layers/Hex/controlPanel.ts            |  29 +++--
 .../src/layers/Path/controlPanel.ts           |   4 +-
 .../src/layers/Polygon/Polygon.jsx            |   7 +-
 .../src/layers/Scatter/Scatter.jsx            |   6 +-
 .../src/layers/Scatter/controlPanel.ts        |  12 +-
 .../src/layers/Screengrid/Screengrid.jsx      |   9 +-
 .../src/utilities/Shared_DeckGL.jsx           |  30 ++---
 .../src/Area/controlPanel.ts                  |   6 +-
 .../src/NVD3Controls.tsx                      | 115 +++++++++++-------
 .../src/Pie/controlPanel.ts                   |  12 +-
 .../src/TimePivot/controlPanel.ts             |  12 +-
 .../BigNumberWithTrendline/controlPanel.tsx   |  31 +++--
 .../src/BoxPlot/controlPanel.ts               |  27 ++--
 .../src/Funnel/controlPanel.tsx               |  12 +-
 .../src/MixedTimeseries/controlPanel.tsx      |  14 +--
 .../src/Pie/controlPanel.tsx                  |  12 +-
 .../src/Radar/controlPanel.tsx                |   4 +-
 .../src/Timeseries/Area/controlPanel.tsx      |  10 +-
 .../Timeseries/Regular/Bar/controlPanel.tsx   |   4 +-
 .../Timeseries/Regular/Line/controlPanel.tsx  |  14 +--
 .../src/Timeseries/Step/controlPanel.tsx      |   6 +-
 .../src/Treemap/controlPanel.tsx              |   6 +-
 .../Handlebars/HandlebarsViewer.tsx           |   4 +-
 .../src/plugin/controlPanel.tsx               |  44 +++----
 .../src/react-pivottable/TableRenderers.jsx   |  10 +-
 .../plugin-chart-table/src/TableChart.tsx     |   2 +-
 .../src/plugin/controlPanel.ts                |   6 +-
 .../src/BoxPlot/controlPanel.ts               |  30 ++---
 .../SqlLab/components/ColumnElement/index.tsx |   8 +-
 .../ExploreCtasResultsButton/index.tsx        |   2 +-
 .../components/ExploreResultsButton/index.tsx |   2 +-
 .../components/QueryLimitSelect/index.tsx     |   5 +-
 .../components/SaveDatasetModal/index.tsx     |   2 +-
 .../components/ScheduleQueryButton/index.tsx  |   2 +-
 .../components/TemplateParamsEditor/index.tsx |  12 +-
 .../src/components/AlteredSliceTag/index.jsx  |   6 +-
 .../src/components/CopyToClipboard/index.jsx  |   2 +-
 .../Datasource/ChangeDatasourceModal.tsx      |   4 +-
 .../Datasource/DatasourceEditor.jsx           |   8 +-
 .../Form/LabeledErrorBoundInput.tsx           |   6 +-
 .../src/components/ImportModal/index.tsx      |   4 +-
 .../src/components/ReportModal/index.tsx      |   2 +-
 .../DashboardBuilder/DashboardBuilder.tsx     |   2 +-
 .../components/DashboardEmbedControls.tsx     |   2 +-
 .../components/gridComponents/Tabs.jsx        |  13 +-
 .../gridComponents/new/NewMarkdown.jsx        |   3 +-
 .../FiltersConfigModal/FilterTitlePane.tsx    |   4 +-
 .../AnnotationLayer.jsx                       |  28 ++---
 .../controls/ColorSchemeControl/index.tsx     |   2 +-
 .../controls/FixedOrMetricControl/index.jsx   |   2 +-
 .../AdhocMetricEditPopoverTitle.tsx           |   2 +-
 .../components/controls/SpatialControl.jsx    |   6 +-
 .../TimeSeriesColumnControl/index.jsx         |  92 +++++++-------
 .../components/controls/ViewportControl.jsx   |   3 +-
 .../src/explore/controlPanels/sections.tsx    |  76 ++++++------
 superset-frontend/src/explore/controls.jsx    |  42 +++----
 superset-frontend/src/explore/fixtures.tsx    |   6 +-
 .../components/GroupBy/controlPanel.ts        |   2 +-
 .../filters/components/Range/buildQuery.ts    |   5 +-
 .../filters/components/Range/controlPanel.ts  |   2 +-
 .../filters/components/Select/controlPanel.ts |   2 +-
 .../filters/components/Time/controlPanel.ts   |   2 +-
 .../src/profile/components/UserInfo.tsx       |   2 +-
 .../src/views/CRUD/alert/ExecutionLog.tsx     |   2 +-
 .../components/AlertReportCronScheduler.tsx   |   2 +-
 .../views/CRUD/annotation/AnnotationList.tsx  |   4 +-
 .../CommonParameters.tsx                      |   2 +-
 .../database/DatabaseModal/ExtraOptions.tsx   |  14 +--
 .../database/DatabaseModal/ModalHeader.tsx    |  60 +++++++--
 .../data/dataset/AddDataset/Footer/index.tsx  |   2 +-
 .../views/CRUD/data/dataset/DatasetList.tsx   |   4 +-
 .../src/views/CRUD/welcome/Welcome.tsx        |   2 +-
 .../src/views/components/RightMenu.tsx        |   6 +-
 .../visualizations/FilterBox/controlPanel.jsx |   2 +-
 .../visualizations/TimeTable/TimeTable.jsx    |   4 +-
 .../charts/data/commands/get_data_command.py  |   6 +-
 superset/errors.py                            |   2 +-
 superset/security/manager.py                  |   6 +-
 superset/sqllab/query_render.py               |   2 +-
 superset/views/core.py                        |  16 +--
 superset/viz.py                               |   2 +-
 98 files changed, 748 insertions(+), 663 deletions(-)

diff --git a/superset-frontend/packages/superset-ui-chart-controls/src/sections/advancedAnalytics.tsx b/superset-frontend/packages/superset-ui-chart-controls/src/sections/advancedAnalytics.tsx
index e1ed5ff76dd3..66da4bb9e286 100644
--- a/superset-frontend/packages/superset-ui-chart-controls/src/sections/advancedAnalytics.tsx
+++ b/superset-frontend/packages/superset-ui-chart-controls/src/sections/advancedAnalytics.tsx
@@ -108,20 +108,18 @@ export const advancedAnalyticsControls: ControlPanelSectionConfig = {
           multi: true,
           freeForm: true,
           label: t('Time shift'),
-          choices: formatSelectOptions([
-            '1 day ago',
-            '1 week ago',
-            '28 days ago',
-            '30 days ago',
-            '52 weeks ago',
-            '1 year ago',
-            '104 weeks ago',
-            '2 years ago',
-            '156 weeks ago',
-            '3 years ago',
-            '208 weeks ago',
-            '4 years ago',
-          ]),
+          choices: [
+            ['1 day ago', t('1 day ago')],
+            ['1 week ago', t('1 week ago')],
+            ['28 days ago', t('28 days ago')],
+            ['30 days ago', t('30 days ago')],
+            ['52 weeks ago', t('52 weeks ago')],
+            ['1 year ago', t('1 year ago')],
+            ['104 weeks ago', t('104 weeks ago')],
+            ['2 years ago', t('2 years ago')],
+            ['156 weeks ago', t('156 weeks ago')],
+            ['3 years ago', t('3 years ago')],
+          ],
           description: t(
             'Overlay one or more timeseries from a ' +
               'relative time period. Expects relative time deltas ' +
@@ -139,10 +137,10 @@ export const advancedAnalyticsControls: ControlPanelSectionConfig = {
           label: t('Calculation type'),
           default: 'values',
           choices: [
-            [ComparisionType.Values, 'Actual values'],
-            [ComparisionType.Difference, 'Difference'],
-            [ComparisionType.Percentage, 'Percentage change'],
-            [ComparisionType.Ratio, 'Ratio'],
+            [ComparisionType.Values, t('Actual values')],
+            [ComparisionType.Difference, t('Difference')],
+            [ComparisionType.Percentage, t('Percentage change')],
+            [ComparisionType.Ratio, t('Ratio')],
           ],
           description: t(
             'How to display time shifts: as individual lines; as the ' +
@@ -162,14 +160,14 @@ export const advancedAnalyticsControls: ControlPanelSectionConfig = {
           label: t('Rule'),
           default: null,
           choices: [
-            ['1T', '1 minutely frequency'],
-            ['1H', '1 hourly frequency'],
-            ['1D', '1 calendar day frequency'],
-            ['7D', '7 calendar day frequency'],
-            ['1MS', '1 month start frequency'],
-            ['1M', '1 month end frequency'],
-            ['1AS', '1 year start frequency'],
-            ['1A', '1 year end frequency'],
+            ['1T', t('1 minutely frequency')],
+            ['1H', t('1 hourly frequency')],
+            ['1D', t('1 calendar day frequency')],
+            ['7D', t('7 calendar day frequency')],
+            ['1MS', t('1 month start frequency')],
+            ['1M', t('1 month end frequency')],
+            ['1AS', t('1 year start frequency')],
+            ['1A', t('1 year end frequency')],
           ],
           description: t('Pandas resample rule'),
         },
diff --git a/superset-frontend/packages/superset-ui-chart-controls/src/sections/chartTitle.tsx b/superset-frontend/packages/superset-ui-chart-controls/src/sections/chartTitle.tsx
index eda3ac33152d..5e010c27e2f5 100644
--- a/superset-frontend/packages/superset-ui-chart-controls/src/sections/chartTitle.tsx
+++ b/superset-frontend/packages/superset-ui-chart-controls/src/sections/chartTitle.tsx
@@ -24,7 +24,10 @@ import { formatSelectOptions } from '../utils';
 export const TITLE_MARGIN_OPTIONS: number[] = [
   15, 30, 50, 75, 100, 125, 150, 200,
 ];
-export const TITLE_POSITION_OPTIONS: string[] = ['Left', 'Top'];
+export const TITLE_POSITION_OPTIONS: [string, string][] = [
+  ['Left', t('Left')],
+  ['Top', t('Top')],
+];
 export const titleControls: ControlPanelSectionConfig = {
   label: t('Chart Title'),
   tabOverride: 'customize',
@@ -95,8 +98,8 @@ export const titleControls: ControlPanelSectionConfig = {
           clearable: false,
           label: t('Y AXIS TITLE POSITION'),
           renderTrigger: true,
-          default: TITLE_POSITION_OPTIONS[0],
-          choices: formatSelectOptions(TITLE_POSITION_OPTIONS),
+          default: TITLE_POSITION_OPTIONS[0][0],
+          choices: TITLE_POSITION_OPTIONS,
           description: t('Changing this control takes effect instantly'),
         },
       },
diff --git a/superset-frontend/packages/superset-ui-chart-controls/src/shared-controls/sharedControls.tsx b/superset-frontend/packages/superset-ui-chart-controls/src/shared-controls/sharedControls.tsx
index 45ca968c7e01..a2fb767f5f3c 100644
--- a/superset-frontend/packages/superset-ui-chart-controls/src/shared-controls/sharedControls.tsx
+++ b/superset-frontend/packages/superset-ui-chart-controls/src/shared-controls/sharedControls.tsx
@@ -157,22 +157,22 @@ const granularity: SharedControlConfig<'SelectControl'> = {
   label: TIME_FILTER_LABELS.granularity,
   default: 'one day',
   choices: [
-    [null, 'all'],
-    ['PT5S', '5 seconds'],
-    ['PT30S', '30 seconds'],
-    ['PT1M', '1 minute'],
-    ['PT5M', '5 minutes'],
-    ['PT30M', '30 minutes'],
-    ['PT1H', '1 hour'],
-    ['PT6H', '6 hour'],
-    ['P1D', '1 day'],
-    ['P7D', '7 days'],
-    ['P1W', 'week'],
-    ['week_starting_sunday', 'week starting Sunday'],
-    ['week_ending_saturday', 'week ending Saturday'],
-    ['P1M', 'month'],
-    ['P3M', 'quarter'],
-    ['P1Y', 'year'],
+    [null, t('all')],
+    ['PT5S', t('5 seconds')],
+    ['PT30S', t('30 seconds')],
+    ['PT1M', t('1 minute')],
+    ['PT5M', t('5 minutes')],
+    ['PT30M', t('30 minutes')],
+    ['PT1H', t('1 hour')],
+    ['PT6H', t('6 hour')],
+    ['P1D', t('1 day')],
+    ['P7D', t('7 days')],
+    ['P1W', t('week')],
+    ['week_starting_sunday', t('week starting Sunday')],
+    ['week_ending_saturday', t('week ending Saturday')],
+    ['P1M', t('month')],
+    ['P3M', t('quarter')],
+    ['P1Y', t('year')],
   ],
   description: t(
     'The time granularity for the visualization. Note that you ' +
diff --git a/superset-frontend/packages/superset-ui-core/src/chart/components/FallbackComponent.tsx b/superset-frontend/packages/superset-ui-core/src/chart/components/FallbackComponent.tsx
index 5c22f920824e..f7dcd8306e64 100644
--- a/superset-frontend/packages/superset-ui-core/src/chart/components/FallbackComponent.tsx
+++ b/superset-frontend/packages/superset-ui-core/src/chart/components/FallbackComponent.tsx
@@ -18,6 +18,7 @@
  */
 
 import React from 'react';
+import { t } from '@superset-ui/core';
 import { SupersetTheme } from '../../style';
 import { FallbackPropsWithDimension } from './SuperChart';
 
@@ -41,13 +42,13 @@ export default function FallbackComponent({
     >
       <div>
         <div>
-          <b>Oops! An error occurred!</b>
+          <b>{t('Oops! An error occurred!')}</b>
         </div>
         <code>{error ? error.toString() : 'Unknown Error'}</code>
       </div>
       {componentStack && (
         <div>
-          <b>Stack Trace:</b>
+          <b>{t('Stack Trace:')}</b>
           <code>
             {componentStack.split('\n').map((row: string) => (
               <div key={row}>{row}</div>
diff --git a/superset-frontend/packages/superset-ui-core/src/chart/components/SuperChartCore.tsx b/superset-frontend/packages/superset-ui-core/src/chart/components/SuperChartCore.tsx
index 10e4cd18e682..d818890aa552 100644
--- a/superset-frontend/packages/superset-ui-core/src/chart/components/SuperChartCore.tsx
+++ b/superset-frontend/packages/superset-ui-core/src/chart/components/SuperChartCore.tsx
@@ -19,6 +19,7 @@
 
 /* eslint-disable react/jsx-sort-default-props */
 import * as React from 'react';
+import { t } from '@superset-ui/core';
 import { createSelector } from 'reselect';
 import getChartComponentRegistry from '../registries/ChartComponentRegistrySingleton';
 import getChartTransformPropsRegistry from '../registries/ChartTransformPropsRegistrySingleton';
@@ -167,7 +168,7 @@ export default class SuperChartCore extends React.PureComponent<Props, {}> {
     if (error) {
       return (
         <div className="alert alert-warning" role="alert">
-          <strong>ERROR</strong>&nbsp;
+          <strong>{t('ERROR')}</strong>&nbsp;
           <code>chartType=&quot;{chartType}&quot;</code> &mdash;
           {error.toString()}
         </div>
diff --git a/superset-frontend/packages/superset-ui-demo/storybook/shared/components/VerifyCORS.tsx b/superset-frontend/packages/superset-ui-demo/storybook/shared/components/VerifyCORS.tsx
index de0b2ef8aba0..3aa082186981 100644
--- a/superset-frontend/packages/superset-ui-demo/storybook/shared/components/VerifyCORS.tsx
+++ b/superset-frontend/packages/superset-ui-demo/storybook/shared/components/VerifyCORS.tsx
@@ -23,6 +23,7 @@ import {
   Method,
   makeApi,
   SupersetApiError,
+  t,
 } from '@superset-ui/core';
 import ErrorMessage from './ErrorMessage';
 
@@ -121,7 +122,7 @@ export default class VerifyCORS extends React.Component<Props, State> {
             className="btn btn-primary btn-sm"
             onClick={this.handleVerify}
           >
-            Verify
+            {t('Verify')}
           </button>
           <br />
           <br />
diff --git a/superset-frontend/plugins/legacy-plugin-chart-calendar/src/controlPanel.ts b/superset-frontend/plugins/legacy-plugin-chart-calendar/src/controlPanel.ts
index fe2c1bd1fc56..9071a278eeba 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-calendar/src/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-plugin-chart-calendar/src/controlPanel.ts
@@ -21,7 +21,6 @@ import {
   ControlPanelConfig,
   D3_FORMAT_DOCS,
   D3_TIME_FORMAT_OPTIONS,
-  formatSelectOptions,
   getStandardizedControls,
   sections,
 } from '@superset-ui/chart-controls';
@@ -40,13 +39,13 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Domain'),
               default: 'month',
-              choices: formatSelectOptions([
-                'hour',
-                'day',
-                'week',
-                'month',
-                'year',
-              ]),
+              choices: [
+                ['hour', t('hour')],
+                ['day', t('day')],
+                ['week', t('week')],
+                ['month', t('month')],
+                ['year', t('year')],
+              ],
               description: t('The time unit used for the grouping of blocks'),
             },
           },
@@ -56,13 +55,13 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Subdomain'),
               default: 'day',
-              choices: formatSelectOptions([
-                'min',
-                'hour',
-                'day',
-                'week',
-                'month',
-              ]),
+              choices: [
+                ['min', t('min')],
+                ['hour', t('hour')],
+                ['day', t('day')],
+                ['week', t('week')],
+                ['month', t('month')],
+              ],
               description: t(
                 'The time unit for each block. Should be a smaller unit than ' +
                   'domain_granularity. Should be larger or equal to Time Grain',
diff --git a/superset-frontend/plugins/legacy-plugin-chart-heatmap/src/controlPanel.tsx b/superset-frontend/plugins/legacy-plugin-chart-heatmap/src/controlPanel.tsx
index 09df0427e208..3032654ba267 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-heatmap/src/controlPanel.tsx
+++ b/superset-frontend/plugins/legacy-plugin-chart-heatmap/src/controlPanel.tsx
@@ -27,7 +27,6 @@ import {
   columnChoices,
   ControlPanelConfig,
   ControlPanelState,
-  formatSelectOptions,
   formatSelectOptionsForRange,
   sections,
   sharedControls,
@@ -72,7 +71,7 @@ const config: ControlPanelConfig = {
             name: 'all_columns_x',
             config: {
               ...columnsConfig,
-              label: 'X Axis',
+              label: t('X Axis'),
             },
           },
         ],
@@ -81,7 +80,7 @@ const config: ControlPanelConfig = {
             name: 'all_columns_y',
             config: {
               ...columnsConfig,
-              label: 'Y Axis',
+              label: t('Y Axis'),
             },
           },
         ],
@@ -148,8 +147,8 @@ const config: ControlPanelConfig = {
               label: t('Rendering'),
               renderTrigger: true,
               choices: [
-                ['pixelated', 'pixelated (Sharp)'],
-                ['auto', 'auto (Smooth)'],
+                ['pixelated', t('pixelated (Sharp)')],
+                ['auto', t('auto (Smooth)')],
               ],
               default: 'pixelated',
               description: t(
@@ -166,9 +165,9 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Normalize Across'),
               choices: [
-                ['heatmap', 'heatmap'],
-                ['x', 'x'],
-                ['y', 'y'],
+                ['heatmap', t('heatmap')],
+                ['x', t('x')],
+                ['y', t('y')],
               ],
               default: 'heatmap',
               description: (
@@ -200,15 +199,15 @@ const config: ControlPanelConfig = {
               freeForm: true,
               clearable: false,
               label: t('Left Margin'),
-              choices: formatSelectOptions([
-                'auto',
-                50,
-                75,
-                100,
-                125,
-                150,
-                200,
-              ]),
+              choices: [
+                ['auto', t('auto')],
+                [50, '50'],
+                [75, '75'],
+                [100, '100'],
+                [125, '125'],
+                [150, '150'],
+                [200, '200'],
+              ],
               default: 'auto',
               renderTrigger: true,
               description: t(
@@ -225,15 +224,15 @@ const config: ControlPanelConfig = {
               clearable: false,
               freeForm: true,
               label: t('Bottom Margin'),
-              choices: formatSelectOptions([
-                'auto',
-                50,
-                75,
-                100,
-                125,
-                150,
-                200,
-              ]),
+              choices: [
+                ['auto', t('auto')],
+                [50, '50'],
+                [75, '75'],
+                [100, '100'],
+                [125, '125'],
+                [150, '150'],
+                [200, '200'],
+              ],
               default: 'auto',
               renderTrigger: true,
               description: t(
diff --git a/superset-frontend/plugins/legacy-plugin-chart-horizon/src/controlPanel.ts b/superset-frontend/plugins/legacy-plugin-chart-horizon/src/controlPanel.ts
index ca18b712b82f..c81e802b3dca 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-horizon/src/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-plugin-chart-horizon/src/controlPanel.ts
@@ -82,9 +82,9 @@ const config: ControlPanelConfig = {
               renderTrigger: true,
               label: t('Value Domain'),
               choices: [
-                ['series', 'series'],
-                ['overall', 'overall'],
-                ['change', 'change'],
+                ['series', t('series')],
+                ['overall', t('overall')],
+                ['change', t('change')],
               ],
               default: 'series',
               description: t(
diff --git a/superset-frontend/plugins/legacy-plugin-chart-map-box/src/controlPanel.ts b/superset-frontend/plugins/legacy-plugin-chart-map-box/src/controlPanel.ts
index 8d05cda07828..1dc75d96ef44 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-map-box/src/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-plugin-chart-map-box/src/controlPanel.ts
@@ -40,12 +40,12 @@ const columnsConfig = isFeatureEnabled(FeatureFlag.ENABLE_EXPLORE_DRAG_AND_DROP)
   : allColumns;
 
 const colorChoices = [
-  ['rgb(0, 139, 139)', 'Dark Cyan'],
-  ['rgb(128, 0, 128)', 'Purple'],
-  ['rgb(255, 215, 0)', 'Gold'],
-  ['rgb(69, 69, 69)', 'Dim Gray'],
-  ['rgb(220, 20, 60)', 'Crimson'],
-  ['rgb(34, 139, 34)', 'Forest Green'],
+  ['rgb(0, 139, 139)', t('Dark Cyan')],
+  ['rgb(128, 0, 128)', t('Purple')],
+  ['rgb(255, 215, 0)', t('Gold')],
+  ['rgb(69, 69, 69)', t('Dim Gray')],
+  ['rgb(220, 20, 60)', t('Crimson')],
+  ['rgb(34, 139, 34)', t('Forest Green')],
 ];
 
 const config: ControlPanelConfig = {
@@ -124,9 +124,7 @@ const config: ControlPanelConfig = {
               ),
               mapStateToProps: state => {
                 const datasourceChoices = columnChoices(state.datasource);
-                const choices: [string, string][] = formatSelectOptions([
-                  'Auto',
-                ]);
+                const choices: [string, string][] = [['Auto', t('Auto')]];
                 return {
                   choices: choices.concat(datasourceChoices),
                 };
@@ -141,7 +139,11 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Point Radius Unit'),
               default: 'Pixels',
-              choices: formatSelectOptions(['Pixels', 'Miles', 'Kilometers']),
+              choices: [
+                ['Pixels', t('Pixels')],
+                ['Miles', t('Miles')],
+                ['Kilometers', t('Kilometers')],
+              ],
               description: t(
                 'The unit of measure for the specified point radius',
               ),
@@ -180,14 +182,14 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Cluster label aggregator'),
               clearable: false,
-              choices: formatSelectOptions([
-                'sum',
-                'mean',
-                'min',
-                'max',
-                'std',
-                'var',
-              ]),
+              choices: [
+                ['sum', t('sum')],
+                ['mean', t('mean')],
+                ['min', t('min')],
+                ['max', t('max')],
+                ['std', t('std')],
+                ['var', t('var')],
+              ],
               default: 'sum',
               description: t(
                 'Aggregate function applied to the list of points ' +
@@ -223,15 +225,15 @@ const config: ControlPanelConfig = {
               clearable: false,
               renderTrigger: true,
               choices: [
-                ['mapbox://styles/mapbox/streets-v9', 'Streets'],
-                ['mapbox://styles/mapbox/dark-v9', 'Dark'],
-                ['mapbox://styles/mapbox/light-v9', 'Light'],
+                ['mapbox://styles/mapbox/streets-v9', t('Streets')],
+                ['mapbox://styles/mapbox/dark-v9', t('Dark')],
+                ['mapbox://styles/mapbox/light-v9', t('Light')],
                 [
                   'mapbox://styles/mapbox/satellite-streets-v9',
-                  'Satellite Streets',
+                  t('Satellite Streets'),
                 ],
-                ['mapbox://styles/mapbox/satellite-v9', 'Satellite'],
-                ['mapbox://styles/mapbox/outdoors-v9', 'Outdoors'],
+                ['mapbox://styles/mapbox/satellite-v9', t('Satellite')],
+                ['mapbox://styles/mapbox/outdoors-v9', t('Outdoors')],
               ],
               default: 'mapbox://styles/mapbox/light-v9',
               description: t('Base layer map style'),
diff --git a/superset-frontend/plugins/legacy-plugin-chart-partition/src/controlPanel.tsx b/superset-frontend/plugins/legacy-plugin-chart-partition/src/controlPanel.tsx
index 92293737660f..d983dca24af8 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-partition/src/controlPanel.tsx
+++ b/superset-frontend/plugins/legacy-plugin-chart-partition/src/controlPanel.tsx
@@ -24,7 +24,6 @@ import {
   D3_FORMAT_DOCS,
   D3_FORMAT_OPTIONS,
   D3_TIME_FORMAT_OPTIONS,
-  formatSelectOptions,
   getStandardizedControls,
   sections,
 } from '@superset-ui/chart-controls';
@@ -250,13 +249,13 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Rolling Function'),
               default: 'None',
-              choices: formatSelectOptions([
-                'None',
-                'mean',
-                'sum',
-                'std',
-                'cumsum',
-              ]),
+              choices: [
+                ['None', t('None')],
+                ['mean', t('mean')],
+                ['sum', t('sum')],
+                ['std', t('std')],
+                ['cumsum', t('cumsum')],
+              ],
               description: t(
                 'Defines a rolling window function to apply, works along ' +
                   'with the [Periods] text box',
@@ -303,20 +302,18 @@ const config: ControlPanelConfig = {
               multi: true,
               freeForm: true,
               label: t('Time Shift'),
-              choices: formatSelectOptions([
-                '1 day',
-                '1 week',
-                '28 days',
-                '30 days',
-                '52 weeks',
-                '1 year',
-                '104 weeks',
-                '2 years',
-                '156 weeks',
-                '3 years',
-                '208 weeks',
-                '4 years',
-              ]),
+              choices: [
+                ['1 day', t('1 day')],
+                ['1 week', t('1 week')],
+                ['28 days', t('28 days')],
+                ['30 days', t('30 days')],
+                ['52 weeks', t('52 weeks')],
+                ['1 year', t('1 year')],
+                ['104 weeks', t('104 weeks')],
+                ['2 years', t('2 years')],
+                ['156 weeks', t('156 weeks')],
+                ['3 years', t('3 years')],
+              ],
               description: t(
                 'Overlay one or more timeseries from a ' +
                   'relative time period. Expects relative time deltas ' +
@@ -354,14 +351,14 @@ const config: ControlPanelConfig = {
               freeForm: true,
               label: t('Rule'),
               default: null,
-              choices: formatSelectOptions([
-                '1T',
-                '1H',
-                '1D',
-                '7D',
-                '1M',
-                '1AS',
-              ]),
+              choices: [
+                ['1T', t('1T')],
+                ['1H', t('1H')],
+                ['1D', t('1D')],
+                ['7D', t('7D')],
+                ['1M', t('1M')],
+                ['1AS', t('1AS')],
+              ],
               description: t('Pandas resample rule'),
             },
           },
@@ -372,14 +369,14 @@ const config: ControlPanelConfig = {
               freeForm: true,
               label: t('Method'),
               default: null,
-              choices: formatSelectOptions([
-                'asfreq',
-                'bfill',
-                'ffill',
-                'median',
-                'mean',
-                'sum',
-              ]),
+              choices: [
+                ['asfreq', t('asfreq')],
+                ['bfill', t('bfill')],
+                ['ffill', t('ffill')],
+                ['median', t('median')],
+                ['mean', t('mean')],
+                ['sum', t('sum')],
+              ],
               description: t('Pandas resample method'),
             },
           },
diff --git a/superset-frontend/plugins/legacy-plugin-chart-pivot-table/src/controlPanel.ts b/superset-frontend/plugins/legacy-plugin-chart-pivot-table/src/controlPanel.ts
index e4c0b477c482..11daca1e9429 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-pivot-table/src/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-plugin-chart-pivot-table/src/controlPanel.ts
@@ -19,7 +19,6 @@
 import { t } from '@superset-ui/core';
 import {
   ControlPanelConfig,
-  formatSelectOptions,
   D3_FORMAT_DOCS,
   D3_FORMAT_OPTIONS,
   D3_TIME_FORMAT_OPTIONS,
@@ -52,14 +51,14 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Aggregation function'),
               clearable: false,
-              choices: formatSelectOptions([
-                'sum',
-                'mean',
-                'min',
-                'max',
-                'std',
-                'var',
-              ]),
+              choices: [
+                ['sum', t('sum')],
+                ['mean', t('mean')],
+                ['min', t('min')],
+                ['max', t('max')],
+                ['std', t('std')],
+                ['var', t('var')],
+              ],
               default: 'sum',
               description: t(
                 'Aggregate function to apply when pivoting and ' +
diff --git a/superset-frontend/plugins/legacy-plugin-chart-rose/src/controlPanel.tsx b/superset-frontend/plugins/legacy-plugin-chart-rose/src/controlPanel.tsx
index 12795385f345..11bb451d57f9 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-rose/src/controlPanel.tsx
+++ b/superset-frontend/plugins/legacy-plugin-chart-rose/src/controlPanel.tsx
@@ -20,7 +20,6 @@ import React from 'react';
 import { t } from '@superset-ui/core';
 import {
   ControlPanelConfig,
-  formatSelectOptions,
   D3_FORMAT_DOCS,
   D3_FORMAT_OPTIONS,
   D3_TIME_FORMAT_OPTIONS,
@@ -132,13 +131,13 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Rolling Function'),
               default: 'None',
-              choices: formatSelectOptions([
-                'None',
-                'mean',
-                'sum',
-                'std',
-                'cumsum',
-              ]),
+              choices: [
+                ['None', t('None')],
+                ['mean', t('mean')],
+                ['sum', t('sum')],
+                ['std', t('std')],
+                ['cumsum', t('cumsum')],
+              ],
               description: t(
                 'Defines a rolling window function to apply, works along ' +
                   'with the [Periods] text box',
@@ -185,20 +184,18 @@ const config: ControlPanelConfig = {
               multi: true,
               freeForm: true,
               label: t('Time Shift'),
-              choices: formatSelectOptions([
-                '1 day',
-                '1 week',
-                '28 days',
-                '30 days',
-                '52 weeks',
-                '1 year',
-                '104 weeks',
-                '2 years',
-                '156 weeks',
-                '3 years',
-                '208 weeks',
-                '4 years',
-              ]),
+              choices: [
+                ['1 day', t('1 day')],
+                ['1 week', t('1 week')],
+                ['28 days', t('28 days')],
+                ['30 days', t('30 days')],
+                ['52 weeks', t('52 weeks')],
+                ['1 year', t('1 year')],
+                ['104 weeks', t('104 weeks')],
+                ['2 years', t('2 years')],
+                ['156 weeks', t('156 weeks')],
+                ['3 years', t('3 years')],
+              ],
               description: t(
                 'Overlay one or more timeseries from a ' +
                   'relative time period. Expects relative time deltas ' +
@@ -214,10 +211,10 @@ const config: ControlPanelConfig = {
               label: t('Calculation type'),
               default: 'values',
               choices: [
-                ['values', 'Actual Values'],
-                ['absolute', 'Difference'],
-                ['percentage', 'Percentage change'],
-                ['ratio', 'Ratio'],
+                ['values', t('Actual Values')],
+                ['absolute', t('Difference')],
+                ['percentage', t('Percentage change')],
+                ['ratio', t('Ratio')],
               ],
               description: t(
                 'How to display time shifts: as individual lines; as the ' +
@@ -236,14 +233,14 @@ const config: ControlPanelConfig = {
               freeForm: true,
               label: t('Rule'),
               default: null,
-              choices: formatSelectOptions([
-                '1T',
-                '1H',
-                '1D',
-                '7D',
-                '1M',
-                '1AS',
-              ]),
+              choices: [
+                ['1T', t('1T')],
+                ['1H', t('1H')],
+                ['1D', t('1D')],
+                ['7D', t('7D')],
+                ['1M', t('1M')],
+                ['1AS', t('1AS')],
+              ],
               description: t('Pandas resample rule'),
             },
           },
@@ -254,14 +251,14 @@ const config: ControlPanelConfig = {
               freeForm: true,
               label: t('Method'),
               default: null,
-              choices: formatSelectOptions([
-                'asfreq',
-                'bfill',
-                'ffill',
-                'median',
-                'mean',
-                'sum',
-              ]),
+              choices: [
+                ['asfreq', t('asfreq')],
+                ['bfill', t('bfill')],
+                ['ffill', t('ffill')],
+                ['median', t('median')],
+                ['mean', t('mean')],
+                ['sum', t('sum')],
+              ],
               description: t('Pandas resample method'),
             },
           },
diff --git a/superset-frontend/plugins/legacy-plugin-chart-world-map/src/controlPanel.ts b/superset-frontend/plugins/legacy-plugin-chart-world-map/src/controlPanel.ts
index feea2e08481c..b0f3be22c50e 100644
--- a/superset-frontend/plugins/legacy-plugin-chart-world-map/src/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-plugin-chart-world-map/src/controlPanel.ts
@@ -41,10 +41,10 @@ const config: ControlPanelConfig = {
               label: t('Country Field Type'),
               default: 'cca2',
               choices: [
-                ['name', 'Full name'],
-                ['cioc', 'code International Olympic Committee (cioc)'],
-                ['cca2', 'code ISO 3166-1 alpha-2 (cca2)'],
-                ['cca3', 'code ISO 3166-1 alpha-3 (cca3)'],
+                ['name', t('Full name')],
+                ['cioc', t('code International Olympic Committee (cioc)')],
+                ['cca2', t('code ISO 3166-1 alpha-2 (cca2)')],
+                ['cca3', t('code ISO 3166-1 alpha-3 (cca3)')],
               ],
               description: t(
                 'The country code standard that Superset should expect ' +
diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Arc/Arc.jsx b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Arc/Arc.jsx
index a2c8e6143610..75cf8d09a18c 100644
--- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Arc/Arc.jsx
+++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Arc/Arc.jsx
@@ -37,11 +37,11 @@ function setTooltipContent(formData) {
   return o => (
     <div className="deckgl-tooltip">
       <TooltipRow
-        label={`${t('Start (Longitude, Latitude)')}: `}
+        label={t('Start (Longitude, Latitude): ')}
         value={`${o.object.sourcePosition[0]}, ${o.object.sourcePosition[1]}`}
       />
       <TooltipRow
-        label={`${t('End (Longitude, Latitude)')}: `}
+        label={t('End (Longitude, Latitude): ')}
         value={`${o.object.targetPosition[0]}, ${o.object.targetPosition[1]}`}
       />
       {formData.dimension && (
diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Grid/Grid.jsx b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Grid/Grid.jsx
index de2a6036598a..d19ef3edb161 100644
--- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Grid/Grid.jsx
+++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Grid/Grid.jsx
@@ -30,11 +30,13 @@ function setTooltipContent(o) {
   return (
     <div className="deckgl-tooltip">
       <TooltipRow
-        label={`${t('Longitude and Latitude')}: `}
+        // eslint-disable-next-line prefer-template
+        label={t('Longitude and Latitude') + ': '}
         value={`${o.coordinate[0]}, ${o.coordinate[1]}`}
       />
       <TooltipRow
-        label={`${t('Height')}: `}
+        // eslint-disable-next-line prefer-template
+        label={t('Height') + ': '}
         value={`${o.object.elevationValue}`}
       />
     </div>
diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Hex/Hex.jsx b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Hex/Hex.jsx
index cd99138028fb..a3c430acb19f 100644
--- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Hex/Hex.jsx
+++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Hex/Hex.jsx
@@ -30,11 +30,12 @@ function setTooltipContent(o) {
   return (
     <div className="deckgl-tooltip">
       <TooltipRow
-        label={`${t('Centroid (Longitude and Latitude)')}: `}
+        label={t('Centroid (Longitude and Latitude): ')}
         value={`(${o.coordinate[0]}, ${o.coordinate[1]})`}
       />
       <TooltipRow
-        label={`${t('Height')}: `}
+        // eslint-disable-next-line prefer-template
+        label={t('Height') + ': '}
         value={`${o.object.elevationValue}`}
       />
     </div>
diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Hex/controlPanel.ts b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Hex/controlPanel.ts
index eee7c341a19c..2f9293c52182 100644
--- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Hex/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Hex/controlPanel.ts
@@ -22,7 +22,6 @@ import {
   sections,
 } from '@superset-ui/chart-controls';
 import { t } from '@superset-ui/core';
-import { formatSelectOptions } from '../../utilities/utils';
 import {
   autozoom,
   extruded,
@@ -71,20 +70,20 @@ const config: ControlPanelConfig = {
               default: 'sum',
               clearable: false,
               renderTrigger: true,
-              choices: formatSelectOptions([
-                'sum',
-                'min',
-                'max',
-                'mean',
-                'median',
-                'count',
-                'variance',
-                'deviation',
-                'p1',
-                'p5',
-                'p95',
-                'p99',
-              ]),
+              choices: [
+                ['sum', t('sum')],
+                ['min', t('min')],
+                ['max', t('max')],
+                ['mean', t('mean')],
+                ['median', t('median')],
+                ['count', t('count')],
+                ['variance', t('variance')],
+                ['deviation', t('deviation')],
+                ['p1', t('p1')],
+                ['p5', t('p5')],
+                ['p95', t('p95')],
+                ['p99', t('p99')],
+              ],
             },
           },
         ],
diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Path/controlPanel.ts b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Path/controlPanel.ts
index 99866115ab02..cdbb06746bc9 100644
--- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Path/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Path/controlPanel.ts
@@ -52,8 +52,8 @@ const config: ControlPanelConfig = {
             config: {
               ...lineType.config,
               choices: [
-                ['polyline', 'Polyline'],
-                ['json', 'JSON'],
+                ['polyline', t('Polyline')],
+                ['json', t('JSON')],
               ],
             },
           },
diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Polygon/Polygon.jsx b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Polygon/Polygon.jsx
index bdd4f66bc116..125518da68c1 100644
--- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Polygon/Polygon.jsx
+++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Polygon/Polygon.jsx
@@ -22,6 +22,7 @@
 /* eslint no-underscore-dangle: ["error", { "allow": ["", "__timestamp"] }] */
 
 import React from 'react';
+import { t } from '@superset-ui/core';
 import PropTypes from 'prop-types';
 
 import { PolygonLayer } from 'deck.gl';
@@ -57,7 +58,11 @@ function setTooltipContent(formData) {
     return (
       <div className="deckgl-tooltip">
         {o.object.name && (
-          <TooltipRow label="name: " value={`${o.object.name}`} />
+          <TooltipRow
+            // eslint-disable-next-line prefer-template
+            label={t('name') + ': '}
+            value={`${o.object.name}`}
+          />
         )}
         {o.object[formData.line_column] && (
           <TooltipRow
diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/Scatter.jsx b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/Scatter.jsx
index ca0162fa3a1c..3ad0dcea986b 100644
--- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/Scatter.jsx
+++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/Scatter.jsx
@@ -36,12 +36,14 @@ function setTooltipContent(formData, verboseMap) {
     return (
       <div className="deckgl-tooltip">
         <TooltipRow
-          label={`${t('Longitude and Latitude')}: `}
+          // eslint-disable-next-line prefer-template
+          label={t('Longitude and Latitude') + ': '}
           value={`${o.object.position[0]}, ${o.object.position[1]}`}
         />
         {o.object.cat_color && (
           <TooltipRow
-            label={`${t('Category')}: `}
+            // eslint-disable-next-line prefer-template
+            label={t('Category') + ': '}
             value={`${o.object.cat_color}`}
           />
         )}
diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/controlPanel.ts b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/controlPanel.ts
index 4932019bb7ad..96bdd9e25403 100644
--- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Scatter/controlPanel.ts
@@ -80,12 +80,12 @@ const config: ControlPanelConfig = {
               default: 'square_m',
               clearable: false,
               choices: [
-                ['square_m', 'Square meters'],
-                ['square_km', 'Square kilometers'],
-                ['square_miles', 'Square miles'],
-                ['radius_m', 'Radius in meters'],
-                ['radius_km', 'Radius in kilometers'],
-                ['radius_miles', 'Radius in miles'],
+                ['square_m', t('Square meters')],
+                ['square_km', t('Square kilometers')],
+                ['square_miles', t('Square miles')],
+                ['radius_m', t('Radius in meters')],
+                ['radius_km', t('Radius in kilometers')],
+                ['radius_miles', t('Radius in miles')],
               ],
               description: t(
                 'The unit of measure for the specified point radius',
diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Screengrid/Screengrid.jsx b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Screengrid/Screengrid.jsx
index ca61ec0b81cc..7883dda17ed6 100644
--- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Screengrid/Screengrid.jsx
+++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/layers/Screengrid/Screengrid.jsx
@@ -40,10 +40,15 @@ function setTooltipContent(o) {
   return (
     <div className="deckgl-tooltip">
       <TooltipRow
-        label={`${t('Longitude and Latitude')}: `}
+        // eslint-disable-next-line prefer-template
+        label={t('Longitude and Latitude') + ': '}
         value={`${o.coordinate[0]}, ${o.coordinate[1]}`}
       />
-      <TooltipRow label={`${t('Weight')}: `} value={`${o.object.cellWeight}`} />
+      <TooltipRow
+        // eslint-disable-next-line prefer-template
+        label={t('Weight') + ': '}
+        value={`${o.object.cellWeight}`}
+      />
     </div>
   );
 }
diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/utilities/Shared_DeckGL.jsx b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/utilities/Shared_DeckGL.jsx
index f665c118eacc..b1ef65b70d4e 100644
--- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/utilities/Shared_DeckGL.jsx
+++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/utilities/Shared_DeckGL.jsx
@@ -179,11 +179,11 @@ export const legendPosition = {
     clearable: false,
     default: 'tr',
     choices: [
-      [null, 'None'],
-      ['tl', 'Top left'],
-      ['tr', 'Top right'],
-      ['bl', 'Bottom left'],
-      ['br', 'Bottom right'],
+      [null, t('None')],
+      ['tl', t('Top left')],
+      ['tr', t('Top right')],
+      ['bl', t('Bottom left')],
+      ['br', t('Bottom right')],
     ],
     renderTrigger: true,
   },
@@ -270,7 +270,7 @@ export const extruded = {
     label: t('Extruded'),
     renderTrigger: true,
     default: true,
-    description: 'Whether to make the grid 3D',
+    description: t('Whether to make the grid 3D'),
   },
 };
 
@@ -347,9 +347,9 @@ export const lineType = {
     default: 'json',
     description: t('The encoding format of the lines'),
     choices: [
-      ['polyline', 'Polyline'],
-      ['json', 'JSON'],
-      ['geohash', 'geohash (square)'],
+      ['polyline', t('Polyline')],
+      ['json', t('JSON')],
+      ['geohash', t('geohash (square)')],
     ],
   },
 };
@@ -371,12 +371,12 @@ export const mapboxStyle = {
     clearable: false,
     renderTrigger: true,
     choices: [
-      ['mapbox://styles/mapbox/streets-v9', 'Streets'],
-      ['mapbox://styles/mapbox/dark-v9', 'Dark'],
-      ['mapbox://styles/mapbox/light-v9', 'Light'],
-      ['mapbox://styles/mapbox/satellite-streets-v9', 'Satellite Streets'],
-      ['mapbox://styles/mapbox/satellite-v9', 'Satellite'],
-      ['mapbox://styles/mapbox/outdoors-v9', 'Outdoors'],
+      ['mapbox://styles/mapbox/streets-v9', t('Streets')],
+      ['mapbox://styles/mapbox/dark-v9', t('Dark')],
+      ['mapbox://styles/mapbox/light-v9', t('Light')],
+      ['mapbox://styles/mapbox/satellite-streets-v9', t('Satellite Streets')],
+      ['mapbox://styles/mapbox/satellite-v9', t('Satellite')],
+      ['mapbox://styles/mapbox/outdoors-v9', t('Outdoors')],
     ],
     default: 'mapbox://styles/mapbox/light-v9',
     description: t('Base layer map style'),
diff --git a/superset-frontend/plugins/legacy-preset-chart-nvd3/src/Area/controlPanel.ts b/superset-frontend/plugins/legacy-preset-chart-nvd3/src/Area/controlPanel.ts
index c3c08a23c028..d06883a222f0 100644
--- a/superset-frontend/plugins/legacy-preset-chart-nvd3/src/Area/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-preset-chart-nvd3/src/Area/controlPanel.ts
@@ -52,9 +52,9 @@ const config: ControlPanelConfig = {
               label: t('Stacked Style'),
               renderTrigger: true,
               choices: [
-                ['stack', 'stack'],
-                ['stream', 'stream'],
-                ['expand', 'expand'],
+                ['stack', t('stack')],
+                ['stream', t('stream')],
+                ['expand', t('expand')],
               ],
               default: 'stack',
               description: '',
diff --git a/superset-frontend/plugins/legacy-preset-chart-nvd3/src/NVD3Controls.tsx b/superset-frontend/plugins/legacy-preset-chart-nvd3/src/NVD3Controls.tsx
index dc04720b1b7b..b45d6de31a36 100644
--- a/superset-frontend/plugins/legacy-preset-chart-nvd3/src/NVD3Controls.tsx
+++ b/superset-frontend/plugins/legacy-preset-chart-nvd3/src/NVD3Controls.tsx
@@ -23,7 +23,6 @@ import { t } from '@superset-ui/core';
 import {
   ControlPanelSectionConfig,
   CustomControlItem,
-  formatSelectOptions,
   D3_TIME_FORMAT_OPTIONS,
   D3_FORMAT_DOCS,
   D3_FORMAT_OPTIONS,
@@ -75,7 +74,15 @@ export const leftMargin: CustomControlItem = {
     freeForm: true,
     clearable: false,
     label: t('Left Margin'),
-    choices: formatSelectOptions(['auto', 50, 75, 100, 125, 150, 200]),
+    choices: [
+      ['auto', t('auto')],
+      [50, '50'],
+      [75, '75'],
+      [100, '100'],
+      [125, '125'],
+      [150, '150'],
+      [200, '200'],
+    ],
     default: 'auto',
     renderTrigger: true,
     description: t(
@@ -112,14 +119,14 @@ export const lineInterpolation: CustomControlItem = {
     type: 'SelectControl',
     label: t('Line Style'),
     renderTrigger: true,
-    choices: formatSelectOptions([
-      'linear',
-      'basis',
-      'cardinal',
-      'monotone',
-      'step-before',
-      'step-after',
-    ]),
+    choices: [
+      ['linear', t('linear')],
+      ['basis', t('basis')],
+      ['cardinal', t('cardinal')],
+      ['monotone', t('monotone')],
+      ['step-before', t('step-before')],
+      ['step-after', t('step-after')],
+    ],
     default: 'linear',
     description: t('Line interpolation as defined by d3.js'),
   },
@@ -134,9 +141,9 @@ export const showBrush: CustomControlItem = {
     clearable: false,
     default: 'auto',
     choices: [
-      ['yes', 'Yes'],
-      ['no', 'No'],
-      ['auto', 'Auto'],
+      ['yes', t('Yes')],
+      ['no', t('No')],
+      ['auto', t('Auto')],
     ],
     description: t('Whether to display the time range interactive selector'),
   },
@@ -185,7 +192,15 @@ export const bottomMargin: CustomControlItem = {
     clearable: false,
     freeForm: true,
     label: t('Bottom Margin'),
-    choices: formatSelectOptions(['auto', 50, 75, 100, 125, 150, 200]),
+    choices: [
+      ['auto', t('auto')],
+      [50, '50'],
+      [75, '75'],
+      [100, '100'],
+      [125, '125'],
+      [150, '150'],
+      [200, '200'],
+    ],
     default: 'auto',
     renderTrigger: true,
     description: t(
@@ -199,7 +214,12 @@ export const xTicksLayout: CustomControlItem = {
   config: {
     type: 'SelectControl',
     label: t('X Tick Layout'),
-    choices: formatSelectOptions(['auto', 'flat', '45°', 'staggered']),
+    choices: [
+      ['auto', t('auto')],
+      ['flat', t('flat')],
+      ['45°', '45°'],
+      ['staggered', t('staggered')],
+    ],
     default: 'auto',
     clearable: false,
     renderTrigger: true,
@@ -378,13 +398,13 @@ export const timeSeriesSection: ControlPanelSectionConfig[] = [
             type: 'SelectControl',
             label: t('Rolling Function'),
             default: 'None',
-            choices: formatSelectOptions([
-              'None',
-              'mean',
-              'sum',
-              'std',
-              'cumsum',
-            ]),
+            choices: [
+              ['None', t('None')],
+              ['mean', t('mean')],
+              ['sum', t('sum')],
+              ['std', t('std')],
+              ['cumsum', t('cumsum')],
+            ],
             description: t(
               'Defines a rolling window function to apply, works along ' +
                 'with the [Periods] text box',
@@ -432,20 +452,18 @@ export const timeSeriesSection: ControlPanelSectionConfig[] = [
             multi: true,
             freeForm: true,
             label: t('Time Shift'),
-            choices: formatSelectOptions([
-              '1 day',
-              '1 week',
-              '28 days',
-              '30 days',
-              '52 weeks',
-              '1 year',
-              '104 weeks',
-              '2 years',
-              '156 weeks',
-              '3 years',
-              '208 weeks',
-              '4 years',
-            ]),
+            choices: [
+              ['1 day', t('1 day')],
+              ['1 week', t('1 week')],
+              ['28 days', t('28 days')],
+              ['30 days', t('30 days')],
+              ['52 weeks', t('52 weeks')],
+              ['1 year', t('1 year')],
+              ['104 weeks', t('104 weeks')],
+              ['2 years', t('2 years')],
+              ['156 weeks', t('156 weeks')],
+              ['3 years', t('3 years')],
+            ],
             description: t(
               'Overlay one or more timeseries from a ' +
                 'relative time period. Expects relative time deltas ' +
@@ -485,7 +503,14 @@ export const timeSeriesSection: ControlPanelSectionConfig[] = [
             freeForm: true,
             label: t('Rule'),
             default: null,
-            choices: formatSelectOptions(['1T', '1H', '1D', '7D', '1M', '1AS']),
+            choices: [
+              ['1T', t('1T')],
+              ['1H', t('1H')],
+              ['1D', t('1D')],
+              ['7D', t('7D')],
+              ['1M', t('1M')],
+              ['1AS', t('1AS')],
+            ],
             description: t('Pandas resample rule'),
           },
         },
@@ -498,14 +523,14 @@ export const timeSeriesSection: ControlPanelSectionConfig[] = [
             freeForm: true,
             label: t('Method'),
             default: null,
-            choices: formatSelectOptions([
-              'asfreq',
-              'bfill',
-              'ffill',
-              'median',
-              'mean',
-              'sum',
-            ]),
+            choices: [
+              ['asfreq', t('asfreq')],
+              ['bfill', t('bfill')],
+              ['ffill', t('ffill')],
+              ['median', t('median')],
+              ['mean', t('mean')],
+              ['sum', t('sum')],
+            ],
             description: t('Pandas resample method'),
           },
         },
diff --git a/superset-frontend/plugins/legacy-preset-chart-nvd3/src/Pie/controlPanel.ts b/superset-frontend/plugins/legacy-preset-chart-nvd3/src/Pie/controlPanel.ts
index 9145d5a8429a..32052ee3d588 100644
--- a/superset-frontend/plugins/legacy-preset-chart-nvd3/src/Pie/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-preset-chart-nvd3/src/Pie/controlPanel.ts
@@ -48,12 +48,12 @@ const config: ControlPanelConfig = {
               default: 'key',
               renderTrigger: true,
               choices: [
-                ['key', 'Category Name'],
-                ['value', 'Value'],
-                ['percent', 'Percentage'],
-                ['key_value', 'Category and Value'],
-                ['key_percent', 'Category and Percentage'],
-                ['key_value_percent', 'Category, Value and Percentage'],
+                ['key', t('Category Name')],
+                ['value', t('Value')],
+                ['percent', t('Percentage')],
+                ['key_value', t('Category and Value')],
+                ['key_percent', t('Category and Percentage')],
+                ['key_value_percent', t('Category, Value and Percentage')],
               ],
               description: t('What should be shown on the label?'),
             },
diff --git a/superset-frontend/plugins/legacy-preset-chart-nvd3/src/TimePivot/controlPanel.ts b/superset-frontend/plugins/legacy-preset-chart-nvd3/src/TimePivot/controlPanel.ts
index 36d6189c054c..595d5d4b7211 100644
--- a/superset-frontend/plugins/legacy-preset-chart-nvd3/src/TimePivot/controlPanel.ts
+++ b/superset-frontend/plugins/legacy-preset-chart-nvd3/src/TimePivot/controlPanel.ts
@@ -56,12 +56,12 @@ const config: ControlPanelConfig = {
               freeForm: true,
               clearable: false,
               choices: [
-                ['AS', 'Year (freq=AS)'],
-                ['52W-MON', '52 weeks starting Monday (freq=52W-MON)'],
-                ['W-SUN', '1 week starting Sunday (freq=W-SUN)'],
-                ['W-MON', '1 week starting Monday (freq=W-MON)'],
-                ['D', 'Day (freq=D)'],
-                ['4W-MON', '4 weeks (freq=4W-MON)'],
+                ['AS', t('Year (freq=AS)')],
+                ['52W-MON', t('52 weeks starting Monday (freq=52W-MON)')],
+                ['W-SUN', t('1 week starting Sunday (freq=W-SUN)')],
+                ['W-MON', t('1 week starting Monday (freq=W-MON)')],
+                ['D', t('Day (freq=D)')],
+                ['4W-MON', t('4 weeks (freq=4W-MON)')],
               ],
               description: t(
                 `The periodicity over which to pivot time. Users can provide
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/BigNumber/BigNumberWithTrendline/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/BigNumber/BigNumberWithTrendline/controlPanel.tsx
index b142dd1852ea..81e6d2012820 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/BigNumber/BigNumberWithTrendline/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/BigNumber/BigNumberWithTrendline/controlPanel.tsx
@@ -21,7 +21,6 @@ import {
   ControlPanelConfig,
   D3_FORMAT_DOCS,
   D3_TIME_FORMAT_OPTIONS,
-  formatSelectOptions,
   getStandardizedControls,
   sections,
   temporalColumnMixin,
@@ -179,13 +178,13 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Rolling Function'),
               default: 'None',
-              choices: formatSelectOptions([
-                'None',
-                'mean',
-                'sum',
-                'std',
-                'cumsum',
-              ]),
+              choices: [
+                ['None', t('None')],
+                ['mean', t('mean')],
+                ['sum', t('sum')],
+                ['std', t('std')],
+                ['cumsum', t('cumsum')],
+              ],
               description: t(
                 'Defines a rolling window function to apply, works along ' +
                   'with the [Periods] text box',
@@ -234,14 +233,14 @@ const config: ControlPanelConfig = {
               label: t('Rule'),
               default: null,
               choices: [
-                ['1T', '1 minutely frequency'],
-                ['1H', '1 hourly frequency'],
-                ['1D', '1 calendar day frequency'],
-                ['7D', '7 calendar day frequency'],
-                ['1MS', '1 month start frequency'],
-                ['1M', '1 month end frequency'],
-                ['1AS', '1 year start frequency'],
-                ['1A', '1 year end frequency'],
+                ['1T', t('1 minutely frequency')],
+                ['1H', t('1 hourly frequency')],
+                ['1D', t('1 calendar day frequency')],
+                ['7D', t('7 calendar day frequency')],
+                ['1MS', t('1 month start frequency')],
+                ['1M', t('1 month end frequency')],
+                ['1AS', t('1 year start frequency')],
+                ['1A', t('1 year end frequency')],
               ],
               description: t('Pandas resample rule'),
             },
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/controlPanel.ts b/superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/controlPanel.ts
index 9e97459066e0..95b8e6d966ee 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/controlPanel.ts
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/BoxPlot/controlPanel.ts
@@ -27,7 +27,6 @@ import {
   D3_FORMAT_DOCS,
   D3_FORMAT_OPTIONS,
   D3_TIME_FORMAT_OPTIONS,
-  formatSelectOptions,
   sections,
   emitFilterControl,
   ControlPanelConfig,
@@ -93,12 +92,12 @@ const config: ControlPanelConfig = {
               description: t(
                 'Determines how whiskers and outliers are calculated.',
               ),
-              choices: formatSelectOptions([
-                'Tukey',
-                'Min/max (no outliers)',
-                '2/98 percentiles',
-                '9/91 percentiles',
-              ]),
+              choices: [
+                ['Tukey', t('Tukey')],
+                ['Min/max (no outliers)', t('Min/max (no outliers)')],
+                ['2/98 percentiles', t('2/98 percentiles')],
+                ['9/91 percentiles', t('9/91 percentiles')],
+              ],
             },
           },
         ],
@@ -116,13 +115,13 @@ const config: ControlPanelConfig = {
             config: {
               type: 'SelectControl',
               label: t('X Tick Layout'),
-              choices: formatSelectOptions([
-                'auto',
-                'flat',
-                '45°',
-                '90°',
-                'staggered',
-              ]),
+              choices: [
+                ['auto', t('auto')],
+                ['flat', t('flat')],
+                ['45°', '45°'],
+                ['90°', '90°'],
+                ['staggered', t('staggered')],
+              ],
               default: 'auto',
               clearable: false,
               renderTrigger: true,
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Funnel/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Funnel/controlPanel.tsx
index a1d3cf79f7f0..f8acdcf6bef7 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Funnel/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Funnel/controlPanel.tsx
@@ -87,17 +87,17 @@ const config: ControlPanelConfig = {
               default: labelType,
               renderTrigger: true,
               choices: [
-                [EchartsFunnelLabelTypeType.Key, 'Category Name'],
-                [EchartsFunnelLabelTypeType.Value, 'Value'],
-                [EchartsFunnelLabelTypeType.Percent, 'Percentage'],
-                [EchartsFunnelLabelTypeType.KeyValue, 'Category and Value'],
+                [EchartsFunnelLabelTypeType.Key, t('Category Name')],
+                [EchartsFunnelLabelTypeType.Value, t('Value')],
+                [EchartsFunnelLabelTypeType.Percent, t('Percentage')],
+                [EchartsFunnelLabelTypeType.KeyValue, t('Category and Value')],
                 [
                   EchartsFunnelLabelTypeType.KeyPercent,
-                  'Category and Percentage',
+                  t('Category and Percentage'),
                 ],
                 [
                   EchartsFunnelLabelTypeType.KeyValuePercent,
-                  'Category, Value and Percentage',
+                  t('Category, Value and Percentage'),
                 ],
               ],
               description: t('What should be shown on the label?'),
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx
index 619290a69626..6cbed6901bcd 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/MixedTimeseries/controlPanel.tsx
@@ -147,13 +147,13 @@ function createCustomizeSection(
           renderTrigger: true,
           default: seriesType,
           choices: [
-            [EchartsTimeseriesSeriesType.Line, 'Line'],
-            [EchartsTimeseriesSeriesType.Scatter, 'Scatter'],
-            [EchartsTimeseriesSeriesType.Smooth, 'Smooth Line'],
-            [EchartsTimeseriesSeriesType.Bar, 'Bar'],
-            [EchartsTimeseriesSeriesType.Start, 'Step - start'],
-            [EchartsTimeseriesSeriesType.Middle, 'Step - middle'],
-            [EchartsTimeseriesSeriesType.End, 'Step - end'],
+            [EchartsTimeseriesSeriesType.Line, t('Line')],
+            [EchartsTimeseriesSeriesType.Scatter, t('Scatter')],
+            [EchartsTimeseriesSeriesType.Smooth, t('Smooth Line')],
+            [EchartsTimeseriesSeriesType.Bar, t('Bar')],
+            [EchartsTimeseriesSeriesType.Start, t('Step - start')],
+            [EchartsTimeseriesSeriesType.Middle, t('Step - middle')],
+            [EchartsTimeseriesSeriesType.End, t('Step - end')],
           ],
           description: t('Series chart type (line, bar etc)'),
         },
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Pie/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Pie/controlPanel.tsx
index 1b73b95e7e7b..c9f0f79d19ec 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Pie/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Pie/controlPanel.tsx
@@ -101,12 +101,12 @@ const config: ControlPanelConfig = {
               default: labelType,
               renderTrigger: true,
               choices: [
-                ['key', 'Category Name'],
-                ['value', 'Value'],
-                ['percent', 'Percentage'],
-                ['key_value', 'Category and Value'],
-                ['key_percent', 'Category and Percentage'],
-                ['key_value_percent', 'Category, Value and Percentage'],
+                ['key', t('Category Name')],
+                ['value', t('Value')],
+                ['percent', t('Percentage')],
+                ['key_value', t('Category and Value')],
+                ['key_percent', t('Category and Percentage')],
+                ['key_value_percent', t('Category, Value and Percentage')],
               ],
               description: t('What should be shown on the label?'),
             },
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Radar/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Radar/controlPanel.tsx
index 4d03d07373d9..32659bb20f61 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Radar/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Radar/controlPanel.tsx
@@ -108,8 +108,8 @@ const config: ControlPanelConfig = {
               default: labelType,
               renderTrigger: true,
               choices: [
-                ['value', 'Value'],
-                ['key_value', 'Category and Value'],
+                ['value', t('Value')],
+                ['key_value', t('Category and Value')],
               ],
               description: t('What should be shown on the label?'),
             },
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Area/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Area/controlPanel.tsx
index 66bc2d0e79bc..2f52bcce5917 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Area/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Area/controlPanel.tsx
@@ -72,11 +72,11 @@ const config: ControlPanelConfig = {
               renderTrigger: true,
               default: seriesType,
               choices: [
-                [EchartsTimeseriesSeriesType.Line, 'Line'],
-                [EchartsTimeseriesSeriesType.Smooth, 'Smooth Line'],
-                [EchartsTimeseriesSeriesType.Start, 'Step - start'],
-                [EchartsTimeseriesSeriesType.Middle, 'Step - middle'],
-                [EchartsTimeseriesSeriesType.End, 'Step - end'],
+                [EchartsTimeseriesSeriesType.Line, t('Line')],
+                [EchartsTimeseriesSeriesType.Smooth, t('Smooth Line')],
+                [EchartsTimeseriesSeriesType.Start, t('Step - start')],
+                [EchartsTimeseriesSeriesType.Middle, t('Step - middle')],
+                [EchartsTimeseriesSeriesType.End, t('Step - end')],
               ],
               description: t('Series chart type (line, bar etc)'),
             },
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/controlPanel.tsx
index bb6284406415..3e1bb68f49d0 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Bar/controlPanel.tsx
@@ -126,8 +126,8 @@ function createAxisTitleControl(axis: 'x' | 'y'): ControlSetRow[] {
           clearable: false,
           label: t('AXIS TITLE POSITION'),
           renderTrigger: true,
-          default: sections.TITLE_POSITION_OPTIONS[0],
-          choices: formatSelectOptions(sections.TITLE_POSITION_OPTIONS),
+          default: sections.TITLE_POSITION_OPTIONS[0][0],
+          choices: sections.TITLE_POSITION_OPTIONS,
           description: t('Changing this control takes effect instantly'),
           visibility: ({ controls }: ControlPanelsContainerProps) =>
             isXAxis ? isHorizental(controls) : isVertical(controls),
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/controlPanel.tsx
index 1b7357eaaa18..0fe9f6b5ac87 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Regular/Line/controlPanel.tsx
@@ -71,13 +71,13 @@ const config: ControlPanelConfig = {
               renderTrigger: true,
               default: seriesType,
               choices: [
-                [EchartsTimeseriesSeriesType.Line, 'Line'],
-                [EchartsTimeseriesSeriesType.Scatter, 'Scatter'],
-                [EchartsTimeseriesSeriesType.Smooth, 'Smooth Line'],
-                [EchartsTimeseriesSeriesType.Bar, 'Bar'],
-                [EchartsTimeseriesSeriesType.Start, 'Step - start'],
-                [EchartsTimeseriesSeriesType.Middle, 'Step - middle'],
-                [EchartsTimeseriesSeriesType.End, 'Step - end'],
+                [EchartsTimeseriesSeriesType.Line, t('Line')],
+                [EchartsTimeseriesSeriesType.Scatter, t('Scatter')],
+                [EchartsTimeseriesSeriesType.Smooth, t('Smooth Line')],
+                [EchartsTimeseriesSeriesType.Bar, t('Bar')],
+                [EchartsTimeseriesSeriesType.Start, t('Step - start')],
+                [EchartsTimeseriesSeriesType.Middle, t('Step - middle')],
+                [EchartsTimeseriesSeriesType.End, t('Step - end')],
               ],
               description: t('Series chart type (line, bar etc)'),
             },
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Step/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Step/controlPanel.tsx
index 8001acc5220c..e71e47433526 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Step/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Timeseries/Step/controlPanel.tsx
@@ -70,9 +70,9 @@ const config: ControlPanelConfig = {
               renderTrigger: true,
               default: EchartsTimeseriesSeriesType.Start,
               choices: [
-                [EchartsTimeseriesSeriesType.Start, 'Start'],
-                [EchartsTimeseriesSeriesType.Middle, 'Middle'],
-                [EchartsTimeseriesSeriesType.End, 'End'],
+                [EchartsTimeseriesSeriesType.Start, t('Start')],
+                [EchartsTimeseriesSeriesType.Middle, t('Middle')],
+                [EchartsTimeseriesSeriesType.End, t('End')],
               ],
               description: t(
                 'Defines whether the step should appear at the beginning, middle or end between two data points',
diff --git a/superset-frontend/plugins/plugin-chart-echarts/src/Treemap/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-echarts/src/Treemap/controlPanel.tsx
index 2b816b3f25bc..befdce1b10dd 100644
--- a/superset-frontend/plugins/plugin-chart-echarts/src/Treemap/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-echarts/src/Treemap/controlPanel.tsx
@@ -97,9 +97,9 @@ const config: ControlPanelConfig = {
               default: labelType,
               renderTrigger: true,
               choices: [
-                ['Key', 'Key'],
-                ['value', 'Value'],
-                ['key_value', 'Category and Value'],
+                ['Key', t('Key')],
+                ['value', t('Value')],
+                ['key_value', t('Category and Value')],
               ],
               description: t('What should be shown on the label?'),
             },
diff --git a/superset-frontend/plugins/plugin-chart-handlebars/src/components/Handlebars/HandlebarsViewer.tsx b/superset-frontend/plugins/plugin-chart-handlebars/src/components/Handlebars/HandlebarsViewer.tsx
index 479da8ac91b6..371b4f48f91a 100644
--- a/superset-frontend/plugins/plugin-chart-handlebars/src/components/Handlebars/HandlebarsViewer.tsx
+++ b/superset-frontend/plugins/plugin-chart-handlebars/src/components/Handlebars/HandlebarsViewer.tsx
@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { SafeMarkdown, styled } from '@superset-ui/core';
+import { SafeMarkdown, styled, t } from '@superset-ui/core';
 import Handlebars from 'handlebars';
 import moment from 'moment';
 import React, { useMemo, useState } from 'react';
@@ -71,7 +71,7 @@ export const HandlebarsViewer = ({
       />
     );
   }
-  return <p>Loading...</p>;
+  return <p>{t('Loading...')}</p>;
 };
 
 //  usage: {{dateFormat my_date format="MMMM YYYY"}}
diff --git a/superset-frontend/plugins/plugin-chart-pivot-table/src/plugin/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-pivot-table/src/plugin/controlPanel.tsx
index a577fb6058d8..28d6361507fd 100644
--- a/superset-frontend/plugins/plugin-chart-pivot-table/src/plugin/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-pivot-table/src/plugin/controlPanel.tsx
@@ -30,7 +30,6 @@ import {
 import {
   ControlPanelConfig,
   D3_TIME_FORMAT_OPTIONS,
-  formatSelectOptions,
   sections,
   sharedControls,
   emitFilterControl,
@@ -178,26 +177,29 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Aggregation function'),
               clearable: false,
-              choices: formatSelectOptions([
-                'Count',
-                'Count Unique Values',
-                'List Unique Values',
-                'Sum',
-                'Average',
-                'Median',
-                'Sample Variance',
-                'Sample Standard Deviation',
-                'Minimum',
-                'Maximum',
-                'First',
-                'Last',
-                'Sum as Fraction of Total',
-                'Sum as Fraction of Rows',
-                'Sum as Fraction of Columns',
-                'Count as Fraction of Total',
-                'Count as Fraction of Rows',
-                'Count as Fraction of Columns',
-              ]),
+              choices: [
+                ['Count', t('Count')],
+                ['Count Unique Values', t('Count Unique Values')],
+                ['List Unique Values', t('List Unique Values')],
+                ['Sum', t('Sum')],
+                ['Average', t('Average')],
+                ['Median', t('Median')],
+                ['Sample Variance', t('Sample Variance')],
+                ['Sample Standard Deviation', t('Sample Standard Deviation')],
+                ['Minimum', t('Minimum')],
+                ['Maximum', t('Maximum')],
+                ['First', t('First')],
+                ['Last', t('Last')],
+                ['Sum as Fraction of Total', t('Sum as Fraction of Total')],
+                ['Sum as Fraction of Rows', t('Sum as Fraction of Rows')],
+                ['Sum as Fraction of Columns', t('Sum as Fraction of Columns')],
+                ['Count as Fraction of Total', t('Count as Fraction of Total')],
+                ['Count as Fraction of Rows', t('Count as Fraction of Rows')],
+                [
+                  'Count as Fraction of Columns',
+                  t('Count as Fraction of Columns'),
+                ],
+              ],
               default: 'Sum',
               description: t(
                 'Aggregate function to apply when pivoting and computing the total rows and columns',
diff --git a/superset-frontend/plugins/plugin-chart-pivot-table/src/react-pivottable/TableRenderers.jsx b/superset-frontend/plugins/plugin-chart-pivot-table/src/react-pivottable/TableRenderers.jsx
index ea036e99e296..ebfc4a253664 100644
--- a/superset-frontend/plugins/plugin-chart-pivot-table/src/react-pivottable/TableRenderers.jsx
+++ b/superset-frontend/plugins/plugin-chart-pivot-table/src/react-pivottable/TableRenderers.jsx
@@ -18,6 +18,7 @@
  */
 
 import React from 'react';
+import { t } from '@superset-ui/core';
 import PropTypes from 'prop-types';
 import { PivotData, flatKey } from './utilities';
 import { Styles } from './Styles';
@@ -462,7 +463,7 @@ export class TableRenderer extends React.Component {
               true,
             )}
           >
-            Subtotal
+            {t('Subtotal')}
           </th>,
         );
       }
@@ -658,7 +659,7 @@ export class TableRenderer extends React.Component {
             true,
           )}
         >
-          Subtotal
+          {t('Subtotal')}
         </th>
       ) : null;
 
@@ -763,7 +764,10 @@ export class TableRenderer extends React.Component {
           true,
         )}
       >
-        {`Total (${this.props.aggregatorName})`}
+        {
+          // eslint-disable-next-line prefer-template
+          t('Total') + ` (${this.props.aggregatorName})`
+        }
       </th>
     );
 
diff --git a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
index 067da5963010..af490395f369 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
+++ b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
@@ -513,7 +513,7 @@ export default function TableChart<D extends DataRecord = DataRecord>(
         },
         Header: ({ column: col, onClick, style, onDragStart, onDrop }) => (
           <th
-            title="Shift + Click to sort by multiple columns"
+            title={t('Shift + Click to sort by multiple columns')}
             className={[className, col.isSorted ? 'is-sorted' : ''].join(' ')}
             style={{
               ...sharedStyle,
diff --git a/superset-frontend/plugins/plugin-chart-word-cloud/src/plugin/controlPanel.ts b/superset-frontend/plugins/plugin-chart-word-cloud/src/plugin/controlPanel.ts
index a6c4f75ed17c..f40a9c19af5a 100644
--- a/superset-frontend/plugins/plugin-chart-word-cloud/src/plugin/controlPanel.ts
+++ b/superset-frontend/plugins/plugin-chart-word-cloud/src/plugin/controlPanel.ts
@@ -83,9 +83,9 @@ const config: ControlPanelConfig = {
               type: 'SelectControl',
               label: t('Word Rotation'),
               choices: [
-                ['random', 'random'],
-                ['flat', 'flat'],
-                ['square', 'square'],
+                ['random', t('random')],
+                ['flat', t('flat')],
+                ['square', t('square')],
               ],
               renderTrigger: true,
               default: 'square',
diff --git a/superset-frontend/plugins/preset-chart-xy/src/BoxPlot/controlPanel.ts b/superset-frontend/plugins/preset-chart-xy/src/BoxPlot/controlPanel.ts
index 6d98bf19e581..10587b382f97 100644
--- a/superset-frontend/plugins/preset-chart-xy/src/BoxPlot/controlPanel.ts
+++ b/superset-frontend/plugins/preset-chart-xy/src/BoxPlot/controlPanel.ts
@@ -17,11 +17,7 @@
  * under the License.
  */
 import { t } from '@superset-ui/core';
-import {
-  ControlPanelConfig,
-  formatSelectOptions,
-  sections,
-} from '@superset-ui/chart-controls';
+import { ControlPanelConfig, sections } from '@superset-ui/chart-controls';
 
 const config: ControlPanelConfig = {
   controlPanelSections: [
@@ -47,12 +43,12 @@ const config: ControlPanelConfig = {
               description: t(
                 'Determines how whiskers and outliers are calculated.',
               ),
-              choices: formatSelectOptions([
-                'Tukey',
-                'Min/max (no outliers)',
-                '2/98 percentiles',
-                '9/91 percentiles',
-              ]),
+              choices: [
+                ['Tukey', t('Tukey')],
+                ['Min/max (no outliers)', t('Min/max (no outliers)')],
+                ['2/98 percentiles', t('2/98 percentiles')],
+                ['9/91 percentiles', t('9/91 percentiles')],
+              ],
             },
           },
           {
@@ -60,12 +56,12 @@ const config: ControlPanelConfig = {
             config: {
               type: 'SelectControl',
               label: t('X Tick Layout'),
-              choices: formatSelectOptions([
-                'auto',
-                'flat',
-                '45°',
-                'staggered',
-              ]),
+              choices: [
+                ['auto', t('auto')],
+                ['flat', t('flat')],
+                ['45°', '45°'],
+                ['staggered', t('staggered')],
+              ],
               default: 'auto',
               clearable: false,
               renderTrigger: true,
diff --git a/superset-frontend/src/SqlLab/components/ColumnElement/index.tsx b/superset-frontend/src/SqlLab/components/ColumnElement/index.tsx
index 481c1067f13f..2b341b0bd17e 100644
--- a/superset-frontend/src/SqlLab/components/ColumnElement/index.tsx
+++ b/superset-frontend/src/SqlLab/components/ColumnElement/index.tsx
@@ -18,7 +18,7 @@
  */
 import React from 'react';
 import { ClassNames } from '@emotion/react';
-import { styled, useTheme } from '@superset-ui/core';
+import { styled, useTheme, t } from '@superset-ui/core';
 import { Tooltip } from 'src/components/Tooltip';
 
 const StyledTooltip = (props: any) => {
@@ -60,9 +60,9 @@ const iconMap = {
 };
 
 const tooltipTitleMap = {
-  pk: 'Primary key',
-  fk: 'Foreign key',
-  index: 'Index',
+  pk: t('Primary key'),
+  fk: t('Foreign key'),
+  index: t('Index'),
 };
 
 export type ColumnKeyTypeType = keyof typeof tooltipTitleMap;
diff --git a/superset-frontend/src/SqlLab/components/ExploreCtasResultsButton/index.tsx b/superset-frontend/src/SqlLab/components/ExploreCtasResultsButton/index.tsx
index ac9e8b2fb453..2fe1e14a0785 100644
--- a/superset-frontend/src/SqlLab/components/ExploreCtasResultsButton/index.tsx
+++ b/superset-frontend/src/SqlLab/components/ExploreCtasResultsButton/index.tsx
@@ -86,7 +86,7 @@ const ExploreCtasResultsButton = ({
       <InfoTooltipWithTrigger
         icon="line-chart"
         placement="top"
-        label="explore"
+        label={t('explore')}
       />{' '}
       {t('Explore')}
     </Button>
diff --git a/superset-frontend/src/SqlLab/components/ExploreResultsButton/index.tsx b/superset-frontend/src/SqlLab/components/ExploreResultsButton/index.tsx
index 4ab77777367f..b3ee748218e6 100644
--- a/superset-frontend/src/SqlLab/components/ExploreResultsButton/index.tsx
+++ b/superset-frontend/src/SqlLab/components/ExploreResultsButton/index.tsx
@@ -44,7 +44,7 @@ const ExploreResultsButton = ({
       <InfoTooltipWithTrigger
         icon="line-chart"
         placement="top"
-        label="explore"
+        label={t('explore')}
       />{' '}
       {t('Create Chart')}
     </Button>
diff --git a/superset-frontend/src/SqlLab/components/QueryLimitSelect/index.tsx b/superset-frontend/src/SqlLab/components/QueryLimitSelect/index.tsx
index 9b45e4b39718..44e180bb274a 100644
--- a/superset-frontend/src/SqlLab/components/QueryLimitSelect/index.tsx
+++ b/superset-frontend/src/SqlLab/components/QueryLimitSelect/index.tsx
@@ -18,8 +18,7 @@
  */
 import React from 'react';
 import { useDispatch } from 'react-redux';
-import { styled, useTheme } from '@superset-ui/core';
-
+import { styled, useTheme, t } from '@superset-ui/core';
 import { AntdDropdown } from 'src/components';
 import { Menu } from 'src/components/Menu';
 import Icons from 'src/components/Icons';
@@ -99,7 +98,7 @@ const QueryLimitSelect = ({
         trigger={['click']}
       >
         <button type="button" onClick={e => e.preventDefault()}>
-          <span>LIMIT:</span>
+          <span>{t('LIMIT')}:</span>
           <span className="limitDropdown">
             {convertToNumWithSpaces(queryLimit)}
           </span>
diff --git a/superset-frontend/src/SqlLab/components/SaveDatasetModal/index.tsx b/superset-frontend/src/SqlLab/components/SaveDatasetModal/index.tsx
index 10c1aaf41483..949323b9aa75 100644
--- a/superset-frontend/src/SqlLab/components/SaveDatasetModal/index.tsx
+++ b/superset-frontend/src/SqlLab/components/SaveDatasetModal/index.tsx
@@ -363,7 +363,7 @@ export const SaveDatasetModal = ({
           {newOrOverwrite === DatasetRadioState.OVERWRITE_DATASET && (
             <>
               {shouldOverwriteDataset && (
-                <Button onClick={handleOverwriteCancel}>Back</Button>
+                <Button onClick={handleOverwriteCancel}>{t('Back')}</Button>
               )}
               <Button
                 className="md"
diff --git a/superset-frontend/src/SqlLab/components/ScheduleQueryButton/index.tsx b/superset-frontend/src/SqlLab/components/ScheduleQueryButton/index.tsx
index c78e2bd32d0b..d0a381638d9a 100644
--- a/superset-frontend/src/SqlLab/components/ScheduleQueryButton/index.tsx
+++ b/superset-frontend/src/SqlLab/components/ScheduleQueryButton/index.tsx
@@ -206,7 +206,7 @@ const ScheduleQueryButton: FunctionComponent<ScheduleQueryButtonProps> = ({
                 htmlType="submit"
                 css={{ float: 'right' }}
               >
-                Submit
+                {t('Submit')}
               </Button>
             </SchemaForm>
           </StyledJsonSchema>
diff --git a/superset-frontend/src/SqlLab/components/TemplateParamsEditor/index.tsx b/superset-frontend/src/SqlLab/components/TemplateParamsEditor/index.tsx
index 8943c2b8d5d4..a862fd326aac 100644
--- a/superset-frontend/src/SqlLab/components/TemplateParamsEditor/index.tsx
+++ b/superset-frontend/src/SqlLab/components/TemplateParamsEditor/index.tsx
@@ -64,20 +64,20 @@ const TemplateParamsEditor = ({
   const modalBody = (
     <div>
       <p>
-        Assign a set of parameters as
+        {t('Assign a set of parameters as')}
         <code>JSON</code>
-        below (example:
+        {t('below (example:')}
         <code>{'{"my_table": "foo"}'}</code>
-        ), and they become available in your SQL (example:
-        <code>SELECT * FROM {'{{ my_table }}'} </code>) by using&nbsp;
+        {t('), and they become available in your SQL (example:')}
+        <code>SELECT * FROM {'{{ my_table }}'} </code>) {t('by using')}&nbsp;
         <a
           href="https://superset.apache.org/sqllab.html#templating-with-jinja"
           target="_blank"
           rel="noopener noreferrer"
         >
-          Jinja templating
+          {t('Jinja templating')}
         </a>{' '}
-        syntax.
+        {t('syntax.')}
       </p>
       <StyledConfigEditor
         mode={language}
diff --git a/superset-frontend/src/components/AlteredSliceTag/index.jsx b/superset-frontend/src/components/AlteredSliceTag/index.jsx
index dd5dfb3c8786..5c9b04949bb8 100644
--- a/superset-frontend/src/components/AlteredSliceTag/index.jsx
+++ b/superset-frontend/src/components/AlteredSliceTag/index.jsx
@@ -171,15 +171,15 @@ export default class AlteredSliceTag extends React.Component {
     const columns = [
       {
         accessor: 'control',
-        Header: 'Control',
+        Header: t('Control'),
       },
       {
         accessor: 'before',
-        Header: 'Before',
+        Header: t('Before'),
       },
       {
         accessor: 'after',
-        Header: 'After',
+        Header: t('After'),
       },
     ];
     // set the wrap text in the specific columns.
diff --git a/superset-frontend/src/components/CopyToClipboard/index.jsx b/superset-frontend/src/components/CopyToClipboard/index.jsx
index 95b6cdfdc0f7..d4f74904dbca 100644
--- a/superset-frontend/src/components/CopyToClipboard/index.jsx
+++ b/superset-frontend/src/components/CopyToClipboard/index.jsx
@@ -37,7 +37,7 @@ const propTypes = {
 };
 
 const defaultProps = {
-  copyNode: <span>Copy</span>,
+  copyNode: <span>{t('Copy')}</span>,
   onCopyEnd: () => {},
   shouldShowText: true,
   wrapped: true,
diff --git a/superset-frontend/src/components/Datasource/ChangeDatasourceModal.tsx b/superset-frontend/src/components/Datasource/ChangeDatasourceModal.tsx
index fc31c0ec7c51..9875a3c1f7c3 100644
--- a/superset-frontend/src/components/Datasource/ChangeDatasourceModal.tsx
+++ b/superset-frontend/src/components/Datasource/ChangeDatasourceModal.tsx
@@ -260,13 +260,13 @@ const ChangeDatasourceModal: FunctionComponent<ChangeDatasourceModalProps> = ({
           {confirmChange && (
             <ConfirmModalStyled>
               <div className="btn-container">
-                <Button onClick={handlerCancelConfirm}>Cancel</Button>
+                <Button onClick={handlerCancelConfirm}>{t('Cancel')}</Button>
                 <Button
                   className="proceed-btn"
                   buttonStyle="primary"
                   onClick={handleChangeConfirm}
                 >
-                  Proceed
+                  {t('Proceed')}
                 </Button>
               </div>
             </ConfirmModalStyled>
diff --git a/superset-frontend/src/components/Datasource/DatasourceEditor.jsx b/superset-frontend/src/components/Datasource/DatasourceEditor.jsx
index c5a21f65e4cb..4a484f12569b 100644
--- a/superset-frontend/src/components/Datasource/DatasourceEditor.jsx
+++ b/superset-frontend/src/components/Datasource/DatasourceEditor.jsx
@@ -134,10 +134,10 @@ const checkboxGenerator = (d, onChange) => (
   <CheckboxControl value={d} onChange={onChange} />
 );
 const DATA_TYPES = [
-  { value: 'STRING', label: 'STRING' },
-  { value: 'NUMERIC', label: 'NUMERIC' },
-  { value: 'DATETIME', label: 'DATETIME' },
-  { value: 'BOOLEAN', label: 'BOOLEAN' },
+  { value: 'STRING', label: t('STRING') },
+  { value: 'NUMERIC', label: t('NUMERIC') },
+  { value: 'DATETIME', label: t('DATETIME') },
+  { value: 'BOOLEAN', label: t('BOOLEAN') },
 ];
 
 const DATASOURCE_TYPES_ARR = [
diff --git a/superset-frontend/src/components/Form/LabeledErrorBoundInput.tsx b/superset-frontend/src/components/Form/LabeledErrorBoundInput.tsx
index 0e6dcc626fec..a99f5f89c814 100644
--- a/superset-frontend/src/components/Form/LabeledErrorBoundInput.tsx
+++ b/superset-frontend/src/components/Form/LabeledErrorBoundInput.tsx
@@ -19,7 +19,7 @@
 import React from 'react';
 import { Input, Tooltip } from 'antd';
 import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons';
-import { styled, css, SupersetTheme } from '@superset-ui/core';
+import { styled, css, SupersetTheme, t } from '@superset-ui/core';
 import InfoTooltip from 'src/components/InfoTooltip';
 import errorIcon from 'src/assets/images/icons/error.svg';
 import FormItem from './FormItem';
@@ -127,11 +127,11 @@ const LabeledErrorBoundInput = ({
           {...validationMethods}
           iconRender={visible =>
             visible ? (
-              <Tooltip title="Hide password.">
+              <Tooltip title={t('Hide password.')}>
                 <EyeInvisibleOutlined />
               </Tooltip>
             ) : (
-              <Tooltip title="Show password.">
+              <Tooltip title={t('Show password.')}>
                 <EyeOutlined />
               </Tooltip>
             )
diff --git a/superset-frontend/src/components/ImportModal/index.tsx b/superset-frontend/src/components/ImportModal/index.tsx
index 6a980f7d2013..4e8ec1139657 100644
--- a/superset-frontend/src/components/ImportModal/index.tsx
+++ b/superset-frontend/src/components/ImportModal/index.tsx
@@ -216,7 +216,7 @@ const ImportModelsModal: FunctionComponent<ImportModelsModalProps> = ({
 
     return (
       <>
-        <h5>Database passwords</h5>
+        <h5>{t('Database passwords')}</h5>
         <HelperMessage>{passwordsNeededMessage}</HelperMessage>
         {passwordFields.map(fileName => (
           <StyledInputContainer key={`password-for-${fileName}`}>
@@ -297,7 +297,7 @@ const ImportModelsModal: FunctionComponent<ImportModelsModalProps> = ({
           customRequest={() => {}}
           disabled={importingModel}
         >
-          <Button loading={importingModel}>Select file</Button>
+          <Button loading={importingModel}>{t('Select file')}</Button>
         </Upload>
       </StyledInputContainer>
       {errorMessage && (
diff --git a/superset-frontend/src/components/ReportModal/index.tsx b/superset-frontend/src/components/ReportModal/index.tsx
index 632f9f91ec42..9f9596e2ffcf 100644
--- a/superset-frontend/src/components/ReportModal/index.tsx
+++ b/superset-frontend/src/components/ReportModal/index.tsx
@@ -273,7 +273,7 @@ function ReportModal({
             onChange: ({ target }: { target: HTMLInputElement }) =>
               setCurrentReport({ name: target.value }),
           }}
-          label="Report Name"
+          label={t('Report Name')}
           data-test="report-name-test"
         />
         <LabeledErrorBoundInput
diff --git a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
index ab14c4d93205..acea440f2f3f 100644
--- a/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
+++ b/superset-frontend/src/dashboard/components/DashboardBuilder/DashboardBuilder.tsx
@@ -399,7 +399,7 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
             menuItems={[
               <IconButton
                 icon={<Icons.FallOutlined iconSize="xl" />}
-                label="Collapse tab content"
+                label={t('Collapse tab content')}
                 onClick={handleDeleteTopLevelTabs}
               />,
             ]}
diff --git a/superset-frontend/src/dashboard/components/DashboardEmbedControls.tsx b/superset-frontend/src/dashboard/components/DashboardEmbedControls.tsx
index 6d28b7fd9046..8d7702edd4d3 100644
--- a/superset-frontend/src/dashboard/components/DashboardEmbedControls.tsx
+++ b/superset-frontend/src/dashboard/components/DashboardEmbedControls.tsx
@@ -187,7 +187,7 @@ export const DashboardEmbedControls = ({ dashboardId, onHide }: Props) => {
             : t('Superset Embedded SDK documentation.')}
         </a>
       </p>
-      <h3>Settings</h3>
+      <h3>{t('Settings')}</h3>
       <FormItem>
         <label htmlFor="allowed-domains">
           {t('Allowed Domains (comma separated)')}{' '}
diff --git a/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx b/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx
index 2588ce59100e..43ed8906906e 100644
--- a/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx
+++ b/superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx
@@ -224,9 +224,12 @@ export class Tabs extends React.PureComponent {
       title: t('Delete dashboard tab?'),
       content: (
         <span>
-          Deleting a tab will remove all content within it. You may still
-          reverse this action with the <b>undo</b> button (cmd + z) until you
-          save your changes.
+          {t(
+            'Deleting a tab will remove all content within it. You may still ' +
+              'reverse this action with the',
+          )}{' '}
+          <b>{t('undo')}</b>{' '}
+          {t('button (cmd + z) until you save your changes.')}
         </span>
       ),
       onOk: () => {
@@ -235,8 +238,8 @@ export class Tabs extends React.PureComponent {
         this.handleDeleteTab(tabIndex);
       },
       okType: 'danger',
-      okText: 'DELETE',
-      cancelText: 'CANCEL',
+      okText: t('DELETE'),
+      cancelText: t('CANCEL'),
       icon: null,
     });
   };
diff --git a/superset-frontend/src/dashboard/components/gridComponents/new/NewMarkdown.jsx b/superset-frontend/src/dashboard/components/gridComponents/new/NewMarkdown.jsx
index 236b52f3b2a5..3cc3138667b8 100644
--- a/superset-frontend/src/dashboard/components/gridComponents/new/NewMarkdown.jsx
+++ b/superset-frontend/src/dashboard/components/gridComponents/new/NewMarkdown.jsx
@@ -17,6 +17,7 @@
  * under the License.
  */
 import React from 'react';
+import { t } from '@superset-ui/core';
 
 import { MARKDOWN_TYPE } from '../../../util/componentTypes';
 import { NEW_MARKDOWN_ID } from '../../../util/constants';
@@ -27,7 +28,7 @@ export default function DraggableNewDivider() {
     <DraggableNewComponent
       id={NEW_MARKDOWN_ID}
       type={MARKDOWN_TYPE}
-      label="Text"
+      label={t('Text')}
       className="fa fa-font"
     />
   );
diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/FilterTitlePane.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/FilterTitlePane.tsx
index 79dc4148349a..a080d3564513 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/FilterTitlePane.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/FilterTitlePane.tsx
@@ -53,8 +53,8 @@ const TabsContainer = styled.div`
 `;
 
 const options = [
-  { label: 'Filter', type: NativeFilterType.NATIVE_FILTER },
-  { label: 'Divider', type: NativeFilterType.DIVIDER },
+  { label: t('Filter'), type: NativeFilterType.NATIVE_FILTER },
+  { label: t('Divider'), type: NativeFilterType.DIVIDER },
 ];
 
 const FilterTitlePane: React.FC<Props> = ({
diff --git a/superset-frontend/src/explore/components/controls/AnnotationLayerControl/AnnotationLayer.jsx b/superset-frontend/src/explore/components/controls/AnnotationLayerControl/AnnotationLayer.jsx
index 42ca4bb3590b..8f9bec53bb98 100644
--- a/superset-frontend/src/explore/components/controls/AnnotationLayerControl/AnnotationLayer.jsx
+++ b/superset-frontend/src/explore/components/controls/AnnotationLayerControl/AnnotationLayer.jsx
@@ -543,7 +543,7 @@ class AnnotationLayer extends React.PureComponent {
               name="annotation-layer-title"
               label={t('Title Column')}
               description={t('Pick a title for you annotation.')}
-              options={[{ value: '', label: 'None' }].concat(columns)}
+              options={[{ value: '', label: t('None') }].concat(columns)}
               value={titleColumn}
               onChange={value => this.setState({ titleColumn: value })}
             />
@@ -566,9 +566,9 @@ class AnnotationLayer extends React.PureComponent {
               <CheckboxControl
                 hovered
                 name="annotation-override-time_range"
-                label="Override time range"
-                description={`This controls whether the "time_range" field from the current
-                  view should be passed down to the chart containing the annotation data.`}
+                label={t('Override time range')}
+                description={t(`This controls whether the "time_range" field from the current
+                  view should be passed down to the chart containing the annotation data.`)}
                 value={'time_range' in overrides}
                 onChange={v => {
                   delete overrides.time_range;
@@ -584,9 +584,9 @@ class AnnotationLayer extends React.PureComponent {
               <CheckboxControl
                 hovered
                 name="annotation-override-timegrain"
-                label="Override time grain"
-                description={`This controls whether the time grain field from the current
-                  view should be passed down to the chart containing the annotation data.`}
+                label={t('Override time grain')}
+                description={t(`This controls whether the time grain field from the current
+                  view should be passed down to the chart containing the annotation data.`)}
                 value={'time_grain_sqla' in overrides}
                 onChange={v => {
                   delete overrides.time_grain_sqla;
@@ -607,9 +607,9 @@ class AnnotationLayer extends React.PureComponent {
               <TextControl
                 hovered
                 name="annotation-layer-timeshift"
-                label="Time Shift"
-                description={`Time delta in natural language
-                  (example:  24 hours, 7 days, 56 weeks, 365 days)`}
+                label={t('Time Shift')}
+                description={t(`Time delta in natural language
+                  (example:  24 hours, 7 days, 56 weeks, 365 days)`)}
                 placeholder=""
                 value={overrides.time_shift}
                 onChange={v =>
@@ -708,8 +708,8 @@ class AnnotationLayer extends React.PureComponent {
           <CheckboxControl
             hovered
             name="annotation-layer-show-markers"
-            label="Show Markers"
-            description="Shows or hides markers for the time series"
+            label={t('Show Markers')}
+            description={t('Shows or hides markers for the time series')}
             value={showMarkers}
             onChange={v => this.setState({ showMarkers: v })}
           />
@@ -718,8 +718,8 @@ class AnnotationLayer extends React.PureComponent {
           <CheckboxControl
             hovered
             name="annotation-layer-hide-line"
-            label="Hide Line"
-            description="Hides the Line for the time series"
+            label={t('Hide Line')}
+            description={t('Hides the Line for the time series')}
             value={hideLine}
             onChange={v => this.setState({ hideLine: v })}
           />
diff --git a/superset-frontend/src/explore/components/controls/ColorSchemeControl/index.tsx b/superset-frontend/src/explore/components/controls/ColorSchemeControl/index.tsx
index df98839d2b8a..768db89db0d7 100644
--- a/superset-frontend/src/explore/components/controls/ColorSchemeControl/index.tsx
+++ b/superset-frontend/src/explore/components/controls/ColorSchemeControl/index.tsx
@@ -112,7 +112,7 @@ const ColorSchemeControl = ({
       return [
         {
           value: 'dashboard',
-          label: 'dashboard',
+          label: t('dashboard'),
           customLabel: (
             <Tooltip title={DASHBOARD_ALERT}>{t('Dashboard scheme')}</Tooltip>
           ),
diff --git a/superset-frontend/src/explore/components/controls/FixedOrMetricControl/index.jsx b/superset-frontend/src/explore/components/controls/FixedOrMetricControl/index.jsx
index 545065319b77..2652c30f9e13 100644
--- a/superset-frontend/src/explore/components/controls/FixedOrMetricControl/index.jsx
+++ b/superset-frontend/src/explore/components/controls/FixedOrMetricControl/index.jsx
@@ -133,7 +133,7 @@ export default class FixedOrMetricControl extends React.Component {
                 )}
                 {this.state.type === controlTypes.metric && (
                   <span>
-                    <span>metric: </span>
+                    <span>{t('metric')}: </span>
                     <strong>
                       {this.state.metricValue
                         ? this.state.metricValue.label
diff --git a/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopoverTitle.tsx b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopoverTitle.tsx
index da6a2739c387..5bc8e530fb2e 100644
--- a/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopoverTitle.tsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopoverTitle.tsx
@@ -102,7 +102,7 @@ const AdhocMetricEditPopoverTitle: React.FC<AdhocMetricEditPopoverTitleProps> =
     }
 
     return (
-      <Tooltip placement="top" title="Click to edit label">
+      <Tooltip placement="top" title={t('Click to edit label')}>
         <span
           className="AdhocMetricEditPopoverTitle inline-editable"
           data-test="AdhocMetricEditTitle#trigger"
diff --git a/superset-frontend/src/explore/components/controls/SpatialControl.jsx b/superset-frontend/src/explore/components/controls/SpatialControl.jsx
index 77c8279de084..9528e665363d 100644
--- a/superset-frontend/src/explore/components/controls/SpatialControl.jsx
+++ b/superset-frontend/src/explore/components/controls/SpatialControl.jsx
@@ -171,11 +171,11 @@ export default class SpatialControl extends React.Component {
         >
           <Row gutter={16}>
             <Col xs={24} md={12}>
-              Longitude
+              {t('Longitude')}
               {this.renderSelect('lonCol', spatialTypes.latlong)}
             </Col>
             <Col xs={24} md={12}>
-              Latitude
+              {t('Latitude')}
               {this.renderSelect('latCol', spatialTypes.latlong)}
             </Col>
           </Row>
@@ -206,7 +206,7 @@ export default class SpatialControl extends React.Component {
         >
           <Row gutter={16}>
             <Col xs={24} md={12}>
-              Column
+              {t('Column')}
               {this.renderSelect('geohashCol', spatialTypes.geohash)}
             </Col>
             <Col xs={24} md={12}>
diff --git a/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx b/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx
index 5070c9a5956d..29ac223cf3e0 100644
--- a/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx
+++ b/superset-frontend/src/explore/components/controls/TimeSeriesColumnControl/index.jsx
@@ -61,17 +61,17 @@ const defaultProps = {
 };
 
 const comparisonTypeOptions = [
-  { value: 'value', label: 'Actual value', key: 'value' },
-  { value: 'diff', label: 'Difference', key: 'diff' },
-  { value: 'perc', label: 'Percentage', key: 'perc' },
-  { value: 'perc_change', label: 'Percentage change', key: 'perc_change' },
+  { value: 'value', label: t('Actual value'), key: 'value' },
+  { value: 'diff', label: t('Difference'), key: 'diff' },
+  { value: 'perc', label: t('Percentage'), key: 'perc' },
+  { value: 'perc_change', label: t('Percentage change'), key: 'perc_change' },
 ];
 
 const colTypeOptions = [
-  { value: 'time', label: 'Time comparison', key: 'time' },
-  { value: 'contrib', label: 'Contribution', key: 'contrib' },
-  { value: 'spark', label: 'Sparkline', key: 'spark' },
-  { value: 'avg', label: 'Period average', key: 'avg' },
+  { value: 'time', label: t('Time comparison'), key: 'time' },
+  { value: 'contrib', label: t('Contribution'), key: 'contrib' },
+  { value: 'spark', label: t('Sparkline'), key: 'spark' },
+  { value: 'avg', label: t('Period average'), key: 'avg' },
 ];
 
 const StyledRow = styled(Row)`
@@ -192,28 +192,28 @@ export default class TimeSeriesColumnControl extends React.Component {
     return (
       <div id="ts-col-popo" style={{ width: 320 }}>
         {this.formRow(
-          'Label',
-          'The column header label',
+          t('Label'),
+          t('The column header label'),
           'time-lag',
           <Input
             value={this.state.label}
             onChange={this.onTextInputChange.bind(this, 'label')}
-            placeholder="Label"
+            placeholder={t('Label')}
           />,
         )}
         {this.formRow(
-          'Tooltip',
-          'Column header tooltip',
+          t('Tooltip'),
+          t('Column header tooltip'),
           'col-tooltip',
           <Input
             value={this.state.tooltip}
             onChange={this.onTextInputChange.bind(this, 'tooltip')}
-            placeholder="Tooltip"
+            placeholder={t('Tooltip')}
           />,
         )}
         {this.formRow(
-          'Type',
-          'Type of comparison, value difference or percentage',
+          t('Type'),
+          t('Type of comparison, value difference or percentage'),
           'col-type',
           <Select
             ariaLabel={t('Type')}
@@ -225,52 +225,52 @@ export default class TimeSeriesColumnControl extends React.Component {
         <hr />
         {this.state.colType === 'spark' &&
           this.formRow(
-            'Width',
-            'Width of the sparkline',
+            t('Width'),
+            t('Width of the sparkline'),
             'spark-width',
             <Input
               value={this.state.width}
               onChange={this.onTextInputChange.bind(this, 'width')}
-              placeholder="Width"
+              placeholder={t('Width')}
             />,
           )}
         {this.state.colType === 'spark' &&
           this.formRow(
-            'Height',
-            'Height of the sparkline',
+            t('Height'),
+            t('Height of the sparkline'),
             'spark-width',
             <Input
               value={this.state.height}
               onChange={this.onTextInputChange.bind(this, 'height')}
-              placeholder="Height"
+              placeholder={t('Height')}
             />,
           )}
         {['time', 'avg'].indexOf(this.state.colType) >= 0 &&
           this.formRow(
-            'Time lag',
-            'Number of periods to compare against',
+            t('Time lag'),
+            t('Number of periods to compare against'),
             'time-lag',
             <Input
               value={this.state.timeLag}
               onChange={this.onTextInputChange.bind(this, 'timeLag')}
-              placeholder="Time Lag"
+              placeholder={t('Time Lag')}
             />,
           )}
         {['spark'].indexOf(this.state.colType) >= 0 &&
           this.formRow(
-            'Time ratio',
-            'Number of periods to ratio against',
+            t('Time ratio'),
+            t('Number of periods to ratio against'),
             'time-ratio',
             <Input
               value={this.state.timeRatio}
               onChange={this.onTextInputChange.bind(this, 'timeRatio')}
-              placeholder="Time Ratio"
+              placeholder={t('Time Ratio')}
             />,
           )}
         {this.state.colType === 'time' &&
           this.formRow(
-            'Type',
-            'Type of comparison, value difference or percentage',
+            t('Type'),
+            t('Type of comparison, value difference or percentage'),
             'comp-type',
             <Select
               ariaLabel={t('Type')}
@@ -281,8 +281,10 @@ export default class TimeSeriesColumnControl extends React.Component {
           )}
         {this.state.colType === 'spark' &&
           this.formRow(
-            'Show Y-axis',
-            'Show Y-axis on the sparkline. Will display the manually set min/max if set or min/max values in the data otherwise.',
+            t('Show Y-axis'),
+            t(
+              'Show Y-axis on the sparkline. Will display the manually set min/max if set or min/max values in the data otherwise.',
+            ),
             'show-y-axis-bounds',
             <CheckboxControl
               value={this.state.showYAxis}
@@ -291,8 +293,8 @@ export default class TimeSeriesColumnControl extends React.Component {
           )}
         {this.state.colType === 'spark' &&
           this.formRow(
-            'Y-axis bounds',
-            'Manually set min/max values for the y-axis.',
+            t('Y-axis bounds'),
+            t('Manually set min/max values for the y-axis.'),
             'y-axis-bounds',
             <BoundsControl
               value={this.state.yAxisBounds}
@@ -301,10 +303,10 @@ export default class TimeSeriesColumnControl extends React.Component {
           )}
         {this.state.colType !== 'spark' &&
           this.formRow(
-            'Color bounds',
-            `Number bounds used for color encoding from red to blue.
-              Reverse the numbers for blue to red. To get pure red or blue,
-              you can enter either only min or max.`,
+            t('Color bounds'),
+            t(`Number bounds used for color encoding from red to blue.
+               Reverse the numbers for blue to red. To get pure red or blue,
+               you can enter either only min or max.`),
             'bounds',
             <BoundsControl
               value={this.state.bounds}
@@ -312,24 +314,24 @@ export default class TimeSeriesColumnControl extends React.Component {
             />,
           )}
         {this.formRow(
-          'Number format',
-          'Optional d3 number format string',
+          t('Number format'),
+          t('Optional d3 number format string'),
           'd3-format',
           <Input
             value={this.state.d3format}
             onChange={this.onTextInputChange.bind(this, 'd3format')}
-            placeholder="Number format string"
+            placeholder={t('Number format string')}
           />,
         )}
         {this.state.colType === 'spark' &&
           this.formRow(
-            'Date format',
-            'Optional d3 date format string',
+            t('Date format'),
+            t('Optional d3 date format string'),
             'date-format',
             <Input
               value={this.state.dateFormat}
               onChange={this.onTextInputChange.bind(this, 'dateFormat')}
-              placeholder="Date format string"
+              placeholder={t('Date format string')}
             />,
           )}
         <ButtonBar>
@@ -356,7 +358,7 @@ export default class TimeSeriesColumnControl extends React.Component {
         <ControlPopover
           trigger="click"
           content={this.renderPopover()}
-          title="Column Configuration"
+          title={t('Column Configuration')}
           visible={this.state.popoverVisible}
           onVisibleChange={this.onPopoverVisibleChange}
         >
diff --git a/superset-frontend/src/explore/components/controls/ViewportControl.jsx b/superset-frontend/src/explore/components/controls/ViewportControl.jsx
index 631a8c550878..ff9ebef2042e 100644
--- a/superset-frontend/src/explore/components/controls/ViewportControl.jsx
+++ b/superset-frontend/src/explore/components/controls/ViewportControl.jsx
@@ -17,6 +17,7 @@
  * under the License.
  */
 import React from 'react';
+import { t } from '@superset-ui/core';
 import PropTypes from 'prop-types';
 import Popover from 'src/components/Popover';
 import { decimal2sexagesimal } from 'geolib';
@@ -107,7 +108,7 @@ export default class ViewportControl extends React.Component {
           trigger="click"
           placement="right"
           content={this.renderPopover()}
-          title="Viewport"
+          title={t('Viewport')}
         >
           <Label className="pointer">{this.renderLabel()}</Label>
         </Popover>
diff --git a/superset-frontend/src/explore/controlPanels/sections.tsx b/superset-frontend/src/explore/controlPanels/sections.tsx
index 4b0d641274fe..fe384c6f39ce 100644
--- a/superset-frontend/src/explore/controlPanels/sections.tsx
+++ b/superset-frontend/src/explore/controlPanels/sections.tsx
@@ -19,7 +19,6 @@
 import React from 'react';
 import { t } from '@superset-ui/core';
 import { ControlPanelSectionConfig } from '@superset-ui/chart-controls';
-import { formatSelectOptions } from 'src/explore/exploreUtils';
 
 export const datasourceAndVizType: ControlPanelSectionConfig = {
   controlSetRows: [
@@ -81,7 +80,7 @@ export const annotations: ControlPanelSectionConfig = {
           type: 'AnnotationLayerControl',
           label: '',
           default: [],
-          description: 'Annotation layers',
+          description: t('Annotation layers'),
           renderTrigger: true,
           tabOverride: 'data',
         },
@@ -131,13 +130,13 @@ export const NVD3TimeSeries: ControlPanelSectionConfig[] = [
             type: 'SelectControl',
             label: t('Rolling function'),
             default: 'None',
-            choices: formatSelectOptions([
-              'None',
-              'mean',
-              'sum',
-              'std',
-              'cumsum',
-            ]),
+            choices: [
+              ['None', t('None')],
+              ['mean', t('mean')],
+              ['sum', t('sum')],
+              ['std', t('std')],
+              ['cumsum', t('cumsum')],
+            ],
             description: t(
               'Defines a rolling window function to apply, works along ' +
                 'with the [Periods] text box',
@@ -181,20 +180,18 @@ export const NVD3TimeSeries: ControlPanelSectionConfig[] = [
             multi: true,
             freeForm: true,
             label: t('Time shift'),
-            choices: formatSelectOptions([
-              '1 day',
-              '1 week',
-              '28 days',
-              '30 days',
-              '52 weeks',
-              '1 year',
-              '104 weeks',
-              '2 years',
-              '156 weeks',
-              '3 years',
-              '208 weeks',
-              '4 years',
-            ]),
+            choices: [
+              ['1 day', t('1 day')],
+              ['1 week', t('1 week')],
+              ['28 days', t('28 days')],
+              ['30 days', t('30 days')],
+              ['52 weeks', t('52 weeks')],
+              ['1 year', t('1 year')],
+              ['104 weeks', t('104 weeks')],
+              ['2 years', t('2 years')],
+              ['156 weeks', t('156 weeks')],
+              ['3 years', t('3 years')],
+            ],
             description: t(
               'Overlay one or more timeseries from a ' +
                 'relative time period. Expects relative time deltas ' +
@@ -210,10 +207,10 @@ export const NVD3TimeSeries: ControlPanelSectionConfig[] = [
             label: t('Calculation type'),
             default: 'values',
             choices: [
-              ['values', 'Actual values'],
-              ['absolute', 'Difference'],
-              ['percentage', 'Percentage change'],
-              ['ratio', 'Ratio'],
+              ['values', t('Actual values')],
+              ['absolute', t('Difference')],
+              ['percentage', t('Percentage change')],
+              ['ratio', t('Ratio')],
             ],
             description: t(
               'How to display time shifts: as individual lines; as the ' +
@@ -232,7 +229,14 @@ export const NVD3TimeSeries: ControlPanelSectionConfig[] = [
             freeForm: true,
             label: t('Rule'),
             default: null,
-            choices: formatSelectOptions(['1T', '1H', '1D', '7D', '1M', '1AS']),
+            choices: [
+              ['1T', t('1T')],
+              ['1H', t('1H')],
+              ['1D', t('1D')],
+              ['7D', t('7D')],
+              ['1M', t('1M')],
+              ['1AS', t('1AS')],
+            ],
             description: t('Pandas resample rule'),
           },
         },
@@ -243,14 +247,14 @@ export const NVD3TimeSeries: ControlPanelSectionConfig[] = [
             freeForm: true,
             label: t('Method'),
             default: null,
-            choices: formatSelectOptions([
-              'asfreq',
-              'bfill',
-              'ffill',
-              'median',
-              'mean',
-              'sum',
-            ]),
+            choices: [
+              ['asfreq', t('asfreq')],
+              ['bfill', t('bfill')],
+              ['ffill', t('ffill')],
+              ['median', t('median')],
+              ['mean', t('mean')],
+              ['sum', t('sum')],
+            ],
             description: t('Pandas resample method'),
           },
         },
diff --git a/superset-frontend/src/explore/controls.jsx b/superset-frontend/src/explore/controls.jsx
index 6b325b27c968..8cacba4890c4 100644
--- a/superset-frontend/src/explore/controls.jsx
+++ b/superset-frontend/src/explore/controls.jsx
@@ -75,8 +75,8 @@ export const PRIMARY_COLOR = { r: 0, g: 122, b: 135, a: 1 };
 
 // input choices & options
 export const D3_FORMAT_OPTIONS = [
-  ['SMART_NUMBER', 'Adaptive formatting'],
-  ['~g', 'Original value'],
+  ['SMART_NUMBER', t('Adaptive formatting')],
+  ['~g', t('Original value')],
   [',d', ',d (12345.432 => 12,345)'],
   ['.1s', '.1s (12345.432 => 10k)'],
   ['.3s', '.3s (12345.432 => 12.3k)'],
@@ -86,8 +86,8 @@ export const D3_FORMAT_OPTIONS = [
   [',.3f', ',.3f (12345.432 => 12,345.432)'],
   ['+,', '+, (12345.432 => +12,345.432)'],
   ['$,.2f', '$,.2f (12345.432 => $12,345.43)'],
-  ['DURATION', 'Duration in ms (66000 => 1m 6s)'],
-  ['DURATION_SUB', 'Duration in ms (100.40008 => 100ms 400µs 80ns)'],
+  ['DURATION', t('Duration in ms (66000 => 1m 6s)')],
+  ['DURATION_SUB', t('Duration in ms (100.40008 => 100ms 400µs 80ns)')],
 ];
 
 const ROW_LIMIT_OPTIONS = [10, 50, 100, 250, 500, 1000, 5000, 10000, 50000];
@@ -98,7 +98,7 @@ export const D3_FORMAT_DOCS =
   'D3 format syntax: https://github.com/d3/d3-format';
 
 export const D3_TIME_FORMAT_OPTIONS = [
-  ['smart_date', 'Adaptive formatting'],
+  ['smart_date', t('Adaptive formatting')],
   ['%d/%m/%Y', '%d/%m/%Y | 14/01/2019'],
   ['%m/%d/%Y', '%m/%d/%Y | 01/14/2019'],
   ['%Y-%m-%d', '%Y-%m-%d | 2019-01-14'],
@@ -251,22 +251,22 @@ export const controls = {
     label: TIME_FILTER_LABELS.granularity,
     default: 'P1D',
     choices: [
-      [null, 'all'],
-      ['PT5S', '5 seconds'],
-      ['PT30S', '30 seconds'],
-      ['PT1M', '1 minute'],
-      ['PT5M', '5 minutes'],
-      ['PT30M', '30 minutes'],
-      ['PT1H', '1 hour'],
-      ['PT6H', '6 hour'],
-      ['P1D', '1 day'],
-      ['P7D', '7 days'],
-      ['P1W', 'week'],
-      ['week_starting_sunday', 'week starting Sunday'],
-      ['week_ending_saturday', 'week ending Saturday'],
-      ['P1M', 'month'],
-      ['P3M', 'quarter'],
-      ['P1Y', 'year'],
+      [null, t('all')],
+      ['PT5S', t('5 seconds')],
+      ['PT30S', t('30 seconds')],
+      ['PT1M', t('1 minute')],
+      ['PT5M', t('5 minutes')],
+      ['PT30M', t('30 minutes')],
+      ['PT1H', t('1 hour')],
+      ['PT6H', t('6 hour')],
+      ['P1D', t('1 day')],
+      ['P7D', t('7 days')],
+      ['P1W', t('week')],
+      ['week_starting_sunday', t('week starting Sunday')],
+      ['week_ending_saturday', t('week ending Saturday')],
+      ['P1M', t('month')],
+      ['P3M', t('quarter')],
+      ['P1Y', t('year')],
     ],
     description: t(
       'The time granularity for the visualization. Note that you ' +
diff --git a/superset-frontend/src/explore/fixtures.tsx b/superset-frontend/src/explore/fixtures.tsx
index d7c1276247d5..351e6f26b126 100644
--- a/superset-frontend/src/explore/fixtures.tsx
+++ b/superset-frontend/src/explore/fixtures.tsx
@@ -58,9 +58,9 @@ export const controlPanelSectionsChartOptions: (ControlPanelSectionConfig | null
               label: t('Stacked Style'),
               renderTrigger: true,
               choices: [
-                ['stack', 'stack'],
-                ['stream', 'stream'],
-                ['expand', 'expand'],
+                ['stack', t('stack')],
+                ['stream', t('stream')],
+                ['expand', t('expand')],
               ],
               default: 'stack',
               description: '',
diff --git a/superset-frontend/src/filters/components/GroupBy/controlPanel.ts b/superset-frontend/src/filters/components/GroupBy/controlPanel.ts
index fbc61bf6e4a3..5b26f9cdcfaa 100644
--- a/superset-frontend/src/filters/components/GroupBy/controlPanel.ts
+++ b/superset-frontend/src/filters/components/GroupBy/controlPanel.ts
@@ -39,7 +39,7 @@ const config: ControlPanelConfig = {
             name: 'groupby',
             config: {
               ...sharedControls.groupby,
-              label: 'Columns to show',
+              label: t('Columns to show'),
               multiple: true,
               required: false,
             },
diff --git a/superset-frontend/src/filters/components/Range/buildQuery.ts b/superset-frontend/src/filters/components/Range/buildQuery.ts
index 8a76e5a28c16..72e2fa549247 100644
--- a/superset-frontend/src/filters/components/Range/buildQuery.ts
+++ b/superset-frontend/src/filters/components/Range/buildQuery.ts
@@ -20,6 +20,7 @@ import {
   buildQueryContext,
   GenericDataType,
   QueryFormData,
+  t,
 } from '@superset-ui/core';
 
 /**
@@ -54,7 +55,7 @@ export default function buildQuery(formData: QueryFormData) {
           },
           expressionType: 'SIMPLE',
           hasCustomLabel: true,
-          label: 'min',
+          label: t('min'),
         },
         {
           aggregate: 'MAX',
@@ -65,7 +66,7 @@ export default function buildQuery(formData: QueryFormData) {
           },
           expressionType: 'SIMPLE',
           hasCustomLabel: true,
-          label: 'max',
+          label: t('max'),
         },
       ],
     },
diff --git a/superset-frontend/src/filters/components/Range/controlPanel.ts b/superset-frontend/src/filters/components/Range/controlPanel.ts
index 076d5a44aa0d..2a38f5733cb1 100644
--- a/superset-frontend/src/filters/components/Range/controlPanel.ts
+++ b/superset-frontend/src/filters/components/Range/controlPanel.ts
@@ -36,7 +36,7 @@ const config: ControlPanelConfig = {
             name: 'groupby',
             config: {
               ...sharedControls.groupby,
-              label: 'Column',
+              label: t('Column'),
               required: true,
             },
           },
diff --git a/superset-frontend/src/filters/components/Select/controlPanel.ts b/superset-frontend/src/filters/components/Select/controlPanel.ts
index 6b1549d5359c..12bc36a7ade4 100644
--- a/superset-frontend/src/filters/components/Select/controlPanel.ts
+++ b/superset-frontend/src/filters/components/Select/controlPanel.ts
@@ -46,7 +46,7 @@ const config: ControlPanelConfig = {
             name: 'groupby',
             config: {
               ...sharedControls.groupby,
-              label: 'Column',
+              label: t('Column'),
               required: true,
             },
           },
diff --git a/superset-frontend/src/filters/components/Time/controlPanel.ts b/superset-frontend/src/filters/components/Time/controlPanel.ts
index b54909f70b96..2dbded365160 100644
--- a/superset-frontend/src/filters/components/Time/controlPanel.ts
+++ b/superset-frontend/src/filters/components/Time/controlPanel.ts
@@ -34,7 +34,7 @@ const config: ControlPanelConfig = {
             name: 'groupby',
             config: {
               ...sharedControls.groupby,
-              label: 'Column',
+              label: t('Column'),
               required: true,
             },
           },
diff --git a/superset-frontend/src/profile/components/UserInfo.tsx b/superset-frontend/src/profile/components/UserInfo.tsx
index 6b44e35caeaf..b79f1fb97cb6 100644
--- a/superset-frontend/src/profile/components/UserInfo.tsx
+++ b/superset-frontend/src/profile/components/UserInfo.tsx
@@ -73,7 +73,7 @@ export default function UserInfo({ user }: UserInfoProps) {
         <p>
           <i className="fa fa-key" />
           &nbsp;
-          <span className="text-muted">{t('id:')}</span>&nbsp;
+          <span className="text-muted">{t('id')}:</span>&nbsp;
           <span className="user-id">{user?.userId}</span>
         </p>
       </div>
diff --git a/superset-frontend/src/views/CRUD/alert/ExecutionLog.tsx b/superset-frontend/src/views/CRUD/alert/ExecutionLog.tsx
index 37f3e7c2add6..85e248c470bc 100644
--- a/superset-frontend/src/views/CRUD/alert/ExecutionLog.tsx
+++ b/superset-frontend/src/views/CRUD/alert/ExecutionLog.tsx
@@ -168,7 +168,7 @@ function ExecutionLog({ addDangerToast, isReportEnabled }: ExecutionLogProps) {
               {alertResource?.type} {alertResource?.name}
             </span>
             <span>
-              <Link to={path}>Back to all</Link>
+              <Link to={path}>{t('Back to all')}</Link>
             </span>
           </StyledHeader>
         }
diff --git a/superset-frontend/src/views/CRUD/alert/components/AlertReportCronScheduler.tsx b/superset-frontend/src/views/CRUD/alert/components/AlertReportCronScheduler.tsx
index 5418842aeaaa..9a7fa6214b8e 100644
--- a/superset-frontend/src/views/CRUD/alert/components/AlertReportCronScheduler.tsx
+++ b/superset-frontend/src/views/CRUD/alert/components/AlertReportCronScheduler.tsx
@@ -80,7 +80,7 @@ export const AlertReportCronScheduler: React.FC<AlertReportCronSchedulerProps> =
           </div>
           <div className="inline-container add-margin">
             <Radio data-test="input" value="input" />
-            <span className="input-label">CRON Schedule</span>
+            <span className="input-label">{t('CRON Schedule')}</span>
             <StyledInputContainer
               data-test="input-content"
               className="styled-input"
diff --git a/superset-frontend/src/views/CRUD/annotation/AnnotationList.tsx b/superset-frontend/src/views/CRUD/annotation/AnnotationList.tsx
index 3e18c3a92f24..89a2e5e80b43 100644
--- a/superset-frontend/src/views/CRUD/annotation/AnnotationList.tsx
+++ b/superset-frontend/src/views/CRUD/annotation/AnnotationList.tsx
@@ -259,9 +259,9 @@ function AnnotationList({
             <span>{t('Annotation Layer %s', annotationLayerName)}</span>
             <span>
               {hasHistory ? (
-                <Link to="/annotationlayer/list/">Back to all</Link>
+                <Link to="/annotationlayer/list/">{t('Back to all')}</Link>
               ) : (
-                <a href="/annotationlayer/list/">Back to all</a>
+                <a href="/annotationlayer/list/">{t('Back to all')}</a>
               )}
             </span>
           </StyledHeader>
diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm/CommonParameters.tsx b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm/CommonParameters.tsx
index d426cf4cdfe7..be60ac0308d7 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm/CommonParameters.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm/CommonParameters.tsx
@@ -66,7 +66,7 @@ export const portField = ({
       errorMessage={validationErrors?.port}
       placeholder={t('e.g. 5432')}
       className="form-group-w-50"
-      label="Port"
+      label={t('Port')}
       onChange={changeMethods.onParametersChange}
     />
   </>
diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/ExtraOptions.tsx b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/ExtraOptions.tsx
index 82eeea05a77c..6077c288a598 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/ExtraOptions.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/ExtraOptions.tsx
@@ -70,9 +70,9 @@ const ExtraOptions = ({
       <Collapse.Panel
         header={
           <div>
-            <h4>SQL Lab</h4>
+            <h4>{t('SQL Lab')}</h4>
             <p className="helper">
-              Adjust how this database will interact with SQL Lab.
+              {t('Adjust how this database will interact with SQL Lab.')}
             </p>
           </div>
         }
@@ -216,7 +216,7 @@ const ExtraOptions = ({
       <Collapse.Panel
         header={
           <div>
-            <h4>Performance</h4>
+            <h4>{t('Performance')}</h4>
             <p className="helper">
               Adjust performance settings of this database.
             </p>
@@ -326,8 +326,8 @@ const ExtraOptions = ({
       <Collapse.Panel
         header={
           <div>
-            <h4>Security</h4>
-            <p className="helper">Add extra connection information.</p>
+            <h4>{t('Security')}</h4>
+            <p className="helper">{t('Add extra connection information.')}</p>
           </div>
         }
         key="3"
@@ -440,8 +440,8 @@ const ExtraOptions = ({
       <Collapse.Panel
         header={
           <div>
-            <h4>Other</h4>
-            <p className="helper">Additional settings.</p>
+            <h4>{t('Other')}</h4>
+            <p className="helper">{t('Additional settings.')}</p>
           </div>
         }
         key="4"
diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/ModalHeader.tsx b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/ModalHeader.tsx
index 6947ea2808b0..9825489a7b80 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/ModalHeader.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/ModalHeader.tsx
@@ -89,16 +89,21 @@ const ModalHeader = ({
 
   const useSqlAlchemyFormHeader = (
     <StyledFormHeader>
-      <p className="helper-top"> STEP 2 OF 2 </p>
-      <h4>Enter Primary Credentials</h4>
+      <p className="helper-top">
+        {t('STEP %(stepCurr)s OF %(stepLast)s', {
+          stepCurr: 2,
+          stepLast: 2,
+        })}
+      </p>
+      <h4>{t('Enter Primary Credentials')}</h4>
       <p className="helper-bottom">
-        Need help? Learn how to connect your database{' '}
+        {t('Need help? Learn how to connect your database')}{' '}
         <a
           href={supersetTextDocs?.default || DOCUMENTATION_LINK}
           target="_blank"
           rel="noopener noreferrer"
         >
-          here
+          {t('here')}
         </a>
         .
       </p>
@@ -108,8 +113,13 @@ const ModalHeader = ({
   const hasConnectedDbHeader = (
     <StyledStickyHeader>
       <StyledFormHeader>
-        <p className="helper-top"> STEP 3 OF 3 </p>
-        <h4 className="step-3-text">Database connected</h4>
+        <p className="helper-top">
+          {t('STEP %(stepCurr)s OF %(stepLast)s', {
+            stepCurr: 3,
+            stepLast: 3,
+          })}
+        </p>
+        <h4 className="step-3-text">{t('Database connected')}</h4>
         <p className="subheader-text">
           {t(`Create a dataset to begin visualizing your data as a chart or go to
           SQL Lab to query your data.`)}
@@ -121,16 +131,26 @@ const ModalHeader = ({
   const hasDbHeader = (
     <StyledStickyHeader>
       <StyledFormHeader>
-        <p className="helper-top"> STEP 2 OF 3 </p>
-        <h4>Enter the required {dbModel.name} credentials</h4>
+        <p className="helper-top">
+          {t('STEP %(stepCurr)s OF %(stepLast)s', {
+            stepCurr: 2,
+            stepLast: 3,
+          })}
+        </p>
+        <h4>
+          {t('Enter the required %(dbModelName)s credentials', {
+            dbModelName: dbModel.name,
+          })}
+        </h4>
         <p className="helper-bottom">
-          Need help? Learn more about{' '}
+          {t('Need help? Learn more about')}{' '}
           <a
             href={documentationLink(db?.engine)}
             target="_blank"
             rel="noopener noreferrer"
           >
-            connecting to {dbModel.name}.
+            {t('connecting to %(dbModelName)s.', { dbModelName: dbModel.name })}
+            .
           </a>
         </p>
       </StyledFormHeader>
@@ -140,7 +160,12 @@ const ModalHeader = ({
   const noDbHeader = (
     <StyledFormHeader>
       <div className="select-db">
-        <p className="helper-top"> STEP 1 OF 3 </p>
+        <p className="helper-top">
+          {t('STEP %(stepCurr)s OF %(stepLast)s', {
+            stepCurr: 1,
+            stepLast: 3,
+          })}
+        </p>
         <h4>{t('Select a database to connect')}</h4>
       </div>
     </StyledFormHeader>
@@ -149,8 +174,17 @@ const ModalHeader = ({
   const importDbHeader = (
     <StyledStickyHeader>
       <StyledFormHeader>
-        <p className="helper-top"> STEP 2 OF 2 </p>
-        <h4>Enter the required {dbModel.name} credentials</h4>
+        <p className="helper-top">
+          {t('STEP %(stepCurr)s OF %(stepLast)s', {
+            stepCurr: 2,
+            stepLast: 2,
+          })}
+        </p>
+        <h4>
+          {t('Enter the required %(dbModelName)s credentials', {
+            dbModelName: dbModel.name,
+          })}
+        </h4>
         <p className="helper-bottom">{fileCheck ? fileList[0].name : ''}</p>
       </StyledFormHeader>
     </StyledStickyHeader>
diff --git a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Footer/index.tsx b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Footer/index.tsx
index 8fa4d6976fb4..5aecec0bb892 100644
--- a/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Footer/index.tsx
+++ b/superset-frontend/src/views/CRUD/data/dataset/AddDataset/Footer/index.tsx
@@ -118,7 +118,7 @@ function Footer({
 
   return (
     <>
-      <Button onClick={cancelButtonOnClick}>Cancel</Button>
+      <Button onClick={cancelButtonOnClick}>{t('Cancel')}</Button>
       <Button
         buttonStyle="primary"
         disabled={disabledCheck}
diff --git a/superset-frontend/src/views/CRUD/data/dataset/DatasetList.tsx b/superset-frontend/src/views/CRUD/data/dataset/DatasetList.tsx
index 1a10ade95d48..68c65a7ad167 100644
--- a/superset-frontend/src/views/CRUD/data/dataset/DatasetList.tsx
+++ b/superset-frontend/src/views/CRUD/data/dataset/DatasetList.tsx
@@ -560,8 +560,8 @@ const DatasetList: FunctionComponent<DatasetListProps> = ({
         operator: FilterOperator.datasetIsNullOrEmpty,
         unfilteredLabel: 'All',
         selects: [
-          { label: 'Virtual', value: false },
-          { label: 'Physical', value: true },
+          { label: t('Virtual'), value: false },
+          { label: t('Physical'), value: true },
         ],
       },
       {
diff --git a/superset-frontend/src/views/CRUD/welcome/Welcome.tsx b/superset-frontend/src/views/CRUD/welcome/Welcome.tsx
index 1617c8b6fde8..b3dd411258af 100644
--- a/superset-frontend/src/views/CRUD/welcome/Welcome.tsx
+++ b/superset-frontend/src/views/CRUD/welcome/Welcome.tsx
@@ -344,7 +344,7 @@ function Welcome({ user, addDangerToast }: WelcomeProps) {
             {isFeatureEnabled(FeatureFlag.THUMBNAILS) ? (
               <div className="switch">
                 <AntdSwitch checked={checked} onChange={handleToggle} />
-                <span>Thumbnails</span>
+                <span>{t('Thumbnails')}</span>
               </div>
             ) : null}
           </WelcomeNav>
diff --git a/superset-frontend/src/views/components/RightMenu.tsx b/superset-frontend/src/views/components/RightMenu.tsx
index 67e71363fdbb..e55144003471 100644
--- a/superset-frontend/src/views/components/RightMenu.tsx
+++ b/superset-frontend/src/views/components/RightMenu.tsx
@@ -514,17 +514,17 @@ const RightMenu = ({
                 )}
                 {navbarRight.version_string && (
                   <div css={versionInfoStyles}>
-                    Version: {navbarRight.version_string}
+                    {t('Version')}: {navbarRight.version_string}
                   </div>
                 )}
                 {navbarRight.version_sha && (
                   <div css={versionInfoStyles}>
-                    SHA: {navbarRight.version_sha}
+                    {t('SHA')}: {navbarRight.version_sha}
                   </div>
                 )}
                 {navbarRight.build_number && (
                   <div css={versionInfoStyles}>
-                    Build: {navbarRight.build_number}
+                    {t('Build')}: {navbarRight.build_number}
                   </div>
                 )}
               </div>
diff --git a/superset-frontend/src/visualizations/FilterBox/controlPanel.jsx b/superset-frontend/src/visualizations/FilterBox/controlPanel.jsx
index 8e76c9d8287f..60bb9c83af9e 100644
--- a/superset-frontend/src/visualizations/FilterBox/controlPanel.jsx
+++ b/superset-frontend/src/visualizations/FilterBox/controlPanel.jsx
@@ -32,7 +32,7 @@ export default {
             name: 'filter_configs',
             config: {
               type: 'CollectionControl',
-              label: 'Filters',
+              label: t('Filters'),
               description: t('Filter configuration for the filter box'),
               validators: [],
               controlName: 'FilterBoxItemControl',
diff --git a/superset-frontend/src/visualizations/TimeTable/TimeTable.jsx b/superset-frontend/src/visualizations/TimeTable/TimeTable.jsx
index f6eb4b28b288..6843387ed20f 100644
--- a/superset-frontend/src/visualizations/TimeTable/TimeTable.jsx
+++ b/superset-frontend/src/visualizations/TimeTable/TimeTable.jsx
@@ -21,7 +21,7 @@ import PropTypes from 'prop-types';
 import Mustache from 'mustache';
 import { scaleLinear } from 'd3-scale';
 import TableView from 'src/components/TableView';
-import { formatNumber, formatTime, styled } from '@superset-ui/core';
+import { formatNumber, formatTime, styled, t } from '@superset-ui/core';
 import {
   InfoTooltipWithTrigger,
   MetricOption,
@@ -119,7 +119,7 @@ const TimeTable = ({
 }) => {
   const memoizedColumns = useMemo(
     () => [
-      { accessor: 'metric', Header: 'Metric' },
+      { accessor: 'metric', Header: t('Metric') },
       ...columnConfigs.map((columnConfig, i) => ({
         accessor: columnConfig.key,
         cellProps: columnConfig.colType === 'spark' && {
diff --git a/superset/charts/data/commands/get_data_command.py b/superset/charts/data/commands/get_data_command.py
index 95f7513f253f..819693607bfb 100644
--- a/superset/charts/data/commands/get_data_command.py
+++ b/superset/charts/data/commands/get_data_command.py
@@ -17,6 +17,8 @@
 import logging
 from typing import Any, Dict
 
+from flask_babel import lazy_gettext as _
+
 from superset.charts.commands.exceptions import (
     ChartDataCacheLoadError,
     ChartDataQueryFailedError,
@@ -49,7 +51,9 @@ def run(self, **kwargs: Any) -> Dict[str, Any]:
         # TODO: QueryContext should support SIP-40 style errors
         for query in payload["queries"]:
             if query.get("error"):
-                raise ChartDataQueryFailedError(f"Error: {query['error']}")
+                raise ChartDataQueryFailedError(
+                    _("Error: %(error)s", error=query["error"])
+                )
 
         return_value = {
             "query_context": self._query_context,
diff --git a/superset/errors.py b/superset/errors.py
index 8bc84a7425c4..2df0eb82b26e 100644
--- a/superset/errors.py
+++ b/superset/errors.py
@@ -18,7 +18,7 @@
 from enum import Enum
 from typing import Any, Dict, Optional
 
-from flask_babel import gettext as _
+from flask_babel import lazy_gettext as _
 
 
 class SupersetErrorType(str, Enum):
diff --git a/superset/security/manager.py b/superset/security/manager.py
index ff0309d396bb..9fe07ec16c6f 100644
--- a/superset/security/manager.py
+++ b/superset/security/manager.py
@@ -54,6 +54,7 @@
     ViewMenuModelView,
 )
 from flask_appbuilder.widgets import ListWidget
+from flask_babel import lazy_gettext as _
 from flask_login import AnonymousUserMixin, LoginManager
 from jwt.api_jwt import _jwt_global_obj
 from sqlalchemy import and_, inspect, or_
@@ -2213,7 +2214,10 @@ def raise_for_ownership(self, resource: Model) -> None:
             raise SupersetSecurityException(
                 SupersetError(
                     error_type=SupersetErrorType.MISSING_OWNERSHIP_ERROR,
-                    message=f"You don't have the rights to alter [{resource}]",
+                    message=_(
+                        "You don't have the rights to alter %(resource)s",
+                        resource=resource,
+                    ),
                     level=ErrorLevel.ERROR,
                 )
             )
diff --git a/superset/sqllab/query_render.py b/superset/sqllab/query_render.py
index c2f96542898d..df631784e35b 100644
--- a/superset/sqllab/query_render.py
+++ b/superset/sqllab/query_render.py
@@ -35,7 +35,7 @@
     from superset.jinja_context import BaseTemplateProcessor
     from superset.sqllab.sqllab_execution_context import SqlJsonExecutionContext
 
-PARAMETER_MISSING_ERR = (
+PARAMETER_MISSING_ERR = __(
     "Please check your template parameters for syntax errors and make sure "
     "they match across your SQL query and Set Parameters. Then, try running "
     "your query again."
diff --git a/superset/views/core.py b/superset/views/core.py
index d52bbfa831fd..62a7c5b96352 100755
--- a/superset/views/core.py
+++ b/superset/views/core.py
@@ -195,7 +195,7 @@
 
 DATASOURCE_MISSING_ERR = __("The data source seems to have been deleted")
 USER_MISSING_ERR = __("The user seems to have been deleted")
-PARAMETER_MISSING_ERR = (
+PARAMETER_MISSING_ERR = __(
     "Please check your template parameters for syntax errors and make sure "
     "they match across your SQL query and Set Parameters. Then, try running "
     "your query again."
@@ -638,7 +638,7 @@ def explore_json(
             and not security_manager.can_access("can_csv", "Superset")
         ):
             return json_error_response(
-                _("You don't have the rights to ") + _("download as csv"),
+                _("You don't have the rights to download as csv"),
                 status=403,
             )
 
@@ -917,13 +917,13 @@ def explore(
 
         if action == "overwrite" and not slice_overwrite_perm:
             return json_error_response(
-                _("You don't have the rights to ") + _("alter this ") + _("chart"),
+                _("You don't have the rights to alter this chart"),
                 status=403,
             )
 
         if action == "saveas" and not slice_add_perm:
             return json_error_response(
-                _("You don't have the rights to ") + _("create a ") + _("chart"),
+                _("You don't have the rights to create a chart"),
                 status=403,
             )
 
@@ -1087,9 +1087,7 @@ def save_or_overwrite_slice(
             dash_overwrite_perm = security_manager.is_owner(dash)
             if not dash_overwrite_perm:
                 return json_error_response(
-                    _("You don't have the rights to ")
-                    + _("alter this ")
-                    + _("dashboard"),
+                    _("You don't have the rights to alter this dashboard"),
                     status=403,
                 )
 
@@ -1105,9 +1103,7 @@ def save_or_overwrite_slice(
             dash_add_perm = security_manager.can_access("can_write", "Dashboard")
             if not dash_add_perm:
                 return json_error_response(
-                    _("You don't have the rights to ")
-                    + _("create a ")
-                    + _("dashboard"),
+                    _("You don't have the rights to create a dashboard"),
                     status=403,
                 )
 
diff --git a/superset/viz.py b/superset/viz.py
index b91fdc3aaf0f..c4582925da12 100644
--- a/superset/viz.py
+++ b/superset/viz.py
@@ -905,7 +905,7 @@ def query_obj(self) -> QueryObjectDict:
             groupby = []
         if not groupby:
             raise QueryObjectValidationError(
-                _("Please choose at least one 'Group by' field ")
+                _("Please choose at least one 'Group by' field")
             )
         if transpose and not columns:
             raise QueryObjectValidationError(

From 7b15e6e3c789f82ce682b011d0904e818dfbadc3 Mon Sep 17 00:00:00 2001
From: Ville Brofeldt <33317356+villebro@users.noreply.github.com>
Date: Wed, 11 Jan 2023 19:24:18 +0200
Subject: [PATCH 12/15] fix(nav): make doc and bug buttons customizable
 (#22682)

---
 superset-frontend/src/types/bootstrapTypes.ts |   4 +
 .../src/views/components/RightMenu.tsx        |  47 ++++---
 superset/config.py                            |   2 +
 .../templates/appbuilder/navbar_right.html    | 127 ------------------
 superset/views/base.py                        |   4 +
 5 files changed, 40 insertions(+), 144 deletions(-)
 delete mode 100644 superset/templates/appbuilder/navbar_right.html

diff --git a/superset-frontend/src/types/bootstrapTypes.ts b/superset-frontend/src/types/bootstrapTypes.ts
index b667b9a80c11..db646b84a77f 100644
--- a/superset-frontend/src/types/bootstrapTypes.ts
+++ b/superset-frontend/src/types/bootstrapTypes.ts
@@ -94,10 +94,14 @@ export interface BrandProps {
 export interface NavBarProps {
   show_watermark: boolean;
   bug_report_url?: string;
+  bug_report_text?: string;
+  bug_report_icon?: string;
   version_string?: string;
   version_sha?: string;
   build_number?: string;
   documentation_url?: string;
+  documentation_text?: string;
+  documentation_icon?: string;
   languages: Languages;
   show_language_picker: boolean;
   user_is_anonymous: boolean;
diff --git a/superset-frontend/src/views/components/RightMenu.tsx b/superset-frontend/src/views/components/RightMenu.tsx
index e55144003471..59e7f7f44866 100644
--- a/superset-frontend/src/views/components/RightMenu.tsx
+++ b/superset-frontend/src/views/components/RightMenu.tsx
@@ -539,25 +539,38 @@ const RightMenu = ({
         )}
       </Menu>
       {navbarRight.documentation_url && (
-        <StyledAnchor
-          href={navbarRight.documentation_url}
-          target="_blank"
-          rel="noreferrer"
-          title={t('Documentation')}
-        >
-          <i className="fa fa-question" />
-          &nbsp;
-        </StyledAnchor>
+        <>
+          <StyledAnchor
+            href={navbarRight.documentation_url}
+            target="_blank"
+            rel="noreferrer"
+            title={navbarRight.documentation_text || t('Documentation')}
+          >
+            {navbarRight.documentation_icon ? (
+              <i className={navbarRight.documentation_icon} />
+            ) : (
+              <i className="fa fa-question" />
+            )}
+          </StyledAnchor>
+          <span>&nbsp;</span>
+        </>
       )}
       {navbarRight.bug_report_url && (
-        <StyledAnchor
-          href={navbarRight.bug_report_url}
-          target="_blank"
-          rel="noreferrer"
-          title={t('Report a bug')}
-        >
-          <i className="fa fa-bug" />
-        </StyledAnchor>
+        <>
+          <StyledAnchor
+            href={navbarRight.bug_report_url}
+            target="_blank"
+            rel="noreferrer"
+            title={navbarRight.bug_report_text || t('Report a bug')}
+          >
+            {navbarRight.bug_report_icon ? (
+              <i className={navbarRight.bug_report_icon} />
+            ) : (
+              <i className="fa fa-bug" />
+            )}
+          </StyledAnchor>
+          <span>&nbsp;</span>
+        </>
       )}
       {navbarRight.user_is_anonymous && (
         <StyledAnchor href={navbarRight.user_login_url}>
diff --git a/superset/config.py b/superset/config.py
index 64ff09a5c838..d9c36955e3e6 100644
--- a/superset/config.py
+++ b/superset/config.py
@@ -1303,6 +1303,8 @@ def EMAIL_HEADER_MUTATOR(  # pylint: disable=invalid-name,unused-argument
 
 # Send user to a link where they can report bugs
 BUG_REPORT_URL = None
+BUG_REPORT_TEXT = "Report a bug"
+BUG_REPORT_ICON = None  # Recommended size: 16x16
 
 # Send user to a link where they can read more about Superset
 DOCUMENTATION_URL = None
diff --git a/superset/templates/appbuilder/navbar_right.html b/superset/templates/appbuilder/navbar_right.html
deleted file mode 100644
index 334e7ea2adaa..000000000000
--- a/superset/templates/appbuilder/navbar_right.html
+++ /dev/null
@@ -1,127 +0,0 @@
-{#
-  Licensed to the Apache Software Foundation (ASF) under one
-  or more contributor license agreements.  See the NOTICE file
-  distributed with this work for additional information
-  regarding copyright ownership.  The ASF licenses this file
-  to you under the Apache License, Version 2.0 (the
-  "License"); you may not use this file except in compliance
-  with the License.  You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-  Unless required by applicable law or agreed to in writing,
-  software distributed under the License is distributed on an
-  "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-  KIND, either express or implied.  See the License for the
-  specific language governing permissions and limitations
-  under the License.
-#}
-
-{% set bug_report_url = appbuilder.app.config['BUG_REPORT_URL'] %}
-{% set documentation_url = appbuilder.app.config['DOCUMENTATION_URL'] %}
-{% set documentation_text = appbuilder.app.config['DOCUMENTATION_TEXT'] %}
-{% set documentation_icon = appbuilder.app.config['DOCUMENTATION_ICON'] %}
-{% set version_string = appbuilder.app.config['VERSION_STRING'] %}
-{% set version_sha = appbuilder.app.config['VERSION_SHA'] %}
-
-{% set locale = session['locale'] %}
-{% if not locale %}
-    {% set locale = 'en' %}
-{% endif %}
-
-{% if not current_user.is_anonymous %}
-    <li class="dropdown">
-        <button type="button" style="margin-top: 12px; margin-right: 30px;" data-toggle="dropdown" class="dropdown-toggle btn btn-sm btn-primary">
-          <i class="fa fa-plus"></i> {{ _("New") }}
-        </button>
-        <ul class="dropdown-menu">
-            <li><a href="/superset/sqllab"><span class="fa fa-fw fa-search"></span> {{_("SQL Query")}}</a></li>
-            <li><a href="/chart/add"><span class="fa fa-fw fa-bar-chart"></span> {{_("Chart")}}</a></li>
-            <li><a href="/dashboard/new/"><span class="fa fa-fw fa-dashboard"></span> {{_("Dashboard")}}</a></li>
-        </ul>
-    </li>
-{% endif %}
-{% if documentation_url %}
-<li>
-  <a
-    tabindex="-1"
-    href="{{ documentation_url }}"
-    title="{{ documentation_text }}"
-    target="_blank"
-  >
-  {% if documentation_icon %}
-    <img
-      width="100%"
-      src="{{ documentation_icon }}"
-      alt="{{ documentation_text }}"
-    />
-  {% else %}
-    <i class="fa fa-question"></i>&nbsp;
-  {% endif %}
-  </a>
-</li>
-{% endif %}
-{% if bug_report_url %}
-<li>
-  <a
-    tabindex="-1"
-    href="{{ bug_report_url }}"
-    target="_blank"
-    title="Report a bug"
-  >
-    <i class="fa fa-bug"></i>&nbsp;
-  </a>
-</li>
-{% endif %}
-{% if languages.keys()|length > 1 %}
-<li class="dropdown">
-    <a class="dropdown-toggle" data-toggle="dropdown" href="javascript:void(0)">
-       <div class="f16"><i class="flag {{languages[locale].get('flag')}}"></i>&nbsp;<b class="caret"></b>
-       </div>
-    </a>
-    <ul class="dropdown-menu" id="language-picker">
-      <li class="dropdown">
-        {% for lang in languages %}
-            {% if lang != locale %}
-                <a tabindex="-1" href="{{appbuilder.get_url_for_locale(lang)}}">
-                  <div class="f16">
-                    <i class="flag {{languages[lang].get('flag')}}"></i> - {{languages[lang].get('name')}}
-                  </div>
-                </a>
-            {% endif %}
-        {% endfor %}
-      </li>
-    </ul>
-</li>
-{% endif %}
-
-{% if not current_user.is_anonymous %}
-    <li class="dropdown">
-      <a
-        class="dropdown-toggle"
-        data-toggle="dropdown"
-        title="{{g.user.get_full_name()}}"
-        href="javascript:void(0)"
-      >
-        <i class="fa fa-user"></i>&nbsp;<b class="caret"></b>
-      </a>
-        <ul class="dropdown-menu">
-            <li><a href="/superset/profile/{{g.user.username}}"><span class="fa fa-fw fa-user"></span>{{_("Profile")}}</a></li>
-            <li><a href="{{appbuilder.get_url_for_userinfo}}"><span class="fa fa-fw fa-user"></span>{{_("Info")}}</a></li>
-            <li><a href="{{appbuilder.get_url_for_logout}}"><span class="fa fa-fw fa-sign-out"></span>{{_("Logout")}}</a></li>
-            {% if version_string or version_sha %}
-              <li class="fineprint">
-                {% if version_string %}
-                  <div>Version: {{version_string}}</div>
-                {% endif %}
-                {% if version_sha %}
-                  <div>SHA: {{version_sha}}</div>
-                {% endif %}
-              </li>
-            {% endif %}
-        </ul>
-    </li>
-{% else %}
-    <li><a href="{{appbuilder.get_url_for_login}}">
-    <i class="fa fa-fw fa-sign-in"></i>{{_("Login")}}</a></li>
-{% endif %}
diff --git a/superset/views/base.py b/superset/views/base.py
index 41a27b4139e9..515384082299 100644
--- a/superset/views/base.py
+++ b/superset/views/base.py
@@ -367,7 +367,11 @@ def menu_data(user: User) -> Dict[str, Any]:
             # show the watermark if the default app icon has been overriden
             "show_watermark": ("superset-logo-horiz" not in appbuilder.app_icon),
             "bug_report_url": appbuilder.app.config["BUG_REPORT_URL"],
+            "bug_report_icon": appbuilder.app.config["BUG_REPORT_ICON"],
+            "bug_report_text": appbuilder.app.config["BUG_REPORT_TEXT"],
             "documentation_url": appbuilder.app.config["DOCUMENTATION_URL"],
+            "documentation_icon": appbuilder.app.config["DOCUMENTATION_ICON"],
+            "documentation_text": appbuilder.app.config["DOCUMENTATION_TEXT"],
             "version_string": appbuilder.app.config["VERSION_STRING"],
             "version_sha": appbuilder.app.config["VERSION_SHA"],
             "build_number": build_number,

From a8f3a4fb6e90f061a9b87e7366f7f7c7184ca629 Mon Sep 17 00:00:00 2001
From: "JUST.in DO IT" <justin.park@airbnb.com>
Date: Wed, 11 Jan 2023 09:38:59 -0800
Subject: [PATCH 13/15] fix(sqllab): Overflow bigint in json-tree view (#22609)

---
 .../FilterableTable/FilterableTable.test.tsx    | 17 +++++++++++++++++
 .../src/components/FilterableTable/index.tsx    | 17 +++++++++++++++--
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/superset-frontend/src/components/FilterableTable/FilterableTable.test.tsx b/superset-frontend/src/components/FilterableTable/FilterableTable.test.tsx
index 494af6033072..3135377cf7c2 100644
--- a/superset-frontend/src/components/FilterableTable/FilterableTable.test.tsx
+++ b/superset-frontend/src/components/FilterableTable/FilterableTable.test.tsx
@@ -21,6 +21,7 @@ import { ReactWrapper } from 'enzyme';
 import { styledMount as mount } from 'spec/helpers/theming';
 import FilterableTable, {
   MAX_COLUMNS_FOR_TABLE,
+  renderBigIntStrToNumber,
 } from 'src/components/FilterableTable';
 import { render, screen } from 'spec/helpers/testing-library';
 import userEvent from '@testing-library/user-event';
@@ -331,3 +332,19 @@ describe('FilterableTable sorting - RTL', () => {
     expect(gridCells[6]).toHaveTextContent('2022-01-02');
   });
 });
+
+test('renders bigInt value in a number format', () => {
+  expect(renderBigIntStrToNumber('123')).toBe('123');
+  expect(renderBigIntStrToNumber('some string value')).toBe(
+    'some string value',
+  );
+  expect(renderBigIntStrToNumber('{ a: 123 }')).toBe('{ a: 123 }');
+  expect(renderBigIntStrToNumber('"Not a Number"')).toBe('"Not a Number"');
+  // trim quotes for bigint string format
+  expect(renderBigIntStrToNumber('"-12345678901234567890"')).toBe(
+    '-12345678901234567890',
+  );
+  expect(renderBigIntStrToNumber('"12345678901234567890"')).toBe(
+    '12345678901234567890',
+  );
+});
diff --git a/superset-frontend/src/components/FilterableTable/index.tsx b/superset-frontend/src/components/FilterableTable/index.tsx
index 731514cca6cb..4d9098b2c2a4 100644
--- a/superset-frontend/src/components/FilterableTable/index.tsx
+++ b/superset-frontend/src/components/FilterableTable/index.tsx
@@ -53,7 +53,7 @@ function safeJsonObjectParse(
 
   // We know `data` is a string starting with '{' or '[', so try to parse it as a valid object
   try {
-    const jsonData = JSON.parse(data);
+    const jsonData = JSONbig({ storeAsString: true }).parse(data);
     if (jsonData && typeof jsonData === 'object') {
       return jsonData;
     }
@@ -63,6 +63,13 @@ function safeJsonObjectParse(
   }
 }
 
+export function renderBigIntStrToNumber(value: string) {
+  if (typeof value === 'string' && /^"-?\d+"$/.test(value)) {
+    return value.substring(1, value.length - 1);
+  }
+  return value;
+}
+
 const GRID_POSITION_ADJUSTMENT = 4;
 const SCROLL_BAR_HEIGHT = 15;
 // This regex handles all possible number formats in javascript, including ints, floats,
@@ -405,7 +412,13 @@ const FilterableTable = ({
     jsonString: CellDataType,
   ) => (
     <ModalTrigger
-      modalBody={<JSONTree data={jsonObject} theme={getJsonTreeTheme()} />}
+      modalBody={
+        <JSONTree
+          data={jsonObject}
+          theme={getJsonTreeTheme()}
+          valueRenderer={renderBigIntStrToNumber}
+        />
+      }
       modalFooter={
         <Button>
           <CopyToClipboard shouldShowText={false} text={jsonString} />

From 0908fd291bedfab51ccd7d67a959e0137d45b9c4 Mon Sep 17 00:00:00 2001
From: John Bodley <4567245+john-bodley@users.noreply.github.com>
Date: Thu, 12 Jan 2023 06:43:19 +1300
Subject: [PATCH 14/15] chore: Bump Flask-AppBuilder to 4.2.0 (#22580)

---
 requirements/base.txt | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/requirements/base.txt b/requirements/base.txt
index 5e12f2faae07..4dc66c1e4ade 100644
--- a/requirements/base.txt
+++ b/requirements/base.txt
@@ -32,7 +32,9 @@ cachelib==0.4.1
 celery==5.2.2
     # via apache-superset
 cffi==1.15.1
-    # via cryptography
+    # via
+    #   cryptography
+    #   pynacl
 click==8.0.4
     # via
     #   apache-superset
@@ -80,7 +82,7 @@ flask==2.1.3
     #   flask-migrate
     #   flask-sqlalchemy
     #   flask-wtf
-flask-appbuilder==4.1.6
+flask-appbuilder==4.2.0
     # via apache-superset
 flask-babel==1.0.0
     # via flask-appbuilder

From 539936522fbbda46ebb39b65ed298f6e251a548f Mon Sep 17 00:00:00 2001
From: Antonio Rivero Martinez
 <38889534+Antonio-RiveroMartnez@users.noreply.github.com>
Date: Wed, 11 Jan 2023 16:29:52 -0300
Subject: [PATCH 15/15] feat(ssh_tunnel): SQLAlchemy Form UI (#22513)

Co-authored-by: hughhhh <hughmil3s@gmail.com>
Co-authored-by: Elizabeth Thompson <eschutho@gmail.com>
---
 .../src/utils/featureFlags.ts                 |   1 +
 .../DatabaseConnectionForm/index.tsx          |   1 +
 .../database/DatabaseModal/SSHTunnelForm.tsx  | 265 ++++++++++++++++++
 .../database/DatabaseModal/SqlAlchemyForm.tsx |   5 +-
 .../database/DatabaseModal/index.test.tsx     | 208 ++++++++++++++
 .../data/database/DatabaseModal/index.tsx     | 101 ++++++-
 .../src/views/CRUD/data/database/types.ts     |  48 ++++
 superset/databases/api.py                     |   3 +
 .../databases/commands/test_connection.py     |   9 +
 superset/databases/schemas.py                 |   1 +
 .../databases/ssh_tunnel/commands/update.py   |   3 +-
 superset/databases/ssh_tunnel/dao.py          |  23 ++
 superset/databases/ssh_tunnel/models.py       |  11 +-
 superset/db_engine_specs/base.py              |   2 +
 superset/utils/ssh_tunnel.py                  |  13 +
 .../integration_tests/databases/api_tests.py  |  13 +
 16 files changed, 701 insertions(+), 6 deletions(-)
 create mode 100644 superset-frontend/src/views/CRUD/data/database/DatabaseModal/SSHTunnelForm.tsx

diff --git a/superset-frontend/packages/superset-ui-core/src/utils/featureFlags.ts b/superset-frontend/packages/superset-ui-core/src/utils/featureFlags.ts
index 012bb4ebaf9e..524d5a6d1c14 100644
--- a/superset-frontend/packages/superset-ui-core/src/utils/featureFlags.ts
+++ b/superset-frontend/packages/superset-ui-core/src/utils/featureFlags.ts
@@ -63,6 +63,7 @@ export enum FeatureFlag {
   USE_ANALAGOUS_COLORS = 'USE_ANALAGOUS_COLORS',
   UX_BETA = 'UX_BETA',
   VERSIONED_EXPORT = 'VERSIONED_EXPORT',
+  SSH_TUNNELING = 'SSH_TUNNELING',
 }
 export type ScheduleQueriesProps = {
   JSONSCHEMA: {
diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm/index.tsx b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm/index.tsx
index af4923e7b982..f6284ae67d9a 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm/index.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/DatabaseConnectionForm/index.tsx
@@ -73,6 +73,7 @@ export interface FieldPropTypes {
     onRemoveTableCatalog: (idx: number) => void;
   } & {
     onExtraInputChange: (value: any) => void;
+    onSSHTunnelParametersChange: (value: any) => string;
   };
   validationErrors: JsonObject | null;
   getValidation: () => void;
diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/SSHTunnelForm.tsx b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/SSHTunnelForm.tsx
new file mode 100644
index 000000000000..d73c00265d0a
--- /dev/null
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/SSHTunnelForm.tsx
@@ -0,0 +1,265 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import React, { EventHandler, ChangeEvent, useState } from 'react';
+import { t, SupersetTheme, styled } from '@superset-ui/core';
+import { AntdForm, AntdSwitch, Col, Row } from 'src/components';
+import InfoTooltip from 'src/components/InfoTooltip';
+import { Form, FormLabel } from 'src/components/Form';
+import { Radio } from 'src/components/Radio';
+import { Input, TextArea } from 'src/components/Input';
+import { Input as AntdInput, Tooltip } from 'antd';
+import { EyeInvisibleOutlined, EyeOutlined } from '@ant-design/icons';
+import { isEmpty } from 'lodash';
+import { infoTooltip, toggleStyle } from './styles';
+
+import { DatabaseObject } from '../types';
+import { AuthType } from '.';
+
+const StyledDiv = styled.div`
+  padding-top: ${({ theme }) => theme.gridUnit * 2}px;
+  label {
+    color: ${({ theme }) => theme.colors.grayscale.base};
+    text-transform: uppercase;
+    margin-bottom: ${({ theme }) => theme.gridUnit * 2}px;
+  }
+`;
+
+const StyledRow = styled(Row)`
+  padding-bottom: ${({ theme }) => theme.gridUnit * 2}px;
+`;
+
+const StyledFormItem = styled(AntdForm.Item)`
+  margin-bottom: 0 !important;
+`;
+
+const StyledInputPassword = styled(AntdInput.Password)`
+  margin: ${({ theme }) => `${theme.gridUnit}px 0 ${theme.gridUnit * 2}px`};
+`;
+
+const SSHTunnelForm = ({
+  db,
+  dbFetched,
+  isEditMode,
+  sshTunneling,
+  onSSHTunnelParametersChange,
+  setSSHTunnelLoginMethod,
+  removeSSHTunnelConfig,
+}: {
+  db: DatabaseObject | null;
+  dbFetched: DatabaseObject | null;
+  isEditMode: boolean;
+  sshTunneling: boolean;
+  onSSHTunnelParametersChange: EventHandler<
+    ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
+  >;
+  setSSHTunnelLoginMethod: (method: AuthType) => void;
+  removeSSHTunnelConfig: () => void;
+}) => {
+  const [useSSHTunneling, setUseSSHTunneling] = useState<boolean>(
+    !isEmpty(db?.ssh_tunnel),
+  );
+  const [usePassword, setUsePassword] = useState<AuthType>(AuthType.password);
+
+  return (
+    <Form>
+      <div css={(theme: SupersetTheme) => infoTooltip(theme)}>
+        <AntdSwitch
+          disabled={
+            !sshTunneling || (isEditMode && !isEmpty(dbFetched?.ssh_tunnel))
+          }
+          checked={useSSHTunneling}
+          onChange={changed => {
+            setUseSSHTunneling(changed);
+            if (!changed) removeSSHTunnelConfig();
+          }}
+          data-test="ssh-tunnel-switch"
+        />
+        <span css={toggleStyle}>SSH Tunnel</span>
+        <InfoTooltip
+          tooltip={t('SSH Tunnel configuration parameters')}
+          placement="right"
+          viewBox="0 -5 24 24"
+        />
+      </div>
+      {useSSHTunneling && (
+        <>
+          <StyledRow gutter={16}>
+            <Col xs={24} md={12}>
+              <StyledDiv>
+                <FormLabel htmlFor="server_address" required>
+                  {t('SSH Host')}
+                </FormLabel>
+                <Input
+                  name="server_address"
+                  type="text"
+                  placeholder={t('e.g. 127.0.0.1')}
+                  value={db?.ssh_tunnel?.server_address || ''}
+                  onChange={onSSHTunnelParametersChange}
+                  data-test="ssh-tunnel-server_address-input"
+                />
+              </StyledDiv>
+            </Col>
+            <Col xs={24} md={12}>
+              <StyledDiv>
+                <FormLabel htmlFor="server_port" required>
+                  {t('SSH Port')}
+                </FormLabel>
+                <Input
+                  name="server_port"
+                  type="text"
+                  placeholder={t('22')}
+                  value={db?.ssh_tunnel?.server_port || ''}
+                  onChange={onSSHTunnelParametersChange}
+                  data-test="ssh-tunnel-server_port-input"
+                />
+              </StyledDiv>
+            </Col>
+          </StyledRow>
+          <StyledRow gutter={16}>
+            <Col xs={24}>
+              <StyledDiv>
+                <FormLabel htmlFor="username" required>
+                  {t('Username')}
+                </FormLabel>
+                <Input
+                  name="username"
+                  type="text"
+                  placeholder={t('e.g. Analytics')}
+                  value={db?.ssh_tunnel?.username || ''}
+                  onChange={onSSHTunnelParametersChange}
+                  data-test="ssh-tunnel-username-input"
+                />
+              </StyledDiv>
+            </Col>
+          </StyledRow>
+          <StyledRow gutter={16}>
+            <Col xs={24}>
+              <StyledDiv>
+                <FormLabel htmlFor="use_password" required>
+                  {t('Login with')}
+                </FormLabel>
+                <StyledFormItem name="use_password" initialValue={usePassword}>
+                  <Radio.Group
+                    onChange={({ target: { value } }) => {
+                      setUsePassword(value);
+                      setSSHTunnelLoginMethod(value);
+                    }}
+                  >
+                    <Radio
+                      value={AuthType.password}
+                      data-test="ssh-tunnel-use_password-radio"
+                    >
+                      {t('Password')}
+                    </Radio>
+                    <Radio
+                      value={AuthType.privateKey}
+                      data-test="ssh-tunnel-use_private_key-radio"
+                    >
+                      {t('Private Key & Password')}
+                    </Radio>
+                  </Radio.Group>
+                </StyledFormItem>
+              </StyledDiv>
+            </Col>
+          </StyledRow>
+          {usePassword === AuthType.password && (
+            <StyledRow gutter={16}>
+              <Col xs={24}>
+                <StyledDiv>
+                  <FormLabel htmlFor="password" required>
+                    {t('SSH Password')}
+                  </FormLabel>
+                  <StyledInputPassword
+                    name="password"
+                    placeholder={t('e.g. ********')}
+                    value={db?.ssh_tunnel?.password || ''}
+                    onChange={onSSHTunnelParametersChange}
+                    data-test="ssh-tunnel-password-input"
+                    iconRender={visible =>
+                      visible ? (
+                        <Tooltip title="Hide password.">
+                          <EyeInvisibleOutlined />
+                        </Tooltip>
+                      ) : (
+                        <Tooltip title="Show password.">
+                          <EyeOutlined />
+                        </Tooltip>
+                      )
+                    }
+                    role="textbox"
+                  />
+                </StyledDiv>
+              </Col>
+            </StyledRow>
+          )}
+          {usePassword === AuthType.privateKey && (
+            <>
+              <StyledRow gutter={16}>
+                <Col xs={24}>
+                  <StyledDiv>
+                    <FormLabel htmlFor="private_key" required>
+                      {t('Private Key')}
+                    </FormLabel>
+                    <TextArea
+                      name="private_key"
+                      placeholder={t('Paste Private Key here')}
+                      value={db?.ssh_tunnel?.private_key || ''}
+                      onChange={onSSHTunnelParametersChange}
+                      data-test="ssh-tunnel-private_key-input"
+                      rows={4}
+                    />
+                  </StyledDiv>
+                </Col>
+              </StyledRow>
+              <StyledRow gutter={16}>
+                <Col xs={24}>
+                  <StyledDiv>
+                    <FormLabel htmlFor="private_key_password" required>
+                      {t('Private Key Password')}
+                    </FormLabel>
+                    <StyledInputPassword
+                      name="private_key_password"
+                      placeholder={t('e.g. ********')}
+                      value={db?.ssh_tunnel?.private_key_password || ''}
+                      onChange={onSSHTunnelParametersChange}
+                      data-test="ssh-tunnel-private_key_password-input"
+                      iconRender={visible =>
+                        visible ? (
+                          <Tooltip title="Hide password.">
+                            <EyeInvisibleOutlined />
+                          </Tooltip>
+                        ) : (
+                          <Tooltip title="Show password.">
+                            <EyeOutlined />
+                          </Tooltip>
+                        )
+                      }
+                      role="textbox"
+                    />
+                  </StyledDiv>
+                </Col>
+              </StyledRow>
+            </>
+          )}
+        </>
+      )}
+    </Form>
+  );
+};
+export default SSHTunnelForm;
diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/SqlAlchemyForm.tsx b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/SqlAlchemyForm.tsx
index 1fac50d34338..003a26c9a171 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/SqlAlchemyForm.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/SqlAlchemyForm.tsx
@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import React, { EventHandler, ChangeEvent, MouseEvent } from 'react';
+import React, { EventHandler, ChangeEvent, MouseEvent, ReactNode } from 'react';
 import { t, SupersetTheme } from '@superset-ui/core';
 import SupersetText from 'src/utils/textUtils';
 import Button from 'src/components/Button';
@@ -30,12 +30,14 @@ const SqlAlchemyTab = ({
   testConnection,
   conf,
   testInProgress = false,
+  children,
 }: {
   db: DatabaseObject | null;
   onInputChange: EventHandler<ChangeEvent<HTMLInputElement>>;
   testConnection: EventHandler<MouseEvent<HTMLElement>>;
   conf: { SQLALCHEMY_DOCS_URL: string; SQLALCHEMY_DISPLAY_TEXT: string };
   testInProgress?: boolean;
+  children?: ReactNode;
 }) => {
   let fallbackDocsUrl;
   let fallbackDisplayText;
@@ -99,6 +101,7 @@ const SqlAlchemyTab = ({
           {t('for more information on how to structure your URI.')}
         </div>
       </StyledInputContainer>
+      {children}
       <Button
         onClick={testConnection}
         loading={testInProgress}
diff --git a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.test.tsx b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.test.tsx
index 79b0bd626921..96bcace64761 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.test.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.test.tsx
@@ -38,6 +38,11 @@ import DatabaseModal, {
   ActionType,
 } from './index';
 
+jest.mock('@superset-ui/core', () => ({
+  ...jest.requireActual('@superset-ui/core'),
+  isFeatureEnabled: () => true,
+}));
+
 const dbProps = {
   show: true,
   database_name: 'my database',
@@ -126,6 +131,7 @@ fetchMock.mock(AVAILABLE_DB_ENDPOINT, {
         'postgresql://user:password@host:port/dbname[?key=value&key=value...]',
       engine_information: {
         supports_file_upload: true,
+        allow_ssh_tunneling: true,
       },
     },
     {
@@ -135,6 +141,7 @@ fetchMock.mock(AVAILABLE_DB_ENDPOINT, {
       preferred: true,
       engine_information: {
         supports_file_upload: true,
+        allow_ssh_tunneling: false,
       },
     },
     {
@@ -187,6 +194,7 @@ fetchMock.mock(AVAILABLE_DB_ENDPOINT, {
         'mysql://user:password@host:port/dbname[?key=value&key=value...]',
       engine_information: {
         supports_file_upload: true,
+        allow_ssh_tunneling: false,
       },
     },
     {
@@ -196,6 +204,7 @@ fetchMock.mock(AVAILABLE_DB_ENDPOINT, {
       preferred: true,
       engine_information: {
         supports_file_upload: true,
+        allow_ssh_tunneling: true,
       },
     },
     {
@@ -205,6 +214,7 @@ fetchMock.mock(AVAILABLE_DB_ENDPOINT, {
       preferred: false,
       engine_information: {
         supports_file_upload: true,
+        allow_ssh_tunneling: false,
       },
     },
     {
@@ -229,6 +239,7 @@ fetchMock.mock(AVAILABLE_DB_ENDPOINT, {
       sqlalchemy_uri_placeholder: 'bigquery://{project_id}',
       engine_information: {
         supports_file_upload: true,
+        allow_ssh_tunneling: false,
       },
     },
     {
@@ -239,6 +250,7 @@ fetchMock.mock(AVAILABLE_DB_ENDPOINT, {
       preferred: false,
       engine_information: {
         supports_file_upload: false,
+        allow_ssh_tunneling: false,
       },
     },
     {
@@ -445,6 +457,21 @@ describe('DatabaseModal', () => {
       const SQLURIHelper = screen.getByText(
         /refer to the for more information on how to structure your uri\./i,
       );
+      // <SSHTunnelForm> - Basic tab's SSH Tunnel Form
+      const SSHTunnelingToggle = screen.getByTestId('ssh-tunnel-switch');
+      userEvent.click(SSHTunnelingToggle);
+      const SSHTunnelServerAddressInput = screen.getByTestId(
+        'ssh-tunnel-server_address-input',
+      );
+      const SSHTunnelServerPortInput = screen.getByTestId(
+        'ssh-tunnel-server_port-input',
+      );
+      const SSHTunnelUsernameInput = screen.getByTestId(
+        'ssh-tunnel-username-input',
+      );
+      const SSHTunnelPasswordInput = screen.getByTestId(
+        'ssh-tunnel-password-input',
+      );
       const testConnectionButton = screen.getByRole('button', {
         name: /test connection/i,
       });
@@ -479,6 +506,11 @@ describe('DatabaseModal', () => {
         SQLURILabel,
         SQLURIInput,
         SQLURIHelper,
+        SSHTunnelingToggle,
+        SSHTunnelServerAddressInput,
+        SSHTunnelServerPortInput,
+        SSHTunnelUsernameInput,
+        SSHTunnelPasswordInput,
         testConnectionButton,
         alertIcon,
         alertMessage,
@@ -1164,6 +1196,107 @@ describe('DatabaseModal', () => {
           expect.anything();
         });
       });
+
+      describe('SSH Tunnel Form interaction', () => {
+        test('properly interacts with SSH Tunnel form textboxes', async () => {
+          userEvent.click(
+            screen.getByRole('button', {
+              name: /sqlite/i,
+            }),
+          );
+
+          expect(await screen.findByText(/step 2 of 2/i)).toBeInTheDocument();
+          const SSHTunnelingToggle = screen.getByTestId('ssh-tunnel-switch');
+          userEvent.click(SSHTunnelingToggle);
+          const SSHTunnelServerAddressInput = screen.getByTestId(
+            'ssh-tunnel-server_address-input',
+          );
+          expect(SSHTunnelServerAddressInput).toHaveValue('');
+          userEvent.type(SSHTunnelServerAddressInput, 'localhost');
+          expect(SSHTunnelServerAddressInput).toHaveValue('localhost');
+          const SSHTunnelServerPortInput = screen.getByTestId(
+            'ssh-tunnel-server_port-input',
+          );
+          expect(SSHTunnelServerPortInput).toHaveValue('');
+          userEvent.type(SSHTunnelServerPortInput, '22');
+          expect(SSHTunnelServerPortInput).toHaveValue('22');
+          const SSHTunnelUsernameInput = screen.getByTestId(
+            'ssh-tunnel-username-input',
+          );
+          expect(SSHTunnelUsernameInput).toHaveValue('');
+          userEvent.type(SSHTunnelUsernameInput, 'test');
+          expect(SSHTunnelUsernameInput).toHaveValue('test');
+          const SSHTunnelPasswordInput = screen.getByTestId(
+            'ssh-tunnel-password-input',
+          );
+          expect(SSHTunnelPasswordInput).toHaveValue('');
+          userEvent.type(SSHTunnelPasswordInput, 'pass');
+          expect(SSHTunnelPasswordInput).toHaveValue('pass');
+        });
+
+        test('if the SSH Tunneling toggle is not true, no inputs are displayed', async () => {
+          userEvent.click(
+            screen.getByRole('button', {
+              name: /sqlite/i,
+            }),
+          );
+
+          expect(await screen.findByText(/step 2 of 2/i)).toBeInTheDocument();
+          const SSHTunnelingToggle = screen.getByTestId('ssh-tunnel-switch');
+          expect(SSHTunnelingToggle).toBeVisible();
+          const SSHTunnelServerAddressInput = screen.queryByTestId(
+            'ssh-tunnel-server_address-input',
+          );
+          expect(SSHTunnelServerAddressInput).not.toBeInTheDocument();
+          const SSHTunnelServerPortInput = screen.queryByTestId(
+            'ssh-tunnel-server_port-input',
+          );
+          expect(SSHTunnelServerPortInput).not.toBeInTheDocument();
+          const SSHTunnelUsernameInput = screen.queryByTestId(
+            'ssh-tunnel-username-input',
+          );
+          expect(SSHTunnelUsernameInput).not.toBeInTheDocument();
+          const SSHTunnelPasswordInput = screen.queryByTestId(
+            'ssh-tunnel-password-input',
+          );
+          expect(SSHTunnelPasswordInput).not.toBeInTheDocument();
+        });
+
+        test('If user changes the login method, the inputs change', async () => {
+          userEvent.click(
+            screen.getByRole('button', {
+              name: /sqlite/i,
+            }),
+          );
+
+          expect(await screen.findByText(/step 2 of 2/i)).toBeInTheDocument();
+          const SSHTunnelingToggle = screen.getByTestId('ssh-tunnel-switch');
+          userEvent.click(SSHTunnelingToggle);
+          const SSHTunnelUsePasswordInput = screen.getByTestId(
+            'ssh-tunnel-use_password-radio',
+          );
+          expect(SSHTunnelUsePasswordInput).toBeVisible();
+          const SSHTunnelUsePrivateKeyInput = screen.getByTestId(
+            'ssh-tunnel-use_private_key-radio',
+          );
+          expect(SSHTunnelUsePrivateKeyInput).toBeVisible();
+          const SSHTunnelPasswordInput = screen.getByTestId(
+            'ssh-tunnel-password-input',
+          );
+          // By default, we use Password as login method
+          expect(SSHTunnelPasswordInput).toBeVisible();
+          // Change the login method to use private key
+          userEvent.click(SSHTunnelUsePrivateKeyInput);
+          const SSHTunnelPrivateKeyInput = screen.getByTestId(
+            'ssh-tunnel-private_key-input',
+          );
+          expect(SSHTunnelPrivateKeyInput).toBeVisible();
+          const SSHTunnelPrivateKeyPasswordInput = screen.getByTestId(
+            'ssh-tunnel-private_key_password-input',
+          );
+          expect(SSHTunnelPrivateKeyPasswordInput).toBeVisible();
+        });
+      });
     });
 
     describe('Dynamic form flow', () => {
@@ -1784,6 +1917,7 @@ describe('dbReducer', () => {
       payload: {
         engine_information: {
           supports_file_upload: true,
+          allow_ssh_tunneling: true,
         },
         ...db,
         driver: db.driver,
@@ -1798,6 +1932,7 @@ describe('dbReducer', () => {
       configuration_method: db.configuration_method,
       engine_information: {
         supports_file_upload: true,
+        allow_ssh_tunneling: true,
       },
       driver: db.driver,
       expose_in_sqllab: true,
@@ -1806,4 +1941,77 @@ describe('dbReducer', () => {
       name: 'PostgresDB',
     });
   });
+
+  test('it will add a SSH Tunnel config parameter', () => {
+    const action: DBReducerActionType = {
+      type: ActionType.parametersSSHTunnelChange,
+      payload: { name: 'server_address', value: '127.0.0.1' },
+    };
+    const currentState = dbReducer(databaseFixture, action);
+
+    expect(currentState).toEqual({
+      ...databaseFixture,
+      ssh_tunnel: {
+        server_address: '127.0.0.1',
+      },
+    });
+  });
+
+  test('it will add a SSH Tunnel config parameter with existing configs', () => {
+    const action: DBReducerActionType = {
+      type: ActionType.parametersSSHTunnelChange,
+      payload: { name: 'server_port', value: '22' },
+    };
+    const currentState = dbReducer(
+      {
+        ...databaseFixture,
+        ssh_tunnel: {
+          server_address: '127.0.0.1',
+        },
+      },
+      action,
+    );
+
+    expect(currentState).toEqual({
+      ...databaseFixture,
+      ssh_tunnel: {
+        server_address: '127.0.0.1',
+        server_port: '22',
+      },
+    });
+  });
+
+  test('it will change a SSH Tunnel config parameter with existing configs', () => {
+    const action: DBReducerActionType = {
+      type: ActionType.parametersSSHTunnelChange,
+      payload: { name: 'server_address', value: 'localhost' },
+    };
+    const currentState = dbReducer(
+      {
+        ...databaseFixture,
+        ssh_tunnel: {
+          server_address: '127.0.0.1',
+        },
+      },
+      action,
+    );
+
+    expect(currentState).toEqual({
+      ...databaseFixture,
+      ssh_tunnel: {
+        server_address: 'localhost',
+      },
+    });
+  });
+
+  test('it will remove the SSH Tunnel config parameters', () => {
+    const action: DBReducerActionType = {
+      type: ActionType.removeSSHTunnelConfig,
+    };
+    const currentState = dbReducer(databaseFixture, action);
+    expect(currentState).toEqual({
+      ...databaseFixture,
+      ssh_tunnel: undefined,
+    });
+  });
 });
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 095e4f0225db..fae25219cf87 100644
--- a/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
+++ b/superset-frontend/src/views/CRUD/data/database/DatabaseModal/index.tsx
@@ -88,6 +88,7 @@ import {
   StyledUploadWrapper,
 } from './styles';
 import ModalHeader, { DOCUMENTATION_LINK } from './ModalHeader';
+import SSHTunnelForm from './SSHTunnelForm';
 
 const DEFAULT_EXTRA = JSON.stringify({ allows_virtual_table_explore: true });
 
@@ -145,6 +146,14 @@ export enum ActionType {
   removeTableCatalogSheet,
   reset,
   textChange,
+  parametersSSHTunnelChange,
+  setSSHTunnelLoginMethod,
+  removeSSHTunnelConfig,
+}
+
+export enum AuthType {
+  password,
+  privateKey,
 }
 
 interface DBReducerPayloadType {
@@ -165,7 +174,8 @@ export type DBReducerActionType =
         | ActionType.queryChange
         | ActionType.inputChange
         | ActionType.editorChange
-        | ActionType.parametersChange;
+        | ActionType.parametersChange
+        | ActionType.parametersSSHTunnelChange;
       payload: DBReducerPayloadType;
     }
   | {
@@ -183,7 +193,10 @@ export type DBReducerActionType =
       };
     }
   | {
-      type: ActionType.reset | ActionType.addTableCatalogSheet;
+      type:
+        | ActionType.reset
+        | ActionType.addTableCatalogSheet
+        | ActionType.removeSSHTunnelConfig;
     }
   | {
       type: ActionType.removeTableCatalogSheet;
@@ -198,6 +211,12 @@ export type DBReducerActionType =
         engine?: string;
         configuration_method: CONFIGURATION_METHOD;
       };
+    }
+  | {
+      type: ActionType.setSSHTunnelLoginMethod;
+      payload: {
+        login_method: AuthType;
+      };
     };
 
 const StyledBtns = styled.div`
@@ -339,6 +358,42 @@ export function dbReducer(
         },
       };
 
+    case ActionType.parametersSSHTunnelChange:
+      return {
+        ...trimmedState,
+        ssh_tunnel: {
+          ...trimmedState.ssh_tunnel,
+          [action.payload.name]: action.payload.value,
+        },
+      };
+    case ActionType.setSSHTunnelLoginMethod:
+      if (action.payload.login_method === AuthType.privateKey) {
+        const { password, ...rest } = trimmedState?.ssh_tunnel ?? {};
+        return {
+          ...trimmedState,
+          ssh_tunnel: {
+            ...rest,
+          },
+        };
+      }
+      if (action.payload.login_method === AuthType.password) {
+        const { private_key, private_key_password, ...rest } =
+          trimmedState?.ssh_tunnel ?? {};
+        return {
+          ...trimmedState,
+          ssh_tunnel: {
+            ...rest,
+          },
+        };
+      }
+      return {
+        ...trimmedState,
+      };
+    case ActionType.removeSSHTunnelConfig:
+      return {
+        ...trimmedState,
+        ssh_tunnel: undefined,
+      };
     case ActionType.addTableCatalogSheet:
       if (trimmedState.catalog !== undefined) {
         return {
@@ -415,6 +470,7 @@ export function dbReducer(
         engine: action.payload.backend || trimmedState.engine,
         configuration_method: action.payload.configuration_method,
         parameters: action.payload.parameters || trimmedState.parameters,
+        ssh_tunnel: action.payload.ssh_tunnel || trimmedState.ssh_tunnel,
         query_input,
       };
 
@@ -487,6 +543,13 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
   const sslForced = isFeatureEnabled(
     FeatureFlag.FORCE_DATABASE_CONNECTIONS_SSL,
   );
+  const engineAllowsSSHTunneling = (
+    availableDbs?.databases?.find(
+      (DB: DatabaseObject) =>
+        DB.backend === db?.engine || DB.engine === db?.engine,
+    ) as DatabaseObject
+  )?.engine_information?.allow_ssh_tunneling;
+  const sshTunneling = isFeatureEnabled(FeatureFlag.SSH_TUNNELING);
   const hasAlert =
     connectionAlert || !!(db?.engine && engineSpecificAlertMapping[db.engine]);
   const useSqlAlchemyForm =
@@ -521,6 +584,7 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
       extra: db?.extra,
       masked_encrypted_extra: db?.masked_encrypted_extra || '',
       server_cert: db?.server_cert || undefined,
+      ssh_tunnel: db?.ssh_tunnel || undefined,
     };
     setTestInProgress(true);
     testDatabaseConnection(
@@ -1428,7 +1492,38 @@ const DatabaseModal: FunctionComponent<DatabaseModalProps> = ({
                 conf={conf}
                 testConnection={testConnection}
                 testInProgress={testInProgress}
-              />
+              >
+                {sshTunneling && engineAllowsSSHTunneling && (
+                  <SSHTunnelForm
+                    isEditMode={isEditMode}
+                    sshTunneling={sshTunneling}
+                    db={db as DatabaseObject}
+                    dbFetched={dbFetched as DatabaseObject}
+                    onSSHTunnelParametersChange={({
+                      target,
+                    }: {
+                      target: HTMLInputElement | HTMLTextAreaElement;
+                    }) =>
+                      onChange(ActionType.parametersSSHTunnelChange, {
+                        type: target.type,
+                        name: target.name,
+                        value: target.value,
+                      })
+                    }
+                    setSSHTunnelLoginMethod={(method: AuthType) =>
+                      setDB({
+                        type: ActionType.setSSHTunnelLoginMethod,
+                        payload: { login_method: method },
+                      })
+                    }
+                    removeSSHTunnelConfig={() =>
+                      setDB({
+                        type: ActionType.removeSSHTunnelConfig,
+                      })
+                    }
+                  />
+                )}
+              </SqlAlchemyForm>
               {isDynamic(db?.backend || db?.engine) && !isEditMode && (
                 <div css={(theme: SupersetTheme) => infoTooltip(theme)}>
                   <Button
diff --git a/superset-frontend/src/views/CRUD/data/database/types.ts b/superset-frontend/src/views/CRUD/data/database/types.ts
index 18b7eabff21d..07c828090ffc 100644
--- a/superset-frontend/src/views/CRUD/data/database/types.ts
+++ b/superset-frontend/src/views/CRUD/data/database/types.ts
@@ -26,6 +26,16 @@ export type CatalogObject = {
   value: string;
 };
 
+export type SSHTunnelObject = {
+  id?: number;
+  server_address?: string;
+  server_port?: number;
+  username?: string;
+  password?: string;
+  private_key?: string;
+  private_key_password?: string;
+};
+
 export type DatabaseObject = {
   // Connection + general
   backend?: string;
@@ -88,7 +98,11 @@ export type DatabaseObject = {
   // DB Engine Spec information
   engine_information?: {
     supports_file_upload?: boolean;
+    allow_ssh_tunneling?: boolean;
   };
+
+  // SSH Tunnel information
+  ssh_tunnel?: SSHTunnelObject;
 };
 
 export type DatabaseForm = {
@@ -139,6 +153,40 @@ export type DatabaseForm = {
     required: string[];
     type: string;
   };
+  ssh_tunnel: {
+    properties: {
+      ssh_address: {
+        description: string;
+        type: string;
+      };
+      ssh_port: {
+        description: string;
+        format: string;
+        type: string;
+      };
+      username: {
+        description: string;
+        type: string;
+      };
+      password: {
+        description: string;
+        nullable: boolean;
+        type: string;
+      };
+      private_key: {
+        description: string;
+        nullable: boolean;
+        type: string;
+      };
+      private_key_password: {
+        description: string;
+        nullable: boolean;
+        type: string;
+      };
+    };
+    required: string[];
+    type: string;
+  };
   preferred: boolean;
   sqlalchemy_uri_placeholder: string;
 };
diff --git a/superset/databases/api.py b/superset/databases/api.py
index 1c75204f7964..e04261b847a2 100644
--- a/superset/databases/api.py
+++ b/superset/databases/api.py
@@ -1150,6 +1150,9 @@ def available(self) -> Response:
                             supports_file_upload:
                               description: Whether the engine supports file uploads
                               type: boolean
+                            allow_ssh_tunneling:
+                              description: Whether the engine supports SSH Tunnels
+                              type: boolean
             400:
               $ref: '#/components/responses/400'
             500:
diff --git a/superset/databases/commands/test_connection.py b/superset/databases/commands/test_connection.py
index 8027efcb49a4..5f3affa39b90 100644
--- a/superset/databases/commands/test_connection.py
+++ b/superset/databases/commands/test_connection.py
@@ -32,6 +32,7 @@
     DatabaseTestConnectionUnexpectedError,
 )
 from superset.databases.dao import DatabaseDAO
+from superset.databases.ssh_tunnel.dao import SSHTunnelDAO
 from superset.databases.ssh_tunnel.models import SSHTunnel
 from superset.databases.utils import make_url_safe
 from superset.errors import ErrorLevel, SupersetErrorType
@@ -42,6 +43,7 @@
 )
 from superset.extensions import event_logger
 from superset.models.core import Database
+from superset.utils.ssh_tunnel import unmask_password_info
 
 logger = logging.getLogger(__name__)
 
@@ -93,6 +95,13 @@ def run(self) -> None:  # pylint: disable=too-many-statements
 
             # Generate tunnel if present in the properties
             if ssh_tunnel := self._properties.get("ssh_tunnel"):
+                # If there's an existing tunnel for that DB we need to use the stored
+                # password, private_key and private_key_password instead
+                if ssh_tunnel_id := ssh_tunnel.pop("id", None):
+                    if existing_ssh_tunnel := SSHTunnelDAO.find_by_id(ssh_tunnel_id):
+                        ssh_tunnel = unmask_password_info(
+                            ssh_tunnel, existing_ssh_tunnel
+                        )
                 ssh_tunnel = SSHTunnel(**ssh_tunnel)
 
             event_logger.log_with_context(
diff --git a/superset/databases/schemas.py b/superset/databases/schemas.py
index 1732b01ecc2a..8ad2ab706fb2 100644
--- a/superset/databases/schemas.py
+++ b/superset/databases/schemas.py
@@ -366,6 +366,7 @@ class Meta:  # pylint: disable=too-few-public-methods
 
 
 class DatabaseSSHTunnel(Schema):
+    id = fields.Integer(allow_none=True, description="SSH Tunnel ID (for updates)")
     server_address = fields.String()
     server_port = fields.Integer()
     username = fields.String()
diff --git a/superset/databases/ssh_tunnel/commands/update.py b/superset/databases/ssh_tunnel/commands/update.py
index 8d2feaf1b0d5..2ac785670540 100644
--- a/superset/databases/ssh_tunnel/commands/update.py
+++ b/superset/databases/ssh_tunnel/commands/update.py
@@ -42,7 +42,8 @@ def __init__(self, model_id: int, data: Dict[str, Any]):
     def run(self) -> Model:
         self.validate()
         try:
-            tunnel = SSHTunnelDAO.update(self._model, self._properties)
+            if self._model is not None:  # So we dont get incompatible types error
+                tunnel = SSHTunnelDAO.update(self._model, self._properties)
         except DAOUpdateFailedError as ex:
             raise SSHTunnelUpdateFailedError() from ex
         return tunnel
diff --git a/superset/databases/ssh_tunnel/dao.py b/superset/databases/ssh_tunnel/dao.py
index 924148164482..89562fc05dcc 100644
--- a/superset/databases/ssh_tunnel/dao.py
+++ b/superset/databases/ssh_tunnel/dao.py
@@ -15,12 +15,35 @@
 # specific language governing permissions and limitations
 # under the License.
 import logging
+from typing import Any, Dict
 
 from superset.dao.base import BaseDAO
 from superset.databases.ssh_tunnel.models import SSHTunnel
+from superset.utils.ssh_tunnel import unmask_password_info
 
 logger = logging.getLogger(__name__)
 
 
 class SSHTunnelDAO(BaseDAO):
     model_cls = SSHTunnel
+
+    @classmethod
+    def update(
+        cls,
+        model: SSHTunnel,
+        properties: Dict[str, Any],
+        commit: bool = True,
+    ) -> SSHTunnel:
+        """
+        Unmask ``password``, ``private_key`` and ``private_key_password`` before updating.
+
+        When a database is edited the user sees a masked version of
+        the aforementioned fields.
+
+        The masked values should be unmasked before the ssh tunnel is updated.
+        """
+        # ID cannot be updated so we remove it if present in the payload
+        properties.pop("id", None)
+        properties = unmask_password_info(properties, model)
+
+        return super().update(model, properties, commit)
diff --git a/superset/databases/ssh_tunnel/models.py b/superset/databases/ssh_tunnel/models.py
index 79e8b918d9e1..727b6ea467c6 100644
--- a/superset/databases/ssh_tunnel/models.py
+++ b/superset/databases/ssh_tunnel/models.py
@@ -23,6 +23,7 @@
 from sqlalchemy.orm import backref, relationship
 from sqlalchemy_utils import EncryptedType
 
+from superset.constants import PASSWORD_MASK
 from superset.models.core import Database
 from superset.models.helpers import (
     AuditMixinNullable,
@@ -69,8 +70,16 @@ class SSHTunnel(Model, AuditMixinNullable, ExtraJSONMixin, ImportExportMixin):
 
     @property
     def data(self) -> Dict[str, Any]:
-        return {
+        output = {
+            "id": self.id,
             "server_address": self.server_address,
             "server_port": self.server_port,
             "username": self.username,
         }
+        if self.password is not None:
+            output["password"] = PASSWORD_MASK
+        if self.private_key is not None:
+            output["private_key"] = PASSWORD_MASK
+        if self.private_key_password is not None:
+            output["private_key_password"] = PASSWORD_MASK
+        return output
diff --git a/superset/db_engine_specs/base.py b/superset/db_engine_specs/base.py
index a2a98ee6c0e1..481ef5796ad8 100644
--- a/superset/db_engine_specs/base.py
+++ b/superset/db_engine_specs/base.py
@@ -1696,9 +1696,11 @@ def get_public_information(cls) -> Dict[str, Any]:
         Construct a Dict with properties we want to expose.
 
         :returns: Dict with properties of our class like supports_file_upload
+        and allow_ssh_tunneling
         """
         return {
             "supports_file_upload": cls.supports_file_upload,
+            "allow_ssh_tunneling": cls.allow_ssh_tunneling,
         }
 
 
diff --git a/superset/utils/ssh_tunnel.py b/superset/utils/ssh_tunnel.py
index 6562a8bbb570..48ada98dccaa 100644
--- a/superset/utils/ssh_tunnel.py
+++ b/superset/utils/ssh_tunnel.py
@@ -18,6 +18,7 @@
 from typing import Any, Dict
 
 from superset.constants import PASSWORD_MASK
+from superset.databases.ssh_tunnel.models import SSHTunnel
 
 
 def mask_password_info(ssh_tunnel: Dict[str, Any]) -> Dict[str, Any]:
@@ -28,3 +29,15 @@ def mask_password_info(ssh_tunnel: Dict[str, Any]) -> Dict[str, Any]:
     if ssh_tunnel.pop("private_key_password", None) is not None:
         ssh_tunnel["private_key_password"] = PASSWORD_MASK
     return ssh_tunnel
+
+
+def unmask_password_info(
+    ssh_tunnel: Dict[str, Any], model: SSHTunnel
+) -> Dict[str, Any]:
+    if ssh_tunnel.get("password") == PASSWORD_MASK:
+        ssh_tunnel["password"] = model.password
+    if ssh_tunnel.get("private_key") == PASSWORD_MASK:
+        ssh_tunnel["private_key"] = model.private_key
+    if ssh_tunnel.get("private_key_password") == PASSWORD_MASK:
+        ssh_tunnel["private_key_password"] = model.private_key_password
+    return ssh_tunnel
diff --git a/tests/integration_tests/databases/api_tests.py b/tests/integration_tests/databases/api_tests.py
index aeb74ec91e4f..4835578dc27d 100644
--- a/tests/integration_tests/databases/api_tests.py
+++ b/tests/integration_tests/databases/api_tests.py
@@ -318,6 +318,7 @@ def test_create_database_with_ssh_tunnel(
             .filter(SSHTunnel.database_id == response.get("id"))
             .one()
         )
+        self.assertEqual(response.get("result")["ssh_tunnel"]["password"], "XXXXXXXXXX")
         self.assertEqual(model_ssh_tunnel.database_id, response.get("id"))
         # Cleanup
         model = db.session.query(Database).get(response.get("id"))
@@ -404,6 +405,7 @@ def test_update_ssh_tunnel_via_database_api(
             "server_address": "123.132.123.1",
             "server_port": 8080,
             "username": "Test",
+            "password": "new_bar",
         }
         database_data_with_ssh_tunnel = {
             "database_name": "test-db-with-ssh-tunnel",
@@ -437,6 +439,9 @@ def test_update_ssh_tunnel_via_database_api(
             .one()
         )
         self.assertEqual(model_ssh_tunnel.database_id, response_update.get("id"))
+        self.assertEqual(
+            response_update.get("result")["ssh_tunnel"]["password"], "XXXXXXXXXX"
+        )
         self.assertEqual(model_ssh_tunnel.username, "Test")
         self.assertEqual(model_ssh_tunnel.server_address, "123.132.123.1")
         self.assertEqual(model_ssh_tunnel.server_port, 8080)
@@ -2299,6 +2304,7 @@ def test_available(self, app, get_available_engine_specs):
                     "sqlalchemy_uri_placeholder": "postgresql://user:password@host:port/dbname[?key=value&key=value...]",
                     "engine_information": {
                         "supports_file_upload": True,
+                        "allow_ssh_tunneling": True,
                     },
                 },
                 {
@@ -2321,6 +2327,7 @@ def test_available(self, app, get_available_engine_specs):
                     "sqlalchemy_uri_placeholder": "bigquery://{project_id}",
                     "engine_information": {
                         "supports_file_upload": True,
+                        "allow_ssh_tunneling": False,
                     },
                 },
                 {
@@ -2372,6 +2379,7 @@ def test_available(self, app, get_available_engine_specs):
                     "sqlalchemy_uri_placeholder": "redshift+psycopg2://user:password@host:port/dbname[?key=value&key=value...]",
                     "engine_information": {
                         "supports_file_upload": True,
+                        "allow_ssh_tunneling": False,
                     },
                 },
                 {
@@ -2394,6 +2402,7 @@ def test_available(self, app, get_available_engine_specs):
                     "sqlalchemy_uri_placeholder": "gsheets://",
                     "engine_information": {
                         "supports_file_upload": False,
+                        "allow_ssh_tunneling": False,
                     },
                 },
                 {
@@ -2445,6 +2454,7 @@ def test_available(self, app, get_available_engine_specs):
                     "sqlalchemy_uri_placeholder": "mysql://user:password@host:port/dbname[?key=value&key=value...]",
                     "engine_information": {
                         "supports_file_upload": True,
+                        "allow_ssh_tunneling": False,
                     },
                 },
                 {
@@ -2454,6 +2464,7 @@ def test_available(self, app, get_available_engine_specs):
                     "preferred": False,
                     "engine_information": {
                         "supports_file_upload": True,
+                        "allow_ssh_tunneling": False,
                     },
                 },
             ]
@@ -2484,6 +2495,7 @@ def test_available_no_default(self, app, get_available_engine_specs):
                     "preferred": True,
                     "engine_information": {
                         "supports_file_upload": True,
+                        "allow_ssh_tunneling": False,
                     },
                 },
                 {
@@ -2493,6 +2505,7 @@ def test_available_no_default(self, app, get_available_engine_specs):
                     "preferred": False,
                     "engine_information": {
                         "supports_file_upload": True,
+                        "allow_ssh_tunneling": False,
                     },
                 },
             ]