chore: Localization of several charts and elements (#22150)

Co-authored-by: ashumeiko <ashumeiko@ashumeiko.com>

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;

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>

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>

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>

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"

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>

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}