i18n: Markup Explorer Graph for translation (#76099)

public/app/features/explore/Graph/GraphContainer.tsx

@@ -21,6 +21,7 @@ import {
   useStyles2,
   Tooltip,
 } from '@grafana/ui';
+import { t, Trans } from 'app/core/internationalization';
 import { ExploreGraphStyle } from 'app/types';
 
 import { storeGraphStyle } from '../state/utils';
@@ -76,19 +77,24 @@ export const GraphContainer = ({
 
   return (
     <PanelChrome
-      title="Graph"
+      title={t('graph.container.title', 'Graph')}
       titleItems={[
         !showAllSeries && MAX_NUMBER_OF_TIME_SERIES < data.length && (
           <div key="disclaimer" className={styles.timeSeriesDisclaimer}>
             <span className={styles.warningMessage}>
               <Icon name="exclamation-triangle" aria-hidden="true" />
-              Showing only {MAX_NUMBER_OF_TIME_SERIES} series
+              <Trans i18nKey={'graph.container.show-only-series'}>
+                Showing only {{ MAX_NUMBER_OF_TIME_SERIES }} series
+              </Trans>
             </span>
             <Tooltip
-              content={`Rendering too many series in a single panel may impact performance and make data harder to read. Consider refining your queries.`}
+              content={t(
+                'graph.container.content',
+                'Rendering too many series in a single panel may impact performance and make data harder to read. Consider refining your queries.'
+              )}
             >
               <Button variant="secondary" size="sm" onClick={toggleShowAllSeries}>
-                Show all {data.length}
+                <Trans i18nKey={'graph.container.show-all-series'}>Show all {{ length: data.length }}</Trans>
               </Button>
             </Tooltip>
           </div>

public/locales/de-DE/grafana.json

@@ -374,6 +374,14 @@
       "placeholder": ""
     }
   },
+  "graph": {
+    "container": {
+      "content": "",
+      "show-all-series": "",
+      "show-only-series": "",
+      "title": ""
+    }
+  },
   "help-modal": {
     "shortcuts-category": {
       "dashboard": "",

public/locales/en-US/grafana.json

@@ -374,6 +374,14 @@
       "placeholder": "Choose"
     }
   },
+  "graph": {
+    "container": {
+      "content": "Rendering too many series in a single panel may impact performance and make data harder to read. Consider refining your queries.",
+      "show-all-series": "Show all {{length}}",
+      "show-only-series": "Showing only {{MAX_NUMBER_OF_TIME_SERIES}} series",
+      "title": "Graph"
+    }
+  },
   "help-modal": {
     "shortcuts-category": {
       "dashboard": "Dashboard",

public/locales/es-ES/grafana.json

@@ -379,6 +379,14 @@
       "placeholder": ""
     }
   },
+  "graph": {
+    "container": {
+      "content": "",
+      "show-all-series": "",
+      "show-only-series": "",
+      "title": ""
+    }
+  },
   "help-modal": {
     "shortcuts-category": {
       "dashboard": "",

public/locales/fr-FR/grafana.json

@@ -379,6 +379,14 @@
       "placeholder": ""
     }
   },
+  "graph": {
+    "container": {
+      "content": "",
+      "show-all-series": "",
+      "show-only-series": "",
+      "title": ""
+    }
+  },
   "help-modal": {
     "shortcuts-category": {
       "dashboard": "",

public/locales/pseudo-LOCALE/grafana.json

@@ -374,6 +374,14 @@
       "placeholder": "Cĥőőşę"
     }
   },
+  "graph": {
+    "container": {
+      "content": "Ŗęʼnđęřįʼnģ ŧőő mäʼny şęřįęş įʼn ä şįʼnģľę päʼnęľ mäy įmpäčŧ pęřƒőřmäʼnčę äʼnđ mäĸę đäŧä ĥäřđęř ŧő řęäđ. Cőʼnşįđęř řęƒįʼnįʼnģ yőūř qūęřįęş.",
+      "show-all-series": "Ŝĥőŵ äľľ {{length}}",
+      "show-only-series": "Ŝĥőŵįʼnģ őʼnľy {{MAX_NUMBER_OF_TIME_SERIES}} şęřįęş",
+      "title": "Ğřäpĥ"
+    }
+  },
   "help-modal": {
     "shortcuts-category": {
       "dashboard": "Đäşĥþőäřđ",

public/locales/zh-Hans/grafana.json

@@ -369,6 +369,14 @@
       "placeholder": ""
     }
   },
+  "graph": {
+    "container": {
+      "content": "",
+      "show-all-series": "",
+      "show-only-series": "",
+      "title": ""
+    }
+  },
   "help-modal": {
     "shortcuts-category": {
       "dashboard": "",