Rich history drawer: Translation added (#77088)

* query history translation added

* Recommended changes added

public/app/core/utils/richHistory.ts

@@ -5,6 +5,7 @@ import { serializeStateToUrlParam } from '@grafana/data/src/utils/url';
 import { getDataSourceSrv } from '@grafana/runtime';
 import { notifyApp } from 'app/core/actions';
 import { createErrorNotification, createWarningNotification } from 'app/core/copy/appNotification';
+import { t } from 'app/core/internationalization';
 import { dispatch } from 'app/store/store';
 import { RichHistoryQuery } from 'app/types/explore';
 
@@ -57,7 +58,14 @@ export async function addToRichHistory(
           richHistoryStorageFull = true;
           showQuotaExceededError && dispatch(notifyApp(createErrorNotification(error.message)));
         } else if (error.name !== RichHistoryServiceError.DuplicatedEntry) {
-          dispatch(notifyApp(createErrorNotification('Rich History update failed', error.message)));
+          dispatch(
+            notifyApp(
+              createErrorNotification(
+                t('explore.rich-history-utils-notification.update-failed', 'Rich History update failed'),
+                error.message
+              )
+            )
+          );
         }
       }
       // Saving failed. Do not add new entry.
@@ -98,7 +106,14 @@ export async function updateStarredInRichHistory(id: string, starred: boolean) {
     return await getRichHistoryStorage().updateStarred(id, starred);
   } catch (error) {
     if (error instanceof Error) {
-      dispatch(notifyApp(createErrorNotification('Saving rich history failed', error.message)));
+      dispatch(
+        notifyApp(
+          createErrorNotification(
+            t('explore.rich-history-utils-notification.saving-failed', 'Saving rich history failed'),
+            error.message
+          )
+        )
+      );
     }
     return undefined;
   }
@@ -109,7 +124,14 @@ export async function updateCommentInRichHistory(id: string, newComment: string
     return await getRichHistoryStorage().updateComment(id, newComment);
   } catch (error) {
     if (error instanceof Error) {
-      dispatch(notifyApp(createErrorNotification('Saving rich history failed', error.message)));
+      dispatch(
+        notifyApp(
+          createErrorNotification(
+            t('explore.rich-history-utils-notification.saving-failed', 'Saving rich history failed'),
+            error.message
+          )
+        )
+      );
     }
     return undefined;
   }
@@ -121,7 +143,14 @@ export async function deleteQueryInRichHistory(id: string) {
     return id;
   } catch (error) {
     if (error instanceof Error) {
-      dispatch(notifyApp(createErrorNotification('Saving rich history failed', error.message)));
+      dispatch(
+        notifyApp(
+          createErrorNotification(
+            t('explore.rich-history-utils-notification.saving-failed', 'Saving rich history failed'),
+            error.message
+          )
+        )
+      );
     }
     return undefined;
   }
@@ -130,7 +159,10 @@ export async function deleteQueryInRichHistory(id: string) {
 export const createUrlFromRichHistory = (query: RichHistoryQuery) => {
   const exploreState: ExploreUrlState = {
     /* Default range, as we are not saving timerange in rich history */
-    range: { from: 'now-1h', to: 'now' },
+    range: {
+      from: t('explore.rich-history-utils.default-from', 'now-1h'),
+      to: t('explore.rich-history-utils.default-to', 'now'),
+    },
     datasource: query.datasourceName,
     queries: query.queries,
   };
@@ -146,19 +178,19 @@ export const mapNumbertoTimeInSlider = (num: number) => {
   let str;
   switch (num) {
     case 0:
-      str = 'today';
+      str = t('explore.rich-history-utils.today', 'today');
       break;
     case 1:
-      str = 'yesterday';
+      str = t('explore.rich-history-utils.yesterday', 'yesterday');
       break;
     case 7:
-      str = 'a week ago';
+      str = t('explore.rich-history-utils.a-week-ago', 'a week ago');
       break;
     case 14:
-      str = 'two weeks ago';
+      str = t('explore.rich-history-utils.two-weeks-ago', 'two weeks ago');
       break;
     default:
-      str = `${num} days ago`;
+      str = t('explore.rich-history-utils.days-ago', '{{num}} days ago', { num: `${num}` });
   }
 
   return str;

public/app/features/explore/RichHistory/RichHistory.tsx

@@ -3,6 +3,7 @@ import React, { PureComponent } from 'react';
 
 import { SelectableValue } from '@grafana/data';
 import { Themeable2, TabbedContainer, TabConfig, withTheme2 } from '@grafana/ui';
+import { t } from 'app/core/internationalization';
 import { SortOrder, RichHistorySearchFilters, RichHistorySettings } from 'app/core/utils/richHistory';
 import { RichHistoryQuery } from 'app/types/explore';
 
@@ -20,10 +21,10 @@ export enum Tabs {
 
 export const getSortOrderOptions = () =>
   [
-    { label: 'Newest first', value: SortOrder.Descending },
+    { label: t('explore.rich-history.newest-first', 'Newest first'), value: SortOrder.Descending },
-    { label: 'Oldest first', value: SortOrder.Ascending },
+    { label: t('explore.rich-history.oldest-first', 'Oldest first'), value: SortOrder.Ascending },
-    { label: 'Data source A-Z', value: SortOrder.DatasourceAZ },
+    { label: t('explore.rich-history.datasource-a-z', 'Data source A-Z'), value: SortOrder.DatasourceAZ },
-    { label: 'Data source Z-A', value: SortOrder.DatasourceZA },
+    { label: t('explore.rich-history.datasource-z-a', 'Data source Z-A'), value: SortOrder.DatasourceZA },
   ].filter((option) => supportedFeatures().availableFilters.includes(option.value));
 
 export interface RichHistoryProps extends Themeable2 {
@@ -112,7 +113,7 @@ class UnThemedRichHistory extends PureComponent<RichHistoryProps> {
     const { loading } = this.state;
 
     const QueriesTab: TabConfig = {
-      label: 'Query history',
+      label: t('explore.rich-history.query-history', 'Query history'),
       value: Tabs.RichHistory,
       content: (
         <RichHistoryQueriesTab
@@ -133,7 +134,7 @@ class UnThemedRichHistory extends PureComponent<RichHistoryProps> {
     };
 
     const StarredTab: TabConfig = {
-      label: 'Starred',
+      label: t('explore.rich-history.starred', 'Starred'),
       value: Tabs.Starred,
       content: (
         <RichHistoryStarredTab
@@ -153,7 +154,7 @@ class UnThemedRichHistory extends PureComponent<RichHistoryProps> {
     };
 
     const SettingsTab: TabConfig = {
-      label: 'Settings',
+      label: t('explore.rich-history.settings', 'Settings'),
       value: Tabs.Settings,
       content: (
         <RichHistorySettingsTab
@@ -171,7 +172,12 @@ class UnThemedRichHistory extends PureComponent<RichHistoryProps> {
 
     let tabs = [QueriesTab, StarredTab, SettingsTab];
     return (
-      <TabbedContainer tabs={tabs} onClose={onClose} defaultTab={firstTab} closeIconTooltip="Close query history" />
+      <TabbedContainer
+        tabs={tabs}
+        onClose={onClose}
+        defaultTab={firstTab}
+        closeIconTooltip={t('explore.rich-history.close-tooltip', 'Close query history')}
+      />
     );
   }
 }

public/app/features/explore/RichHistory/RichHistoryCard.tsx

@@ -9,6 +9,7 @@ import { DataQuery } from '@grafana/schema';
 import { TextArea, Button, IconButton, useStyles2, LoadingPlaceholder } from '@grafana/ui';
 import { notifyApp } from 'app/core/actions';
 import { createSuccessNotification } from 'app/core/copy/appNotification';
+import { Trans, t } from 'app/core/internationalization';
 import { copyStringToClipboard } from 'app/core/utils/explore';
 import { createUrlFromRichHistory, createQueryText } from 'app/core/utils/richHistory';
 import { createAndCopyShortLink } from 'app/core/utils/shortLinks';
@@ -214,7 +215,11 @@ export function RichHistoryCard(props: Props) {
       .join('\n');
 
     copyStringToClipboard(queriesText);
-    dispatch(notifyApp(createSuccessNotification('Query copied to clipboard')));
+    dispatch(
+      notifyApp(
+        createSuccessNotification(t('explore.rich-history-notification.query-copied', 'Query copied to clipboard'))
+      )
+    );
   };
 
   const onCreateShortLink = async () => {
@@ -225,7 +230,9 @@ export function RichHistoryCard(props: Props) {
   const onDeleteQuery = () => {
     const performDelete = (queryId: string) => {
       deleteHistoryItem(queryId);
-      dispatch(notifyApp(createSuccessNotification('Query deleted')));
+      dispatch(
+        notifyApp(createSuccessNotification(t('explore.rich-history-notification.query-deleted', 'Query deleted')))
+      );
       reportInteraction('grafana_explore_query_history_deleted', {
         queryHistoryEnabled: config.queryHistoryEnabled,
       });
@@ -235,9 +242,12 @@ export function RichHistoryCard(props: Props) {
     if (query.starred) {
       getAppEvents().publish(
         new ShowConfirmModalEvent({
-          title: 'Delete',
+          title: t('explore.rich-history-card.delete-query-confirmation-title', 'Delete'),
-          text: 'Are you sure you want to permanently delete your starred query?',
+          text: t(
-          yesText: 'Delete',
+            'explore.rich-history-card.delete-starred-query-confirmation-text',
+            'Are you sure you want to permanently delete your starred query?'
+          ),
+          yesText: t('explore.rich-history-card.confirm-delete', 'Delete'),
           icon: 'trash-alt',
           onConfirm: () => performDelete(query.id),
         })
@@ -281,18 +291,31 @@ export function RichHistoryCard(props: Props) {
   };
 
   const updateComment = (
-    <div className={styles.updateCommentContainer} aria-label={comment ? 'Update comment form' : 'Add comment form'}>
+    <div
+      className={styles.updateCommentContainer}
+      aria-label={
+        comment
+          ? t('explore.rich-history-card.update-comment-form', 'Update comment form')
+          : t('explore.rich-history-card.add-comment-form', 'Add comment form')
+      }
+    >
       <TextArea
         onKeyDown={onKeyDown}
         value={comment}
-        placeholder={comment ? undefined : 'An optional description of what the query does.'}
+        placeholder={
+          comment
+            ? undefined
+            : t('explore.rich-history-card.optional-description', 'An optional description of what the query does.')
+        }
         onChange={(e) => setComment(e.currentTarget.value)}
         className={styles.textArea}
       />
       <div className={styles.commentButtonRow}>
-        <Button onClick={onUpdateComment}>Save comment</Button>
+        <Button onClick={onUpdateComment}>
+          <Trans i18nKey="explore.rich-history-card.save-comment">Save comment</Trans>
+        </Button>
         <Button variant="secondary" onClick={onCancelUpdateComment}>
-          Cancel
+          <Trans i18nKey="explore.rich-history-card.cancel">Cancel</Trans>
         </Button>
       </div>
     </div>
@@ -303,18 +326,43 @@ export function RichHistoryCard(props: Props) {
       <IconButton
         name="comment-alt"
         onClick={toggleActiveUpdateComment}
-        tooltip={query.comment?.length > 0 ? 'Edit comment' : 'Add comment'}
+        tooltip={
+          query.comment?.length > 0
+            ? t('explore.rich-history-card.edit-comment-tooltip', 'Edit comment')
+            : t('explore.rich-history-card.add-comment-tooltip', 'Add comment')
+        }
+      />
+      <IconButton
+        name="copy"
+        onClick={onCopyQuery}
+        tooltip={t('explore.rich-history-card.copy-query-tooltip', 'Copy query to clipboard')}
       />
-      <IconButton name="copy" onClick={onCopyQuery} tooltip="Copy query to clipboard" />
       {value?.dsInstance && (
-        <IconButton name="share-alt" onClick={onCreateShortLink} tooltip="Copy shortened link to clipboard" />
+        <IconButton
+          name="share-alt"
+          onClick={onCreateShortLink}
+          tooltip={
+            <Trans i18nKey="explore.rich-history-card.copy-shortened-link-tooltip">
+              Copy shortened link to clipboard
+            </Trans>
+          }
+        />
       )}
-      <IconButton name="trash-alt" title="Delete query" tooltip="Delete query" onClick={onDeleteQuery} />
+      <IconButton
+        name="trash-alt"
+        title={t('explore.rich-history-card.delete-query-title', 'Delete query')}
+        tooltip={t('explore.rich-history-card.delete-query-tooltip', 'Delete query')}
+        onClick={onDeleteQuery}
+      />
       <IconButton
         name={query.starred ? 'favorite' : 'star'}
         iconType={query.starred ? 'mono' : 'default'}
         onClick={onStarrQuery}
-        tooltip={query.starred ? 'Unstar query' : 'Star query'}
+        tooltip={
+          query.starred
+            ? t('explore.rich-history-card.unstar-query-tooltip', 'Unstar query')
+            : t('explore.rich-history-card.star-query-tooltip', 'Star query')
+        }
       />
     </div>
   );
@@ -332,7 +380,10 @@ export function RichHistoryCard(props: Props) {
             return <Query query={q} key={`${q}-${i}`} showDsInfo={value?.dsInstance?.meta.mixed} />;
           })}
           {!activeUpdateComment && query.comment && (
-            <div aria-label="Query comment" className={styles.comment}>
+            <div
+              aria-label={t('explore.rich-history-card.query-comment-label', 'Query comment')}
+              className={styles.comment}
+            >
               {query.comment}
             </div>
           )}
@@ -345,12 +396,23 @@ export function RichHistoryCard(props: Props) {
               onClick={onRunQuery}
               disabled={!value?.dsInstance || value.queries.some((query) => !query.datasource)}
             >
-              {datasourceInstance?.uid === query.datasourceUid ? 'Run query' : 'Switch data source and run query'}
+              {datasourceInstance?.uid === query.datasourceUid ? (
+                <Trans i18nKey="explore.rich-history-card.run-query-button">Run query</Trans>
+              ) : (
+                <Trans i18nKey="explore.rich-history-card.switch-datasource-button">
+                  Switch data source and run query
+                </Trans>
+              )}
             </Button>
           </div>
         )}
       </div>
-      {loading && <LoadingPlaceholder text="loading..." className={styles.loader} />}
+      {loading && (
+        <LoadingPlaceholder
+          text={t('explore.rich-history-card.loading-text', 'loading...')}
+          className={styles.loader}
+        />
+      )}
     </div>
   );
 }
@@ -395,7 +457,7 @@ const Query = ({ query, showDsInfo = false }: QueryProps) => {
           {': '}
         </div>
       )}
-      <span aria-label="Query text" className={styles.queryText}>
+      <span aria-label={t('explore.rich-history-card.query-text-label', 'Query text')} className={styles.queryText}>
         {createQueryText(query.query, query.datasource)}
       </span>
     </div>
@@ -418,10 +480,12 @@ function DatasourceInfo({ dsApi, size }: { dsApi?: DataSourceApi; size: 'sm' | '
     <div className={styles}>
       <img
         src={dsApi?.meta.info.logos.small || 'public/img/icn-datasource.svg'}
-        alt={dsApi?.type || 'Data source does not exist anymore'}
+        alt={dsApi?.type || t('explore.rich-history-card.datasource-not-exist', 'Data source does not exist anymore')}
-        aria-label="Data source icon"
+        aria-label={t('explore.rich-history-card.datasource-icon-label', 'Data source icon')}
       />
-      <div aria-label="Data source name">{dsApi?.name || 'Data source does not exist anymore'}</div>
+      <div aria-label={t('explore.rich-history-card.datasource-name-label', 'Data source name')}>
+        {dsApi?.name || t('explore.rich-history-card.datasource-not-exist', 'Data source does not exist anymore')}
+      </div>
     </div>
   );
 }

public/app/features/explore/RichHistory/RichHistoryContainer.tsx

@@ -4,6 +4,7 @@ import { connect, ConnectedProps } from 'react-redux';
 
 import { config, reportInteraction } from '@grafana/runtime';
 import { useTheme2 } from '@grafana/ui';
+import { Trans } from 'app/core/internationalization';
 // Types
 import { ExploreItemState, StoreState } from 'app/types';
 
@@ -91,7 +92,11 @@ export function RichHistoryContainer(props: Props) {
   }, [initRichHistory]);
 
   if (!richHistorySettings) {
-    return <span>Loading...</span>;
+    return (
+      <span>
+        <Trans i18nKey="explore.rich-history-container.loading">Loading...</Trans>
+      </span>
+    );
   }
 
   return (

public/app/features/explore/RichHistory/RichHistoryQueriesTab.tsx

@@ -4,6 +4,7 @@ import React, { useEffect } from 'react';
 import { GrafanaTheme2, SelectableValue } from '@grafana/data';
 import { config } from '@grafana/runtime';
 import { Button, FilterInput, MultiSelect, RangeSlider, Select, useStyles2 } from '@grafana/ui';
+import { Trans, t } from 'app/core/internationalization';
 import {
   createDatasourcesList,
   mapNumbertoTimeInSlider,
@@ -152,7 +153,11 @@ export function RichHistoryQueriesTab(props: RichHistoryQueriesTabProps) {
   }, []);
 
   if (!richHistorySearchFilters) {
-    return <span>Loading...</span>;
+    return (
+      <span>
+        <Trans i18nKey="explore.rich-history-queries-tab.loading">Loading...</Trans>;
+      </span>
+    );
   }
 
   /* mappedQueriesToHeadings is an object where query headings (stringified dates/data sources)
@@ -166,7 +171,9 @@ export function RichHistoryQueriesTab(props: RichHistoryQueriesTabProps) {
     <div className={styles.container}>
       <div className={styles.containerSlider}>
         <div className={styles.fixedSlider}>
-          <div className={styles.labelSlider}>Filter history</div>
+          <div className={styles.labelSlider}>
+            <Trans i18nKey="explore.rich-history-queries-tab.filter-history">Filter history</Trans>
+          </div>
           <div className={styles.labelSlider}>{mapNumbertoTimeInSlider(richHistorySearchFilters.from)}</div>
           <div className={styles.slider}>
             <RangeSlider
@@ -195,8 +202,11 @@ export function RichHistoryQueriesTab(props: RichHistoryQueriesTabProps) {
                 return { value: ds.name, label: ds.name };
               })}
               value={richHistorySearchFilters.datasourceFilters}
-              placeholder="Filter queries for data sources(s)"
+              placeholder={t(
-              aria-label="Filter queries for data sources(s)"
+                'explore.rich-history-queries-tab.filter-placeholder',
+                'Filter queries for data sources(s)'
+              )}
+              aria-label={t('explore.rich-history-queries-tab.filter-aria-label', 'Filter queries for data sources(s)')}
               onChange={(options: SelectableValue[]) => {
                 updateFilters({ datasourceFilters: options.map((option) => option.value) });
               }}
@@ -205,22 +215,29 @@ export function RichHistoryQueriesTab(props: RichHistoryQueriesTabProps) {
           <div className={styles.filterInput}>
             <FilterInput
               escapeRegex={false}
-              placeholder="Search queries"
+              placeholder={t('explore.rich-history-queries-tab.search-placeholder', 'Search queries')}
               value={richHistorySearchFilters.search}
               onChange={(search: string) => updateFilters({ search })}
             />
           </div>
-          <div aria-label="Sort queries" className={styles.sort}>
+          <div
+            aria-label={t('explore.rich-history-queries-tab.sort-aria-label', 'Sort queries')}
+            className={styles.sort}
+          >
             <Select
               value={sortOrderOptions.filter((order) => order.value === richHistorySearchFilters.sortOrder)}
               options={sortOrderOptions}
-              placeholder="Sort queries by"
+              placeholder={t('explore.rich-history-queries-tab.sort-placeholder', 'Sort queries by')}
               onChange={(e: SelectableValue<SortOrder>) => updateFilters({ sortOrder: e.value })}
             />
           </div>
         </div>
 
-        {loading && <span>Loading results...</span>}
+        {loading && (
+          <span>
+            <Trans i18nKey="explore.rich-history-queries-tab.loading-results">Loading results...</Trans>
+          </span>
+        )}
 
         {!loading &&
           Object.keys(mappedQueriesToHeadings).map((heading) => {
@@ -229,8 +246,19 @@ export function RichHistoryQueriesTab(props: RichHistoryQueriesTabProps) {
                 <div className={styles.heading}>
                   {heading}{' '}
                   <span className={styles.queries}>
-                    {partialResults ? 'Displaying ' : ''}
+                    {partialResults ? (
-                    {mappedQueriesToHeadings[heading].length} queries
+                      <Trans
+                        i18nKey="explore.rich-history-queries-tab.displaying-partial-queries"
+                        defaults="Displaying {{ count }} queries"
+                        values={{ count: mappedQueriesToHeadings[heading].length }}
+                      />
+                    ) : (
+                      <Trans
+                        i18nKey="explore.rich-history-queries-tab.displaying-queries"
+                        defaults="{{ count }} queries"
+                        values={{ count: mappedQueriesToHeadings[heading].length }}
+                      />
+                    )}
                   </span>
                 </div>
                 {mappedQueriesToHeadings[heading].map((q) => {
@@ -241,11 +269,25 @@ export function RichHistoryQueriesTab(props: RichHistoryQueriesTabProps) {
           })}
         {partialResults ? (
           <div>
-            Showing {queries.length} of {totalQueries} <Button onClick={loadMoreRichHistory}>Load more</Button>
+            <Trans
+              i18nKey="explore.rich-history-queries-tab.showing-queries"
+              defaults="Showing {{ shown }} of {{ total }} <0>Load more</0>"
+              values={{ shown: queries.length, total: totalQueries }}
+              components={[
+                <Button onClick={loadMoreRichHistory} key="loadMoreButton">
+                  Load more
+                </Button>,
+              ]}
+            />
           </div>
         ) : null}
         <div className={styles.footer}>
-          {!config.queryHistoryEnabled ? 'The history is local to your browser and is not shared with others.' : ''}
+          {!config.queryHistoryEnabled
+            ? t(
+                'explore.rich-history-queries-tab.history-local',
+                'The history is local to your browser and is not shared with others.'
+              )
+            : ''}
         </div>
       </div>
     </div>

public/app/features/explore/RichHistory/RichHistorySettingsTab.tsx

@@ -7,6 +7,7 @@ import { useStyles2, Select, Button, Field, InlineField, InlineSwitch, Alert } f
 import { notifyApp } from 'app/core/actions';
 import { createSuccessNotification } from 'app/core/copy/appNotification';
 import { MAX_HISTORY_ITEMS } from 'app/core/history/RichHistoryLocalStorage';
+import { Trans, t } from 'app/core/internationalization';
 import { dispatch } from 'app/store/store';
 
 import { supportedFeatures } from '../../../core/history/richHistoryStorageProvider';
@@ -43,10 +44,10 @@ const getStyles = (theme: GrafanaTheme2) => {
 };
 
 const retentionPeriodOptions = [
-  { value: 2, label: '2 days' },
+  { value: 2, label: t('explore.rich-history-settings-tab.retention-period.2-days', '2 days') },
-  { value: 5, label: '5 days' },
+  { value: 5, label: t('explore.rich-history-settings-tab.retention-period.5-days', '5 days') },
-  { value: 7, label: '1 week' },
+  { value: 7, label: t('explore.rich-history-settings-tab.retention-period.1-week', '1 week') },
-  { value: 14, label: '2 weeks' },
+  { value: 14, label: t('explore.rich-history-settings-tab.retention-period.2-weeks', '2 weeks') },
 ];
 
 export function RichHistorySettingsTab(props: RichHistorySettingsProps) {
@@ -65,13 +66,22 @@ export function RichHistorySettingsTab(props: RichHistorySettingsProps) {
   const onDelete = () => {
     getAppEvents().publish(
       new ShowConfirmModalEvent({
-        title: 'Delete',
+        title: t('explore.rich-history-settings-tab.delete-title', 'Delete'),
-        text: 'Are you sure you want to permanently delete your query history?',
+        text: t(
-        yesText: 'Delete',
+          'explore.rich-history-settings-tab.delete-confirm-text',
+          'Are you sure you want to permanently delete your query history?'
+        ),
+        yesText: t('explore.rich-history-settings-tab.delete-confirm', 'Delete'),
         icon: 'trash-alt',
         onConfirm: () => {
           deleteRichHistory();
-          dispatch(notifyApp(createSuccessNotification('Query history deleted')));
+          dispatch(
+            notifyApp(
+              createSuccessNotification(
+                t('explore.rich-history-settings-tab.query-history-deleted', 'Query history deleted')
+              )
+            )
+          );
         },
       })
     );
@@ -81,20 +91,33 @@ export function RichHistorySettingsTab(props: RichHistorySettingsProps) {
     <div className={styles.container}>
       {supportedFeatures().changeRetention ? (
         <Field
-          label="History time span"
+          label={t('explore.rich-history-settings-tab.history-time-span', 'History time span')}
-          description={`Select the period of time for which Grafana will save your query history. Up to ${MAX_HISTORY_ITEMS} entries will be stored.`}
+          description={t(
+            'explore.rich-history-settings-tab.history-time-span-description',
+            'Select the period of time for which Grafana will save your query history. Up to {{MAX_HISTORY_ITEMS}} entries will be stored.',
+            { MAX_HISTORY_ITEMS }
+          )}
         >
           <div className={styles.input}>
             <Select value={selectedOption} options={retentionPeriodOptions} onChange={onChangeRetentionPeriod}></Select>
           </div>
         </Field>
       ) : (
-        <Alert severity="info" title="History time span">
+        <Alert severity="info" title={t('explore.rich-history-settings-tab.history-time-span', 'History time span')}>
-          Grafana will keep entries up to {selectedOption?.label}. Starred entries won&apos;t be deleted.
+          {t(
+            'explore.rich-history-settings-tab.alert-info',
+            "Grafana will keep entries up to {{optionLabel}}.Starred entries won't be deleted.",
+            {
+              optionLabel: selectedOption?.label,
+            }
+          )}
         </Alert>
       )}
       <InlineField
-        label="Change the default active tab from “Query history” to “Starred”"
+        label={t(
+          'explore.rich-history-settings-tab.change-default-tab',
+          'Change the default active tab from “Query history” to “Starred”'
+        )}
         className={styles.spaceBetween}
       >
         <InlineSwitch
@@ -105,7 +128,10 @@ export function RichHistorySettingsTab(props: RichHistorySettingsProps) {
       </InlineField>
       {supportedFeatures().onlyActiveDataSource && (
         <InlineField
-          label="Only show queries for data source currently active in Explore"
+          label={t(
+            'explore.rich-history-settings-tab.only-show-active-datasource',
+            'Only show queries for data source currently active in Explore'
+          )}
           className={styles.spaceBetween}
         >
           <InlineSwitch
@@ -117,10 +143,16 @@ export function RichHistorySettingsTab(props: RichHistorySettingsProps) {
       )}
       {supportedFeatures().clearHistory && (
         <div>
-          <div className={styles.bold}>Clear query history</div>
+          <div className={styles.bold}>
-          <div className={styles.bottomMargin}>Delete all of your query history, permanently.</div>
+            <Trans i18nKey="explore.rich-history-settings-tab.clear-query-history">Clear query history</Trans>
+          </div>
+          <div className={styles.bottomMargin}>
+            <Trans i18nKey="explore.rich-history-settings-tab.clear-history-info">
+              Delete all of your query history, permanently.
+            </Trans>
+          </div>
           <Button variant="destructive" onClick={onDelete}>
-            Clear query history
+            <Trans i18nKey="explore.rich-history-settings-tab.clear-query-history-button">Clear query history</Trans>
           </Button>
         </div>
       )}

public/app/features/explore/RichHistory/RichHistoryStarredTab.tsx

@@ -4,6 +4,7 @@ import React, { useEffect } from 'react';
 import { GrafanaTheme2, SelectableValue } from '@grafana/data';
 import { config } from '@grafana/runtime';
 import { useStyles2, Select, MultiSelect, FilterInput, Button } from '@grafana/ui';
+import { Trans, t } from 'app/core/internationalization';
 import {
   createDatasourcesList,
   SortOrder,
@@ -105,7 +106,11 @@ export function RichHistoryStarredTab(props: RichHistoryStarredTabProps) {
   }, []);
 
   if (!richHistorySearchFilters) {
-    return <span>Loading...</span>;
+    return (
+      <span>
+        <Trans i18nKey="explore.rich-history-starred-tab.loading">Loading...</Trans>;
+      </span>
+    );
   }
 
   const sortOrderOptions = getSortOrderOptions();
@@ -121,8 +126,14 @@ export function RichHistoryStarredTab(props: RichHistoryStarredTabProps) {
                 return { value: ds.name, label: ds.name };
               })}
               value={richHistorySearchFilters.datasourceFilters}
-              placeholder="Filter queries for data sources(s)"
+              placeholder={t(
-              aria-label="Filter queries for data sources(s)"
+                'explore.rich-history-starred-tab.filter-queries-placeholder',
+                'Filter queries for data sources(s)'
+              )}
+              aria-label={t(
+                'explore.rich-history-starred-tab.filter-queries-aria-label',
+                'Filter queries for data sources(s)'
+              )}
               onChange={(options: SelectableValue[]) => {
                 updateFilters({ datasourceFilters: options.map((option) => option.value) });
               }}
@@ -131,32 +142,53 @@ export function RichHistoryStarredTab(props: RichHistoryStarredTabProps) {
           <div className={styles.filterInput}>
             <FilterInput
               escapeRegex={false}
-              placeholder="Search queries"
+              placeholder={t('explore.rich-history-starred-tab.search-queries-placeholder', 'Search queries')}
               value={richHistorySearchFilters.search}
               onChange={(search: string) => updateFilters({ search })}
             />
           </div>
-          <div aria-label="Sort queries" className={styles.sort}>
+          <div
+            aria-label={t('explore.rich-history-starred-tab.sort-queries-aria-label', 'Sort queries')}
+            className={styles.sort}
+          >
             <Select
               value={sortOrderOptions.filter((order) => order.value === richHistorySearchFilters.sortOrder)}
               options={sortOrderOptions}
-              placeholder="Sort queries by"
+              placeholder={t('explore.rich-history-starred-tab.sort-queries-placeholder', 'Sort queries by')}
               onChange={(e: SelectableValue<SortOrder>) => updateFilters({ sortOrder: e.value })}
             />
           </div>
         </div>
-        {loading && <span>Loading results...</span>}
+        {loading && (
+          <span>
+            <Trans i18nKey="explore.rich-history-starred-tab.loading-results">Loading results...</Trans>
+          </span>
+        )}
         {!loading &&
           queries.map((q) => {
             return <RichHistoryCard query={q} key={q.id} exploreId={exploreId} />;
           })}
         {queries.length && queries.length !== totalQueries ? (
           <div>
-            Showing {queries.length} of {totalQueries} <Button onClick={loadMoreRichHistory}>Load more</Button>
+            <Trans
+              i18nKey="explore.rich-history-starred-tab.showing-queries"
+              defaults="Showing {{ shown }} of {{ total }} <0>Load more</0>"
+              values={{ shown: queries.length, total: totalQueries }}
+              components={[
+                <Button onClick={loadMoreRichHistory} key="loadMoreButton">
+                  Load more
+                </Button>,
+              ]}
+            />
           </div>
         ) : null}
         <div className={styles.footer}>
-          {!config.queryHistoryEnabled ? 'The history is local to your browser and is not shared with others.' : ''}
+          {!config.queryHistoryEnabled
+            ? t(
+                'explore.rich-history-starred-tab.local-history-message',
+                'The history is local to your browser and is not shared with others.'
+              )
+            : ''}
         </div>
       </div>
     </div>

public/app/features/explore/SecondaryActions.tsx

@@ -4,6 +4,7 @@ import React from 'react';
 import { GrafanaTheme2 } from '@grafana/data';
 import { Components } from '@grafana/e2e-selectors';
 import { ToolbarButton, useTheme2 } from '@grafana/ui';
+import { t, Trans } from 'app/core/internationalization';
 
 type Props = {
   addQueryRowButtonDisabled?: boolean;
@@ -36,32 +37,32 @@ export function SecondaryActions(props: Props) {
       {!props.addQueryRowButtonHidden && (
         <ToolbarButton
           variant="canvas"
-          aria-label="Add query"
+          aria-label={t('explore.secondary-actions.query-add-button-aria-label', 'Add query')}
           onClick={props.onClickAddQueryRowButton}
           disabled={props.addQueryRowButtonDisabled}
           icon="plus"
         >
-          Add query
+          <Trans i18nKey="explore.secondary-actions.query-add-button">Add query</Trans>
         </ToolbarButton>
       )}
       {!props.richHistoryRowButtonHidden && (
         <ToolbarButton
           variant={props.richHistoryButtonActive ? 'active' : 'canvas'}
-          aria-label="Query history"
+          aria-label={t('explore.secondary-actions.query-history-button-aria-label', 'Query history')}
           onClick={props.onClickRichHistoryButton}
           data-testid={Components.QueryTab.queryHistoryButton}
           icon="history"
         >
-          Query history
+          <Trans i18nKey="explore.secondary-actions.query-history-button">Query history</Trans>
         </ToolbarButton>
       )}
       <ToolbarButton
         variant={props.queryInspectorButtonActive ? 'active' : 'canvas'}
-        aria-label="Query inspector"
+        aria-label={t('explore.secondary-actions.query-inspector-button-aria-label', 'Query inspector')}
         onClick={props.onClickQueryInspectorButton}
         icon="info-circle"
       >
-        Query inspector
+        <Trans i18nKey="explore.secondary-actions.query-inspector-button">Query inspector</Trans>
       </ToolbarButton>
     </div>
   );

public/locales/de-DE/grafana.json

@@ -339,6 +339,115 @@
   },
   "explore": {
     "add-to-dashboard": "",
+    "rich-history": {
+      "close-tooltip": "",
+      "datasource-a-z": "",
+      "datasource-z-a": "",
+      "newest-first": "",
+      "oldest-first": "",
+      "query-history": "",
+      "settings": "",
+      "starred": ""
+    },
+    "rich-history-card": {
+      "add-comment-form": "",
+      "add-comment-tooltip": "",
+      "cancel": "",
+      "confirm-delete": "",
+      "copy-query-tooltip": "",
+      "copy-shortened-link-tooltip": "",
+      "datasource-icon-label": "",
+      "datasource-name-label": "",
+      "datasource-not-exist": "",
+      "delete-query-confirmation-title": "",
+      "delete-query-title": "",
+      "delete-query-tooltip": "",
+      "delete-starred-query-confirmation-text": "",
+      "edit-comment-tooltip": "",
+      "loading-text": "",
+      "optional-description": "",
+      "query-comment-label": "",
+      "query-text-label": "",
+      "run-query-button": "",
+      "save-comment": "",
+      "star-query-tooltip": "",
+      "switch-datasource-button": "",
+      "unstar-query-tooltip": "",
+      "update-comment-form": ""
+    },
+    "rich-history-container": {
+      "loading": ""
+    },
+    "rich-history-notification": {
+      "query-copied": "",
+      "query-deleted": ""
+    },
+    "rich-history-queries-tab": {
+      "displaying-partial-queries": "",
+      "displaying-queries": "",
+      "filter-aria-label": "",
+      "filter-history": "",
+      "filter-placeholder": "",
+      "history-local": "",
+      "loading": "",
+      "loading-results": "",
+      "search-placeholder": "",
+      "showing-queries": "",
+      "sort-aria-label": "",
+      "sort-placeholder": ""
+    },
+    "rich-history-settings-tab": {
+      "alert-info": "",
+      "change-default-tab": "",
+      "clear-history-info": "",
+      "clear-query-history": "",
+      "clear-query-history-button": "",
+      "delete-confirm": "",
+      "delete-confirm-text": "",
+      "delete-title": "",
+      "history-time-span": "",
+      "history-time-span-description": "",
+      "only-show-active-datasource": "",
+      "query-history-deleted": "",
+      "retention-period": {
+        "1-week": "",
+        "2-days": "",
+        "2-weeks": "",
+        "5-days": ""
+      }
+    },
+    "rich-history-starred-tab": {
+      "filter-queries-aria-label": "",
+      "filter-queries-placeholder": "",
+      "loading": "",
+      "loading-results": "",
+      "local-history-message": "",
+      "search-queries-placeholder": "",
+      "showing-queries": "",
+      "sort-queries-aria-label": "",
+      "sort-queries-placeholder": ""
+    },
+    "rich-history-utils": {
+      "a-week-ago": "",
+      "days-ago": "",
+      "default-from": "",
+      "default-to": "",
+      "today": "",
+      "two-weeks-ago": "",
+      "yesterday": ""
+    },
+    "rich-history-utils-notification": {
+      "saving-failed": "",
+      "update-failed": ""
+    },
+    "secondary-actions": {
+      "query-add-button": "",
+      "query-add-button-aria-label": "",
+      "query-history-button": "",
+      "query-history-button-aria-label": "",
+      "query-inspector-button": "",
+      "query-inspector-button-aria-label": ""
+    },
     "table": {
       "no-data": "",
       "title": "",

public/locales/en-US/grafana.json

@@ -339,6 +339,115 @@
   },
   "explore": {
     "add-to-dashboard": "Add to dashboard",
+    "rich-history": {
+      "close-tooltip": "Close query history",
+      "datasource-a-z": "Data source A-Z",
+      "datasource-z-a": "Data source Z-A",
+      "newest-first": "Newest first",
+      "oldest-first": "Oldest first",
+      "query-history": "Query history",
+      "settings": "Settings",
+      "starred": "Starred"
+    },
+    "rich-history-card": {
+      "add-comment-form": "Add comment form",
+      "add-comment-tooltip": "Add comment",
+      "cancel": "Cancel",
+      "confirm-delete": "Delete",
+      "copy-query-tooltip": "Copy query to clipboard",
+      "copy-shortened-link-tooltip": "Copy shortened link to clipboard",
+      "datasource-icon-label": "Data source icon",
+      "datasource-name-label": "Data source name",
+      "datasource-not-exist": "Data source does not exist anymore",
+      "delete-query-confirmation-title": "Delete",
+      "delete-query-title": "Delete query",
+      "delete-query-tooltip": "Delete query",
+      "delete-starred-query-confirmation-text": "Are you sure you want to permanently delete your starred query?",
+      "edit-comment-tooltip": "Edit comment",
+      "loading-text": "loading...",
+      "optional-description": "An optional description of what the query does.",
+      "query-comment-label": "Query comment",
+      "query-text-label": "Query text",
+      "run-query-button": "Run query",
+      "save-comment": "Save comment",
+      "star-query-tooltip": "Star query",
+      "switch-datasource-button": "Switch data source and run query",
+      "unstar-query-tooltip": "Unstar query",
+      "update-comment-form": "Update comment form"
+    },
+    "rich-history-container": {
+      "loading": "Loading..."
+    },
+    "rich-history-notification": {
+      "query-copied": "Query copied to clipboard",
+      "query-deleted": "Query deleted"
+    },
+    "rich-history-queries-tab": {
+      "displaying-partial-queries": "Displaying {{ count }} queries",
+      "displaying-queries": "{{ count }} queries",
+      "filter-aria-label": "Filter queries for data sources(s)",
+      "filter-history": "Filter history",
+      "filter-placeholder": "Filter queries for data sources(s)",
+      "history-local": "The history is local to your browser and is not shared with others.",
+      "loading": "Loading...",
+      "loading-results": "Loading results...",
+      "search-placeholder": "Search queries",
+      "showing-queries": "Showing {{ shown }} of {{ total }} <0>Load more</0>",
+      "sort-aria-label": "Sort queries",
+      "sort-placeholder": "Sort queries by"
+    },
+    "rich-history-settings-tab": {
+      "alert-info": "Grafana will keep entries up to {{optionLabel}}.Starred entries won't be deleted.",
+      "change-default-tab": "Change the default active tab from “Query history” to “Starred”",
+      "clear-history-info": "Delete all of your query history, permanently.",
+      "clear-query-history": "Clear query history",
+      "clear-query-history-button": "Clear query history",
+      "delete-confirm": "Delete",
+      "delete-confirm-text": "Are you sure you want to permanently delete your query history?",
+      "delete-title": "Delete",
+      "history-time-span": "History time span",
+      "history-time-span-description": "Select the period of time for which Grafana will save your query history. Up to {{MAX_HISTORY_ITEMS}} entries will be stored.",
+      "only-show-active-datasource": "Only show queries for data source currently active in Explore",
+      "query-history-deleted": "Query history deleted",
+      "retention-period": {
+        "1-week": "1 week",
+        "2-days": "2 days",
+        "2-weeks": "2 weeks",
+        "5-days": "5 days"
+      }
+    },
+    "rich-history-starred-tab": {
+      "filter-queries-aria-label": "Filter queries for data sources(s)",
+      "filter-queries-placeholder": "Filter queries for data sources(s)",
+      "loading": "Loading...",
+      "loading-results": "Loading results...",
+      "local-history-message": "The history is local to your browser and is not shared with others.",
+      "search-queries-placeholder": "Search queries",
+      "showing-queries": "Showing {{ shown }} of {{ total }} <0>Load more</0>",
+      "sort-queries-aria-label": "Sort queries",
+      "sort-queries-placeholder": "Sort queries by"
+    },
+    "rich-history-utils": {
+      "a-week-ago": "a week ago",
+      "days-ago": "{{num}} days ago",
+      "default-from": "now-1h",
+      "default-to": "now",
+      "today": "today",
+      "two-weeks-ago": "two weeks ago",
+      "yesterday": "yesterday"
+    },
+    "rich-history-utils-notification": {
+      "saving-failed": "Saving rich history failed",
+      "update-failed": "Rich History update failed"
+    },
+    "secondary-actions": {
+      "query-add-button": "Add query",
+      "query-add-button-aria-label": "Add query",
+      "query-history-button": "Query history",
+      "query-history-button-aria-label": "Query history",
+      "query-inspector-button": "Query inspector",
+      "query-inspector-button-aria-label": "Query inspector"
+    },
     "table": {
       "no-data": "0 series returned",
       "title": "Table",

public/locales/es-ES/grafana.json

@@ -344,6 +344,115 @@
   },
   "explore": {
     "add-to-dashboard": "",
+    "rich-history": {
+      "close-tooltip": "",
+      "datasource-a-z": "",
+      "datasource-z-a": "",
+      "newest-first": "",
+      "oldest-first": "",
+      "query-history": "",
+      "settings": "",
+      "starred": ""
+    },
+    "rich-history-card": {
+      "add-comment-form": "",
+      "add-comment-tooltip": "",
+      "cancel": "",
+      "confirm-delete": "",
+      "copy-query-tooltip": "",
+      "copy-shortened-link-tooltip": "",
+      "datasource-icon-label": "",
+      "datasource-name-label": "",
+      "datasource-not-exist": "",
+      "delete-query-confirmation-title": "",
+      "delete-query-title": "",
+      "delete-query-tooltip": "",
+      "delete-starred-query-confirmation-text": "",
+      "edit-comment-tooltip": "",
+      "loading-text": "",
+      "optional-description": "",
+      "query-comment-label": "",
+      "query-text-label": "",
+      "run-query-button": "",
+      "save-comment": "",
+      "star-query-tooltip": "",
+      "switch-datasource-button": "",
+      "unstar-query-tooltip": "",
+      "update-comment-form": ""
+    },
+    "rich-history-container": {
+      "loading": ""
+    },
+    "rich-history-notification": {
+      "query-copied": "",
+      "query-deleted": ""
+    },
+    "rich-history-queries-tab": {
+      "displaying-partial-queries": "",
+      "displaying-queries": "",
+      "filter-aria-label": "",
+      "filter-history": "",
+      "filter-placeholder": "",
+      "history-local": "",
+      "loading": "",
+      "loading-results": "",
+      "search-placeholder": "",
+      "showing-queries": "",
+      "sort-aria-label": "",
+      "sort-placeholder": ""
+    },
+    "rich-history-settings-tab": {
+      "alert-info": "",
+      "change-default-tab": "",
+      "clear-history-info": "",
+      "clear-query-history": "",
+      "clear-query-history-button": "",
+      "delete-confirm": "",
+      "delete-confirm-text": "",
+      "delete-title": "",
+      "history-time-span": "",
+      "history-time-span-description": "",
+      "only-show-active-datasource": "",
+      "query-history-deleted": "",
+      "retention-period": {
+        "1-week": "",
+        "2-days": "",
+        "2-weeks": "",
+        "5-days": ""
+      }
+    },
+    "rich-history-starred-tab": {
+      "filter-queries-aria-label": "",
+      "filter-queries-placeholder": "",
+      "loading": "",
+      "loading-results": "",
+      "local-history-message": "",
+      "search-queries-placeholder": "",
+      "showing-queries": "",
+      "sort-queries-aria-label": "",
+      "sort-queries-placeholder": ""
+    },
+    "rich-history-utils": {
+      "a-week-ago": "",
+      "days-ago": "",
+      "default-from": "",
+      "default-to": "",
+      "today": "",
+      "two-weeks-ago": "",
+      "yesterday": ""
+    },
+    "rich-history-utils-notification": {
+      "saving-failed": "",
+      "update-failed": ""
+    },
+    "secondary-actions": {
+      "query-add-button": "",
+      "query-add-button-aria-label": "",
+      "query-history-button": "",
+      "query-history-button-aria-label": "",
+      "query-inspector-button": "",
+      "query-inspector-button-aria-label": ""
+    },
     "table": {
       "no-data": "",
       "title": "",

public/locales/fr-FR/grafana.json

@@ -344,6 +344,115 @@
   },
   "explore": {
     "add-to-dashboard": "",
+    "rich-history": {
+      "close-tooltip": "",
+      "datasource-a-z": "",
+      "datasource-z-a": "",
+      "newest-first": "",
+      "oldest-first": "",
+      "query-history": "",
+      "settings": "",
+      "starred": ""
+    },
+    "rich-history-card": {
+      "add-comment-form": "",
+      "add-comment-tooltip": "",
+      "cancel": "",
+      "confirm-delete": "",
+      "copy-query-tooltip": "",
+      "copy-shortened-link-tooltip": "",
+      "datasource-icon-label": "",
+      "datasource-name-label": "",
+      "datasource-not-exist": "",
+      "delete-query-confirmation-title": "",
+      "delete-query-title": "",
+      "delete-query-tooltip": "",
+      "delete-starred-query-confirmation-text": "",
+      "edit-comment-tooltip": "",
+      "loading-text": "",
+      "optional-description": "",
+      "query-comment-label": "",
+      "query-text-label": "",
+      "run-query-button": "",
+      "save-comment": "",
+      "star-query-tooltip": "",
+      "switch-datasource-button": "",
+      "unstar-query-tooltip": "",
+      "update-comment-form": ""
+    },
+    "rich-history-container": {
+      "loading": ""
+    },
+    "rich-history-notification": {
+      "query-copied": "",
+      "query-deleted": ""
+    },
+    "rich-history-queries-tab": {
+      "displaying-partial-queries": "",
+      "displaying-queries": "",
+      "filter-aria-label": "",
+      "filter-history": "",
+      "filter-placeholder": "",
+      "history-local": "",
+      "loading": "",
+      "loading-results": "",
+      "search-placeholder": "",
+      "showing-queries": "",
+      "sort-aria-label": "",
+      "sort-placeholder": ""
+    },
+    "rich-history-settings-tab": {
+      "alert-info": "",
+      "change-default-tab": "",
+      "clear-history-info": "",
+      "clear-query-history": "",
+      "clear-query-history-button": "",
+      "delete-confirm": "",
+      "delete-confirm-text": "",
+      "delete-title": "",
+      "history-time-span": "",
+      "history-time-span-description": "",
+      "only-show-active-datasource": "",
+      "query-history-deleted": "",
+      "retention-period": {
+        "1-week": "",
+        "2-days": "",
+        "2-weeks": "",
+        "5-days": ""
+      }
+    },
+    "rich-history-starred-tab": {
+      "filter-queries-aria-label": "",
+      "filter-queries-placeholder": "",
+      "loading": "",
+      "loading-results": "",
+      "local-history-message": "",
+      "search-queries-placeholder": "",
+      "showing-queries": "",
+      "sort-queries-aria-label": "",
+      "sort-queries-placeholder": ""
+    },
+    "rich-history-utils": {
+      "a-week-ago": "",
+      "days-ago": "",
+      "default-from": "",
+      "default-to": "",
+      "today": "",
+      "two-weeks-ago": "",
+      "yesterday": ""
+    },
+    "rich-history-utils-notification": {
+      "saving-failed": "",
+      "update-failed": ""
+    },
+    "secondary-actions": {
+      "query-add-button": "",
+      "query-add-button-aria-label": "",
+      "query-history-button": "",
+      "query-history-button-aria-label": "",
+      "query-inspector-button": "",
+      "query-inspector-button-aria-label": ""
+    },
     "table": {
       "no-data": "",
       "title": "",

public/locales/pseudo-LOCALE/grafana.json

@@ -339,6 +339,115 @@
   },
   "explore": {
     "add-to-dashboard": "Åđđ ŧő đäşĥþőäřđ",
+    "rich-history": {
+      "close-tooltip": "Cľőşę qūęřy ĥįşŧőřy",
+      "datasource-a-z": "Đäŧä şőūřčę Å-Ż",
+      "datasource-z-a": "Đäŧä şőūřčę Ż-Å",
+      "newest-first": "Ńęŵęşŧ ƒįřşŧ",
+      "oldest-first": "Øľđęşŧ ƒįřşŧ",
+      "query-history": "Qūęřy ĥįşŧőřy",
+      "settings": "Ŝęŧŧįʼnģş",
+      "starred": "Ŝŧäřřęđ"
+    },
+    "rich-history-card": {
+      "add-comment-form": "Åđđ čőmmęʼnŧ ƒőřm",
+      "add-comment-tooltip": "Åđđ čőmmęʼnŧ",
+      "cancel": "Cäʼnčęľ",
+      "confirm-delete": "Đęľęŧę",
+      "copy-query-tooltip": "Cőpy qūęřy ŧő čľįpþőäřđ",
+      "copy-shortened-link-tooltip": "Cőpy şĥőřŧęʼnęđ ľįʼnĸ ŧő čľįpþőäřđ",
+      "datasource-icon-label": "Đäŧä şőūřčę įčőʼn",
+      "datasource-name-label": "Đäŧä şőūřčę ʼnämę",
+      "datasource-not-exist": "Đäŧä şőūřčę đőęş ʼnőŧ ęχįşŧ äʼnymőřę",
+      "delete-query-confirmation-title": "Đęľęŧę",
+      "delete-query-title": "Đęľęŧę qūęřy",
+      "delete-query-tooltip": "Đęľęŧę qūęřy",
+      "delete-starred-query-confirmation-text": "Åřę yőū şūřę yőū ŵäʼnŧ ŧő pęřmäʼnęʼnŧľy đęľęŧę yőūř şŧäřřęđ qūęřy?",
+      "edit-comment-tooltip": "Ēđįŧ čőmmęʼnŧ",
+      "loading-text": "ľőäđįʼnģ...",
+      "optional-description": "Åʼn őpŧįőʼnäľ đęşčřįpŧįőʼn őƒ ŵĥäŧ ŧĥę qūęřy đőęş.",
+      "query-comment-label": "Qūęřy čőmmęʼnŧ",
+      "query-text-label": "Qūęřy ŧęχŧ",
+      "run-query-button": "Ŗūʼn qūęřy",
+      "save-comment": "Ŝävę čőmmęʼnŧ",
+      "star-query-tooltip": "Ŝŧäř qūęřy",
+      "switch-datasource-button": "Ŝŵįŧčĥ đäŧä şőūřčę äʼnđ řūʼn qūęřy",
+      "unstar-query-tooltip": "Ůʼnşŧäř qūęřy",
+      "update-comment-form": "Ůpđäŧę čőmmęʼnŧ ƒőřm"
+    },
+    "rich-history-container": {
+      "loading": "Ŀőäđįʼnģ..."
+    },
+    "rich-history-notification": {
+      "query-copied": "Qūęřy čőpįęđ ŧő čľįpþőäřđ",
+      "query-deleted": "Qūęřy đęľęŧęđ"
+    },
+    "rich-history-queries-tab": {
+      "displaying-partial-queries": "Đįşpľäyįʼnģ {{ count }} qūęřįęş",
+      "displaying-queries": "{{ count }} qūęřįęş",
+      "filter-aria-label": "Fįľŧęř qūęřįęş ƒőř đäŧä şőūřčęş(ş)",
+      "filter-history": "Fįľŧęř ĥįşŧőřy",
+      "filter-placeholder": "Fįľŧęř qūęřįęş ƒőř đäŧä şőūřčęş(ş)",
+      "history-local": "Ŧĥę ĥįşŧőřy įş ľőčäľ ŧő yőūř þřőŵşęř äʼnđ įş ʼnőŧ şĥäřęđ ŵįŧĥ őŧĥęřş.",
+      "loading": "Ŀőäđįʼnģ...",
+      "loading-results": "Ŀőäđįʼnģ řęşūľŧş...",
+      "search-placeholder": "Ŝęäřčĥ qūęřįęş",
+      "showing-queries": "Ŝĥőŵįʼnģ {{ shown }} őƒ {{ total }} <0>Ŀőäđ mőřę</0>",
+      "sort-aria-label": "Ŝőřŧ qūęřįęş",
+      "sort-placeholder": "Ŝőřŧ qūęřįęş þy"
+    },
+    "rich-history-settings-tab": {
+      "alert-info": "Ğřäƒäʼnä ŵįľľ ĸęęp ęʼnŧřįęş ūp ŧő {{optionLabel}}.Ŝŧäřřęđ ęʼnŧřįęş ŵőʼn'ŧ þę đęľęŧęđ.",
+      "change-default-tab": "Cĥäʼnģę ŧĥę đęƒäūľŧ äčŧįvę ŧäþ ƒřőm “Qūęřy ĥįşŧőřy” ŧő “Ŝŧäřřęđ”",
+      "clear-history-info": "Đęľęŧę äľľ őƒ yőūř qūęřy ĥįşŧőřy, pęřmäʼnęʼnŧľy.",
+      "clear-query-history": "Cľęäř qūęřy ĥįşŧőřy",
+      "clear-query-history-button": "Cľęäř qūęřy ĥįşŧőřy",
+      "delete-confirm": "Đęľęŧę",
+      "delete-confirm-text": "Åřę yőū şūřę yőū ŵäʼnŧ ŧő pęřmäʼnęʼnŧľy đęľęŧę yőūř qūęřy ĥįşŧőřy?",
+      "delete-title": "Đęľęŧę",
+      "history-time-span": "Ħįşŧőřy ŧįmę şpäʼn",
+      "history-time-span-description": "Ŝęľęčŧ ŧĥę pęřįőđ őƒ ŧįmę ƒőř ŵĥįčĥ Ğřäƒäʼnä ŵįľľ şävę yőūř qūęřy ĥįşŧőřy. Ůp ŧő {{MAX_HISTORY_ITEMS}} ęʼnŧřįęş ŵįľľ þę şŧőřęđ.",
+      "only-show-active-datasource": "Øʼnľy şĥőŵ qūęřįęş ƒőř đäŧä şőūřčę čūřřęʼnŧľy äčŧįvę įʼn Ēχpľőřę",
+      "query-history-deleted": "Qūęřy ĥįşŧőřy đęľęŧęđ",
+      "retention-period": {
+        "1-week": "1 ŵęęĸ",
+        "2-days": "2 đäyş",
+        "2-weeks": "2 ŵęęĸş",
+        "5-days": "5 đäyş"
+      }
+    },
+    "rich-history-starred-tab": {
+      "filter-queries-aria-label": "Fįľŧęř qūęřįęş ƒőř đäŧä şőūřčęş(ş)",
+      "filter-queries-placeholder": "Fįľŧęř qūęřįęş ƒőř đäŧä şőūřčęş(ş)",
+      "loading": "Ŀőäđįʼnģ...",
+      "loading-results": "Ŀőäđįʼnģ řęşūľŧş...",
+      "local-history-message": "Ŧĥę ĥįşŧőřy įş ľőčäľ ŧő yőūř þřőŵşęř äʼnđ įş ʼnőŧ şĥäřęđ ŵįŧĥ őŧĥęřş.",
+      "search-queries-placeholder": "Ŝęäřčĥ qūęřįęş",
+      "showing-queries": "Ŝĥőŵįʼnģ {{ shown }} őƒ {{ total }} <0>Ŀőäđ mőřę</0>",
+      "sort-queries-aria-label": "Ŝőřŧ qūęřįęş",
+      "sort-queries-placeholder": "Ŝőřŧ qūęřįęş þy"
+    },
+    "rich-history-utils": {
+      "a-week-ago": "ä ŵęęĸ äģő",
+      "days-ago": "{{num}} đäyş äģő",
+      "default-from": "ʼnőŵ-1ĥ",
+      "default-to": "ʼnőŵ",
+      "today": "ŧőđäy",
+      "two-weeks-ago": "ŧŵő ŵęęĸş äģő",
+      "yesterday": "yęşŧęřđäy"
+    },
+    "rich-history-utils-notification": {
+      "saving-failed": "Ŝävįʼnģ řįčĥ ĥįşŧőřy ƒäįľęđ",
+      "update-failed": "Ŗįčĥ Ħįşŧőřy ūpđäŧę ƒäįľęđ"
+    },
+    "secondary-actions": {
+      "query-add-button": "Åđđ qūęřy",
+      "query-add-button-aria-label": "Åđđ qūęřy",
+      "query-history-button": "Qūęřy ĥįşŧőřy",
+      "query-history-button-aria-label": "Qūęřy ĥįşŧőřy",
+      "query-inspector-button": "Qūęřy įʼnşpęčŧőř",
+      "query-inspector-button-aria-label": "Qūęřy įʼnşpęčŧőř"
+    },
     "table": {
       "no-data": "0 şęřįęş řęŧūřʼnęđ",
       "title": "Ŧäþľę",

public/locales/zh-Hans/grafana.json

@@ -334,6 +334,115 @@
   },
   "explore": {
     "add-to-dashboard": "",
+    "rich-history": {
+      "close-tooltip": "",
+      "datasource-a-z": "",
+      "datasource-z-a": "",
+      "newest-first": "",
+      "oldest-first": "",
+      "query-history": "",
+      "settings": "",
+      "starred": ""
+    },
+    "rich-history-card": {
+      "add-comment-form": "",
+      "add-comment-tooltip": "",
+      "cancel": "",
+      "confirm-delete": "",
+      "copy-query-tooltip": "",
+      "copy-shortened-link-tooltip": "",
+      "datasource-icon-label": "",
+      "datasource-name-label": "",
+      "datasource-not-exist": "",
+      "delete-query-confirmation-title": "",
+      "delete-query-title": "",
+      "delete-query-tooltip": "",
+      "delete-starred-query-confirmation-text": "",
+      "edit-comment-tooltip": "",
+      "loading-text": "",
+      "optional-description": "",
+      "query-comment-label": "",
+      "query-text-label": "",
+      "run-query-button": "",
+      "save-comment": "",
+      "star-query-tooltip": "",
+      "switch-datasource-button": "",
+      "unstar-query-tooltip": "",
+      "update-comment-form": ""
+    },
+    "rich-history-container": {
+      "loading": ""
+    },
+    "rich-history-notification": {
+      "query-copied": "",
+      "query-deleted": ""
+    },
+    "rich-history-queries-tab": {
+      "displaying-partial-queries": "",
+      "displaying-queries": "",
+      "filter-aria-label": "",
+      "filter-history": "",
+      "filter-placeholder": "",
+      "history-local": "",
+      "loading": "",
+      "loading-results": "",
+      "search-placeholder": "",
+      "showing-queries": "",
+      "sort-aria-label": "",
+      "sort-placeholder": ""
+    },
+    "rich-history-settings-tab": {
+      "alert-info": "",
+      "change-default-tab": "",
+      "clear-history-info": "",
+      "clear-query-history": "",
+      "clear-query-history-button": "",
+      "delete-confirm": "",
+      "delete-confirm-text": "",
+      "delete-title": "",
+      "history-time-span": "",
+      "history-time-span-description": "",
+      "only-show-active-datasource": "",
+      "query-history-deleted": "",
+      "retention-period": {
+        "1-week": "",
+        "2-days": "",
+        "2-weeks": "",
+        "5-days": ""
+      }
+    },
+    "rich-history-starred-tab": {
+      "filter-queries-aria-label": "",
+      "filter-queries-placeholder": "",
+      "loading": "",
+      "loading-results": "",
+      "local-history-message": "",
+      "search-queries-placeholder": "",
+      "showing-queries": "",
+      "sort-queries-aria-label": "",
+      "sort-queries-placeholder": ""
+    },
+    "rich-history-utils": {
+      "a-week-ago": "",
+      "days-ago": "",
+      "default-from": "",
+      "default-to": "",
+      "today": "",
+      "two-weeks-ago": "",
+      "yesterday": ""
+    },
+    "rich-history-utils-notification": {
+      "saving-failed": "",
+      "update-failed": ""
+    },
+    "secondary-actions": {
+      "query-add-button": "",
+      "query-add-button-aria-label": "",
+      "query-history-button": "",
+      "query-history-button-aria-label": "",
+      "query-inspector-button": "",
+      "query-inspector-button-aria-label": ""
+    },
     "table": {
       "no-data": "",
       "title": "",