chore(translations): fix translation literals

superset-frontend/src/SqlLab/components/App/index.jsx

@@ -83,12 +83,14 @@ class App extends React.PureComponent {
  this.props.actions.addDangerToast(
  t(
  "SQL Lab uses your browser's local storage to store queries and results." +
- `\n Currently, you are using ${currentUsage.toFixed(
- 2,
- )} KB out of ${LOCALSTORAGE_MAX_USAGE_KB} KB. storage space.` +
- '\n To keep SQL Lab from crashing, please delete some query tabs.' +
- '\n You can re-access these queries by using the Save feature before you delete the tab. ' +
- 'Note that you will need to close other SQL Lab windows before you do this.',
+ '\nCurrently, you are using %(currentUsage)s KB out of %(maxStorage)d KB storage space.' +
+ '\nTo keep SQL Lab from crashing, please delete some query tabs.' +
+ '\nYou can re-access these queries by using the Save feature before you delete the tab.' +
+ '\nNote that you will need to close other SQL Lab windows before you do this.',
+ {
+ currentUsage: currentUsage.toFixed(2),
+ maxStorage: LOCALSTORAGE_MAX_USAGE_KB,
+ },
  ),
  );
  }

superset-frontend/src/SqlLab/components/ResultSet/index.tsx

@@ -581,22 +581,22 @@ export default class ResultSet extends React.PureComponent<
  const isAdmin = !!this.props.user?.roles?.Admin;
  const displayMaxRowsReachedMessage = {
  withAdmin: t(
- `The number of results displayed is limited to %(rows)d by the configuration DISPLAY_MAX_ROWS. `,
+ 'The number of results displayed is limited to %(rows)d by the configuration DISPLAY_MAX_ROWS. ',
  { rows },
  ).concat(
  t(
- `Please add additional limits/filters or download to csv to see more rows up to `,
+ 'Please add additional limits/filters or download to csv to see more rows up to ',
  ),
- t(`the %(limit)d limit.`, { limit }),
+ t('the %(limit)d limit.', { limit }),
  ),
  withoutAdmin: t(
- `The number of results displayed is limited to %(rows)d. `,
+ 'The number of results displayed is limited to %(rows)d. ',
  { rows },
  ).concat(
  t(
- `Please add additional limits/filters, download to csv, or contact an admin `,
+ 'Please add additional limits/filters, download to csv, or contact an admin ',
  ),
- t(`to see more rows up to the %(limit)d limit.`, {
+ t('to see more rows up to the %(limit)d limit.', {
  limit,
  }),
  ),
@@ -609,7 +609,7 @@ export default class ResultSet extends React.PureComponent<
  limitMessage = (
  <span className="limitMessage">
  {t(
- `The number of rows displayed is limited to %(rows)d by the query`,
+ 'The number of rows displayed is limited to %(rows)d by the query',
  { rows },
  )}
  </span>
@@ -621,7 +621,7 @@ export default class ResultSet extends React.PureComponent<
  limitMessage = (
  <span className="limitMessage">
  {t(
- `The number of rows displayed is limited to %(rows)d by the limit dropdown.`,
+ 'The number of rows displayed is limited to %(rows)d by the limit dropdown.',
  { rows },
  )}
  </span>
@@ -630,7 +630,7 @@ export default class ResultSet extends React.PureComponent<
  limitMessage = (
  <span className="limitMessage">
  {t(
- `The number of rows displayed is limited to %(rows)d by the query and limit dropdown.`,
+ 'The number of rows displayed is limited to %(rows)d by the query and limit dropdown.',
  { rows },
  )}
  </span>
@@ -640,17 +640,17 @@ export default class ResultSet extends React.PureComponent<
  <ReturnedRows>
  {!limitReached && !shouldUseDefaultDropdownAlert && (
  <span>
- {t(`%(rows)d rows returned`, { rows })} {limitMessage}
+ {t('%(rows)d rows returned', { rows })} {limitMessage}
  </span>
  )}
  {!limitReached && shouldUseDefaultDropdownAlert && (
  <div ref={this.calculateAlertRefHeight}>
  <Alert
  type="warning"
- message={t(`%(rows)d rows returned`, { rows })}
+ message={t('%(rows)d rows returned', { rows })}
  onClose={this.onAlertClose}
  description={t(
- `The number of rows displayed is limited to %s by the dropdown.`,
+ 'The number of rows displayed is limited to %s by the dropdown.',
  rows,
  )}
  />
@@ -661,7 +661,7 @@ export default class ResultSet extends React.PureComponent<
  <Alert
  type="warning"
  onClose={this.onAlertClose}
- message={t(`%(rows)d rows returned`, { rows })}
+ message={t('%(rows)d rows returned', { rows })}
  description={
  isAdmin
  ? displayMaxRowsReachedMessage.withAdmin

superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.jsx

@@ -148,7 +148,9 @@ export default class SqlEditorLeftBar extends React.PureComponent {
  transform: rotate(90deg);
  `}
  aria-label="Collapse"
- tooltip={t(`${isActive ? 'Collapse' : 'Expand'} table preview`)}
+ tooltip={
+ isActive ? t('Collapse table preview') : t('Expand table preview')
+ }
  >
  <Icons.RightOutlined
  iconSize="s"

superset-frontend/src/dashboard/actions/dashboardState.js

@@ -118,8 +118,13 @@ export function savePublished(id, isPublished) {
  }),
  })
  .then(() => {
- const nowPublished = isPublished ? 'published' : 'hidden';
- dispatch(addSuccessToast(t(`This dashboard is now ${nowPublished}`)));
+ dispatch(
+ addSuccessToast(
+ isPublished
+ ? t('This dashboard is now published')
+ : t('This dashboard is now hidden'),
+ ),
+ );
  dispatch(togglePublished(isPublished));
  })
  .catch(() => {

superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx

@@ -320,7 +320,9 @@ const FilterBar: React.FC<FiltersBarProps> = ({
  activeKey={editFilterSetId ? TabIds.AllFilters : undefined}
  >
  <Tabs.TabPane
- tab={t(`All Filters (${filterValues.length})`)}
+ tab={t('All Filters (%(filterCount)d)', {
+ filterCount: filterValues.length,
+ })}
  key={TabIds.AllFilters}
  css={tabPaneStyle}
  >
@@ -340,7 +342,9 @@ const FilterBar: React.FC<FiltersBarProps> = ({
  </Tabs.TabPane>
  <Tabs.TabPane
  disabled={!!editFilterSetId}
- tab={t(`Filter Sets (${filterSetFilterValues.length})`)}
+ tab={t('Filter Sets (%(filterSetCount)d)', {
+ filterSetCount: filterSetFilterValues.length,
+ })}
  key={TabIds.FilterSets}
  css={tabPaneStyle}
  >

superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/FiltersConfigForm/getControlItemsMap.tsx

@@ -106,7 +106,7 @@ export default function getControlItemsMap({
  initialValue={initColumn}
  label={
  <StyledLabel>
- {t(`${mainControlItem.config?.label}`) || t('Column')}
+ {mainControlItem.config?.label || t('Column')}
  </StyledLabel>
  }
  rules={[

superset-frontend/src/views/CRUD/alert/AlertList.tsx

@@ -50,6 +50,14 @@ import { AlertObject, AlertState } from './types';
 
 const PAGE_SIZE = 25;
 
+const AlertStateLabel: Record<AlertState, string> = {
+ [AlertState.Success]: t('Success'),
+ [AlertState.Working]: t('Working'),
+ [AlertState.Error]: t('Error'),
+ [AlertState.Noop]: t('Not triggered'),
+ [AlertState.Grace]: t('On Grace'),
+};
+
 interface AlertListProps {
  addDangerToast: (msg: string) => void;
  addSuccessToast: (msg: string) => void;
@@ -394,11 +402,17 @@ function AlertList({
  operator: FilterOperator.equals,
  unfilteredLabel: 'Any',
  selects: [
- { label: t(`${AlertState.success}`), value: AlertState.success },
- { label: t(`${AlertState.working}`), value: AlertState.working },
- { label: t(`${AlertState.error}`), value: AlertState.error },
- { label: t(`${AlertState.noop}`), value: AlertState.noop },
- { label: t(`${AlertState.grace}`), value: AlertState.grace },
+ {
+ label: AlertStateLabel[AlertState.Success],
+ value: AlertState.Success,
+ },
+ {
+ label: AlertStateLabel[AlertState.Working],
+ value: AlertState.Working,
+ },
+ { label: AlertStateLabel[AlertState.Error], value: AlertState.Error },
+ { label: AlertStateLabel[AlertState.Noop], value: AlertState.Noop },
+ { label: AlertStateLabel[AlertState.Grace], value: AlertState.Grace },
  ],
  },
  {

superset-frontend/src/views/CRUD/alert/AlertReportModal.tsx

@@ -1047,9 +1047,13 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
  ) : (
  <Icons.PlusLarge css={StyledIcon} />
  )}
- {isEditMode
- ? t(`Edit ${isReport ? 'Report' : 'Alert'}`)
- : t(`Add ${isReport ? 'Report' : 'Alert'}`)}
+ {isEditMode && isReport
+ ? t('Edit Report')
+ : isEditMode
+ ? t('Edit Alert')
+ : isReport
+ ? 'Add Report'
+ : 'Add Alert'}
  </h4>
  }
  >

superset-frontend/src/views/CRUD/alert/ExecutionLog.tsx

@@ -153,7 +153,7 @@ function ExecutionLog({ addDangerToast, isReportEnabled }: ExecutionLogProps) {
  name={
  <StyledHeader>
  <span>
- {t(`${alertResource?.type}`)} {alertResource?.name}
+ {alertResource?.type} {alertResource?.name}
  </span>
  <span>
  <Link to={path}>Back to all</Link>

superset-frontend/src/views/CRUD/alert/components/AlertStatusIcon.tsx

@@ -28,17 +28,17 @@ function getStatusColor(
  theme: typeof supersetTheme,
 ) {
  switch (status) {
- case AlertState.working:
+ case AlertState.Working:
  return theme.colors.primary.base;
- case AlertState.error:
+ case AlertState.Error:
  return theme.colors.error.base;
- case AlertState.success:
+ case AlertState.Success:
  return isReportEnabled
  ? theme.colors.success.base
  : theme.colors.alert.base;
- case AlertState.noop:
+ case AlertState.Noop:
  return theme.colors.success.base;
- case AlertState.grace:
+ case AlertState.Grace:
  return theme.colors.alert.base;
  default:
  return theme.colors.grayscale.base;
@@ -59,43 +59,43 @@ export default function AlertStatusIcon({
  status: '',
  };
  switch (state) {
- case AlertState.success:
+ case AlertState.Success:
  lastStateConfig.icon = isReportEnabled
  ? Icons.Check
  : Icons.AlertSolidSmall;
  lastStateConfig.label = isReportEnabled
  ? t('Report sent')
  : t('Alert triggered, notification sent');
- lastStateConfig.status = AlertState.success;
+ lastStateConfig.status = AlertState.Success;
  break;
- case AlertState.working:
+ case AlertState.Working:
  lastStateConfig.icon = Icons.Running;
  lastStateConfig.label = isReportEnabled
  ? t('Report sending')
  : t('Alert running');
- lastStateConfig.status = AlertState.working;
+ lastStateConfig.status = AlertState.Working;
  break;
- case AlertState.error:
+ case AlertState.Error:
  lastStateConfig.icon = Icons.XSmall;
  lastStateConfig.label = isReportEnabled
  ? t('Report failed')
  : t('Alert failed');
- lastStateConfig.status = AlertState.error;
+ lastStateConfig.status = AlertState.Error;
  break;
- case AlertState.noop:
+ case AlertState.Noop:
  lastStateConfig.icon = Icons.Check;
  lastStateConfig.label = t('Nothing triggered');
- lastStateConfig.status = AlertState.noop;
+ lastStateConfig.status = AlertState.Noop;
  break;
- case AlertState.grace:
+ case AlertState.Grace:
  lastStateConfig.icon = Icons.AlertSolidSmall;
  lastStateConfig.label = t('Alert Triggered, In Grace Period');
- lastStateConfig.status = AlertState.grace;
+ lastStateConfig.status = AlertState.Grace;
  break;
  default:
  lastStateConfig.icon = Icons.Check;
  lastStateConfig.label = t('Nothing triggered');
- lastStateConfig.status = AlertState.noop;
+ lastStateConfig.status = AlertState.Noop;
  }
  const Icon = lastStateConfig.icon;
  return (

superset-frontend/src/views/CRUD/alert/components/RecipientIcon.tsx

@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { t, SupersetTheme, css } from '@superset-ui/core';
+import { SupersetTheme, css } from '@superset-ui/core';
 import React, { ReactElement } from 'react';
 import { Tooltip } from 'src/components/Tooltip';
 import Icons from 'src/components/Icons';
@@ -33,13 +33,13 @@ export default function RecipientIcon({ type }: { type: string }) {
  label: '',
  };
  switch (type) {
- case RecipientIconName.email:
+ case RecipientIconName.Email:
  recipientIconConfig.icon = <Icons.Email css={StyledIcon} />;
- recipientIconConfig.label = t(`${RecipientIconName.email}`);
+ recipientIconConfig.label = RecipientIconName.Email;
  break;
- case RecipientIconName.slack:
+ case RecipientIconName.Slack:
  recipientIconConfig.icon = <Icons.Slack css={StyledIcon} />;
- recipientIconConfig.label = t(`${RecipientIconName.slack}`);
+ recipientIconConfig.label = RecipientIconName.Slack;
  break;
  default:
  recipientIconConfig.icon = null;

superset-frontend/src/views/CRUD/alert/types.ts

@@ -100,14 +100,14 @@ export type LogObject = {
 };
 
 export enum AlertState {
- success = 'Success',
- working = 'Working',
- error = 'Error',
- noop = 'Not triggered',
- grace = 'On Grace',
+ Success = 'Success',
+ Working = 'Working',
+ Error = 'Error',
+ Noop = 'Not triggered',
+ Grace = 'On Grace',
 }
 
 export enum RecipientIconName {
- email = 'Email',
- slack = 'Slack',
+ Email = 'Email',
+ Slack = 'Slack',
 }

superset-frontend/src/views/CRUD/hooks.ts

@@ -623,7 +623,7 @@ export const testDatabaseConnection = (
  addSuccessToast(t('Connection looks good!'));
  },
  createErrorHandler((errMsg: Record<string, string[] | string> | string) => {
- handleErrorMsg(t(`${t('ERROR: ')}${parsedErrorMessage(errMsg)}`));
+ handleErrorMsg(t('ERROR: %s', parsedErrorMessage(errMsg)));
  }),
  );
 };

superset-frontend/src/views/CRUD/welcome/EmptyState.tsx

@@ -57,11 +57,11 @@ export default function EmptyState({ tableName, tab }: EmptyStateProps) {
  SAVED_QUERIES: 'empty-queries.svg',
  };
  const mine = (
- <span>{`No ${
- tableName === 'SAVED_QUERIES'
- ? t('saved queries')
- : t(`${tableName.toLowerCase()}`)
- } yet`}</span>
+ <span>
+ {tableName === 'SAVED_QUERIES'
+ ? t('No saved queries yet')
+ : t('No %(tableName)s yet', { tableName: tableName.toLowerCase() })}
+ </span>
  );
  const recent = (
  <span className="no-recents">
@@ -77,7 +77,9 @@ export default function EmptyState({ tableName, tab }: EmptyStateProps) {
  );
  }
  if (tab === 'Examples') {
- return t(`Example ${tableName.toLowerCase()} will appear here`);
+ return t('Example %(tableName)s will appear here', {
+ tableName: tableName.toLowerCase(),
+ });
  }
  if (tab === 'Edited') {
  return t(