From a84873a52bfb1a89e4174ec6f0fa62d88dbfa01d Mon Sep 17 00:00:00 2001
From: Joao Silva <100691367+JoaoSilvaGrafana@users.noreply.github.com>
Date: Thu, 4 Aug 2022 16:43:49 +0100
Subject: [PATCH] i18n: Translates the Share Panel modal (#53297)

---
 .../core/components/Select/FolderPicker.tsx   |   3 +-
 .../components/ShareModal/ShareEmbed.tsx      |  42 +++---
 .../ShareModal/ShareLibraryPanel.tsx          |   5 +-
 .../components/ShareModal/ShareLink.tsx       |  37 +-----
 .../components/ShareModal/ShareModal.tsx      |  26 +++-
 .../components/ShareModal/ThemePicker.tsx     |  47 +++++++
 .../AddLibraryPanelModal.tsx                  |  21 ++-
 .../library-panels/utils/usePanelSave.ts      |  18 ++-
 public/locales/en-US/messages.po              | 124 +++++++++++++++---
 public/locales/es-ES/messages.po              | 124 +++++++++++++++---
 public/locales/fr-FR/messages.po              | 124 +++++++++++++++---
 public/locales/pseudo-LOCALE/messages.po      | 124 +++++++++++++++---
 12 files changed, 564 insertions(+), 131 deletions(-)
 create mode 100644 public/app/features/dashboard/components/ShareModal/ThemePicker.tsx

diff --git a/public/app/core/components/Select/FolderPicker.tsx b/public/app/core/components/Select/FolderPicker.tsx
index 99380c613af..20a584061ad 100644
--- a/public/app/core/components/Select/FolderPicker.tsx
+++ b/public/app/core/components/Select/FolderPicker.tsx
@@ -1,3 +1,4 @@
+import { t } from '@lingui/macro';
 import { debounce } from 'lodash';
 import React, { PureComponent } from 'react';
 
@@ -218,7 +219,7 @@ export class FolderPicker extends PureComponent<Props, State> {
         <AsyncSelect
           inputId={inputId}
           aria-label={selectors.components.FolderPicker.input}
-          loadingMessage="Loading folders..."
+          loadingMessage={t({ id: 'folder-picker.loading', message: 'Loading folders...' })}
           defaultOptions
           defaultValue={folder}
           value={folder}
diff --git a/public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx b/public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
index 0f20fbe71f4..7cd4d681897 100644
--- a/public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+++ b/public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
@@ -1,18 +1,13 @@
+import { t, Trans } from '@lingui/macro';
 import React, { FormEvent, PureComponent } from 'react';
 
-import { SelectableValue } from '@grafana/data';
 import { reportInteraction } from '@grafana/runtime/src';
-import { ClipboardButton, Field, Modal, RadioButtonGroup, Switch, TextArea } from '@grafana/ui';
+import { ClipboardButton, Field, Modal, Switch, TextArea } from '@grafana/ui';
 
+import { ThemePicker } from './ThemePicker';
 import { ShareModalTabProps } from './types';
 import { buildIframeHtml } from './utils';
 
-const themeOptions: Array<SelectableValue<string>> = [
-  { label: 'Current', value: 'current' },
-  { label: 'Dark', value: 'dark' },
-  { label: 'Light', value: 'light' },
-];
-
 interface Props extends ShareModalTabProps {}
 
 interface State {
@@ -69,12 +64,21 @@ export class ShareEmbed extends PureComponent<Props, State> {
     const { useCurrentTimeRange, selectedTheme, iframeHtml } = this.state;
     const isRelativeTime = this.props.dashboard ? this.props.dashboard.time.to === 'now' : false;
 
+    const timeRangeDescription = isRelativeTime
+      ? t({
+          id: 'share-modal.embed.time-range-description',
+          message: 'Transforms the current relative time range to an absolute time range',
+        })
+      : '';
+
     return (
       <>
-        <p className="share-modal-info-text">Generate HTML for embedding an iframe with this panel.</p>
+        <p className="share-modal-info-text">
+          <Trans id="share-modal.embed.info">Generate HTML for embedding an iframe with this panel.</Trans>
+        </p>
         <Field
-          label="Current time range"
-          description={isRelativeTime ? 'Transforms the current relative time range to an absolute time range' : ''}
+          label={t({ id: 'share-modal.embed.time-range', message: 'Current time range' })}
+          description={timeRangeDescription}
         >
           <Switch
             id="share-current-time-range"
@@ -82,13 +86,15 @@ export class ShareEmbed extends PureComponent<Props, State> {
             onChange={this.onUseCurrentTimeRangeChange}
           />
         </Field>
-        <Field label="Theme">
-          <RadioButtonGroup options={themeOptions} value={selectedTheme} onChange={this.onThemeChange} />
-        </Field>
+        <ThemePicker selectedTheme={selectedTheme} onChange={this.onThemeChange} />
         <Field
-          label="Embed HTML"
-          description="The HTML code below can be pasted and included in another web page. Unless anonymous access is enabled,
-                the user viewing that page need to be signed into Grafana for the graph to load."
+          label={t({ id: 'share-modal.embed.html', message: 'Embed HTML' })}
+          description={
+            <Trans id="share-modal.embed.html-description">
+              The HTML code below can be pasted and included in another web page. Unless anonymous access is enabled,
+              the user viewing that page need to be signed into Grafana for the graph to load.
+            </Trans>
+          }
         >
           <TextArea
             data-testid="share-embed-html"
@@ -100,7 +106,7 @@ export class ShareEmbed extends PureComponent<Props, State> {
         </Field>
         <Modal.ButtonRow>
           <ClipboardButton icon="copy" variant="primary" getText={this.getIframeHtml}>
-            Copy to clipboard
+            <Trans id="share-modal.embed.copy">Copy to clipboard</Trans>
           </ClipboardButton>
         </Modal.ButtonRow>
       </>
diff --git a/public/app/features/dashboard/components/ShareModal/ShareLibraryPanel.tsx b/public/app/features/dashboard/components/ShareModal/ShareLibraryPanel.tsx
index 59b073448f6..21bd38bcbcc 100644
--- a/public/app/features/dashboard/components/ShareModal/ShareLibraryPanel.tsx
+++ b/public/app/features/dashboard/components/ShareModal/ShareLibraryPanel.tsx
@@ -1,3 +1,4 @@
+import { Trans } from '@lingui/macro';
 import React, { useEffect } from 'react';
 
 import { reportInteraction } from '@grafana/runtime/src';
@@ -20,7 +21,9 @@ export const ShareLibraryPanel = ({ panel, initialFolderId, onDismiss }: Props)
 
   return (
     <>
-      <p className="share-modal-info-text">Create library panel.</p>
+      <p className="share-modal-info-text">
+        <Trans id="share-modal.library.info">Create library panel.</Trans>
+      </p>
       <AddLibraryPanelContents panel={panel} initialFolderId={initialFolderId} onDismiss={onDismiss!} />
     </>
   );
diff --git a/public/app/features/dashboard/components/ShareModal/ShareLink.tsx b/public/app/features/dashboard/components/ShareModal/ShareLink.tsx
index 3d42eb4065f..085e74021df 100644
--- a/public/app/features/dashboard/components/ShareModal/ShareLink.tsx
+++ b/public/app/features/dashboard/components/ShareModal/ShareLink.tsx
@@ -1,12 +1,12 @@
 import { Trans, t } from '@lingui/macro';
 import React, { PureComponent } from 'react';
 
-import { SelectableValue } from '@grafana/data';
 import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { reportInteraction } from '@grafana/runtime/src';
-import { Alert, ClipboardButton, Field, FieldSet, Icon, Input, RadioButtonGroup, Switch } from '@grafana/ui';
+import { Alert, ClipboardButton, Field, FieldSet, Icon, Input, Switch } from '@grafana/ui';
 import config from 'app/core/config';
 
+import { ThemePicker } from './ThemePicker';
 import { ShareModalTabProps } from './types';
 import { buildImageUrl, buildShareUrl } from './utils';
 
@@ -101,30 +101,6 @@ export class ShareLink extends PureComponent<Props, State> {
       message: `Link URL`,
     });
 
-    const themeOptions: Array<SelectableValue<string>> = [
-      {
-        label: t({
-          id: 'share-modal.link.theme-current',
-          message: `Current`,
-        }),
-        value: 'current',
-      },
-      {
-        label: t({
-          id: 'share-modal.link.theme-dark',
-          message: `Dark`,
-        }),
-        value: 'dark',
-      },
-      {
-        label: t({
-          id: 'share-modal.link.theme-light',
-          message: `Light`,
-        }),
-        value: 'light',
-      },
-    ];
-
     return (
       <>
         <p className="share-modal-info-text">
@@ -140,14 +116,7 @@ export class ShareLink extends PureComponent<Props, State> {
               onChange={this.onUseCurrentTimeRangeChange}
             />
           </Field>
-          <Field
-            label={t({
-              id: 'share-modal.link.theme',
-              message: `Theme`,
-            })}
-          >
-            <RadioButtonGroup options={themeOptions} value={selectedTheme} onChange={this.onThemeChange} />
-          </Field>
+          <ThemePicker selectedTheme={selectedTheme} onChange={this.onThemeChange} />
           <Field label={shortenURLTranslation}>
             <Switch id="share-shorten-url" value={useShortUrl} onChange={this.onUrlShorten} />
           </Field>
diff --git a/public/app/features/dashboard/components/ShareModal/ShareModal.tsx b/public/app/features/dashboard/components/ShareModal/ShareModal.tsx
index 680dd001428..a36b87087d4 100644
--- a/public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+++ b/public/app/features/dashboard/components/ShareModal/ShareModal.tsx
@@ -1,3 +1,4 @@
+import { t } from '@lingui/macro';
 import React from 'react';
 
 import { reportInteraction } from '@grafana/runtime/src';
@@ -37,21 +38,26 @@ function getInitialState(props: Props): State {
 function getTabs(props: Props) {
   const { panel } = props;
 
-  const tabs: ShareModalTabModel[] = [{ label: 'Link', value: 'link', component: ShareLink }];
+  const linkLabel = t({ id: 'share-modal.tab-title.link', message: 'Link' });
+  const tabs: ShareModalTabModel[] = [{ label: linkLabel, value: 'link', component: ShareLink }];
 
   if (contextSrv.isSignedIn) {
-    tabs.push({ label: 'Snapshot', value: 'snapshot', component: ShareSnapshot });
+    const snapshotLabel = t({ id: 'share-modal.tab-title.snapshot', message: 'Snapshot' });
+    tabs.push({ label: snapshotLabel, value: 'snapshot', component: ShareSnapshot });
   }
 
   if (panel) {
-    tabs.push({ label: 'Embed', value: 'embed', component: ShareEmbed });
+    const embedLabel = t({ id: 'share-modal.tab-title.embed', message: 'Embed' });
+    tabs.push({ label: embedLabel, value: 'embed', component: ShareEmbed });
 
     if (!isPanelModelLibraryPanel(panel)) {
-      tabs.push({ label: 'Library panel', value: 'library_panel', component: ShareLibraryPanel });
+      const libraryPanelLabel = t({ id: 'share-modal.tab-title.library-panel', message: 'Library panel' });
+      tabs.push({ label: libraryPanelLabel, value: 'library_panel', component: ShareLibraryPanel });
     }
     tabs.push(...customPanelTabs);
   } else {
-    tabs.push({ label: 'Export', value: 'export', component: ShareExport });
+    const exportLabel = t({ id: 'share-modal.tab-title.export', message: 'Export' });
+    tabs.push({ label: exportLabel, value: 'export', component: ShareExport });
     tabs.push(...customDashboardTabs);
   }
 
@@ -100,7 +106,15 @@ export class ShareModal extends React.Component<Props, State> {
   renderTitle() {
     const { panel } = this.props;
     const { activeTab } = this.state;
-    const title = panel ? 'Share Panel' : 'Share';
+    const title = panel
+      ? t({
+          id: 'share-modal.panel.title',
+          message: 'Share Panel',
+        })
+      : t({
+          id: 'share-modal.dashboard.title',
+          message: 'Share',
+        });
     const tabs = this.getTabs();
 
     return (
diff --git a/public/app/features/dashboard/components/ShareModal/ThemePicker.tsx b/public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
new file mode 100644
index 00000000000..072d1073e63
--- /dev/null
+++ b/public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
@@ -0,0 +1,47 @@
+import { t } from '@lingui/macro';
+import React from 'react';
+
+import { SelectableValue } from '@grafana/data';
+import { RadioButtonGroup, Field } from '@grafana/ui';
+
+interface Props {
+  selectedTheme: string;
+  onChange: (value: string) => void;
+}
+
+export const ThemePicker = ({ selectedTheme = 'current', onChange }: Props) => {
+  const themeOptions: Array<SelectableValue<string>> = [
+    {
+      label: t({
+        id: 'share-modal.theme-picker.current',
+        message: `Current`,
+      }),
+      value: 'current',
+    },
+    {
+      label: t({
+        id: 'share-modal.theme-picker.dark',
+        message: `Dark`,
+      }),
+      value: 'dark',
+    },
+    {
+      label: t({
+        id: 'share-modal.theme-picker.light',
+        message: `Light`,
+      }),
+      value: 'light',
+    },
+  ];
+
+  return (
+    <Field
+      label={t({
+        id: 'share-modal.theme-picker.field-name',
+        message: `Theme`,
+      })}
+    >
+      <RadioButtonGroup options={themeOptions} value={selectedTheme} onChange={onChange} />
+    </Field>
+  );
+};
diff --git a/public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx b/public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
index 3aee558d73f..5dda93c458f 100644
--- a/public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+++ b/public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
@@ -1,3 +1,4 @@
+import { t, Trans } from '@lingui/macro';
 import React, { useCallback, useEffect, useState } from 'react';
 import { useAsync, useDebounce } from 'react-use';
 
@@ -52,9 +53,13 @@ export const AddLibraryPanelContents = ({ panel, initialFolderId, onDismiss }: A
   return (
     <>
       <Field
-        label="Library panel name"
+        label={t({ id: 'library-panel.add-modal.name', message: 'Library panel name' })}
         invalid={invalidInput}
-        error={invalidInput ? 'Library panel with this name already exists' : ''}
+        error={
+          invalidInput
+            ? t({ id: 'library-panel.add-modal.error', message: 'Library panel with this name already exists' })
+            : ''
+        }
       >
         <Input
           id="share-panel-library-panel-name-input"
@@ -63,7 +68,13 @@ export const AddLibraryPanelContents = ({ panel, initialFolderId, onDismiss }: A
           onChange={(e) => setPanelName(e.currentTarget.value)}
         />
       </Field>
-      <Field label="Save in folder" description="Library panel permissions are derived from the folder permissions">
+      <Field
+        label={t({ id: 'library-panel.add-modal.folder', message: 'Save in folder' })}
+        description={t({
+          id: 'library-panel.add-modal.folder-description',
+          message: 'Library panel permissions are derived from the folder permissions',
+        })}
+      >
         <FolderPicker
           onChange={({ id }) => setFolderId(id)}
           initialFolderId={initialFolderId}
@@ -73,10 +84,10 @@ export const AddLibraryPanelContents = ({ panel, initialFolderId, onDismiss }: A
 
       <Modal.ButtonRow>
         <Button variant="secondary" onClick={onDismiss} fill="outline">
-          Cancel
+          <Trans id="library-panel.add-modal.cancel">Cancel</Trans>
         </Button>
         <Button onClick={onCreate} disabled={invalidInput}>
-          Create library panel
+          <Trans id="library-panel.add-modal.create">Create library panel</Trans>
         </Button>
       </Modal.ButtonRow>
     </>
diff --git a/public/app/features/library-panels/utils/usePanelSave.ts b/public/app/features/library-panels/utils/usePanelSave.ts
index d20fdc01f3e..4bad594efa6 100644
--- a/public/app/features/library-panels/utils/usePanelSave.ts
+++ b/public/app/features/library-panels/utils/usePanelSave.ts
@@ -1,3 +1,4 @@
+import { t } from '@lingui/macro';
 import { useEffect } from 'react';
 import { useDispatch } from 'react-redux';
 import useAsyncFn from 'react-use/lib/useAsyncFn';
@@ -28,10 +29,23 @@ export const usePanelSave = () => {
 
   useEffect(() => {
     if (state.error) {
-      dispatch(notifyApp(createPanelLibraryErrorNotification(`Error saving library panel: "${state.error.message}"`)));
+      const errorMsg = state.error.message;
+      dispatch(
+        notifyApp(
+          createPanelLibraryErrorNotification(
+            t({ id: 'library-panels.save.error', message: `Error saving library panel: "${errorMsg}"` })
+          )
+        )
+      );
     }
     if (state.value) {
-      dispatch(notifyApp(createPanelLibrarySuccessNotification('Library panel saved')));
+      dispatch(
+        notifyApp(
+          createPanelLibrarySuccessNotification(
+            t({ id: 'library-panels.save.success', message: 'Library panel saved' })
+          )
+        )
+      );
     }
   }, [dispatch, state]);
 
diff --git a/public/locales/en-US/messages.po b/public/locales/en-US/messages.po
index 0b2ef317d14..05f5fd5f008 100644
--- a/public/locales/en-US/messages.po
+++ b/public/locales/en-US/messages.po
@@ -271,6 +271,42 @@ msgstr "Cycle view mode"
 msgid "dashboard.toolbar.unmark-favorite"
 msgstr "Unmark as favorite"
 
+#: public/app/core/components/Select/FolderPicker.tsx
+msgid "folder-picker.loading"
+msgstr "Loading folders..."
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.cancel"
+msgstr "Cancel"
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.create"
+msgstr "Create library panel"
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.error"
+msgstr "Library panel with this name already exists"
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.folder"
+msgstr "Save in folder"
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.folder-description"
+msgstr "Library panel permissions are derived from the folder permissions"
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.name"
+msgstr "Library panel name"
+
+#: public/app/features/library-panels/utils/usePanelSave.ts
+msgid "library-panels.save.error"
+msgstr "Error saving library panel: \"{errorMsg}\""
+
+#: public/app/features/library-panels/utils/usePanelSave.ts
+msgid "library-panels.save.success"
+msgstr "Library panel saved"
+
 #: public/app/core/components/NavBar/navBarItem-translations.ts
 msgid "nav.alerting"
 msgstr "Alerting"
@@ -467,6 +503,34 @@ msgstr "Share"
 msgid "panel.header-menu.view"
 msgstr "View"
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.dashboard.title"
+msgstr "Share"
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.copy"
+msgstr "Copy to clipboard"
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.html"
+msgstr "Embed HTML"
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.html-description"
+msgstr "The HTML code below can be pasted and included in another web page. Unless anonymous access is enabled, the user viewing that page need to be signed into Grafana for the graph to load."
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.info"
+msgstr "Generate HTML for embedding an iframe with this panel."
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.time-range"
+msgstr "Current time range"
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.time-range-description"
+msgstr "Transforms the current relative time range to an absolute time range"
+
 #: public/app/features/dashboard/components/ShareModal/ShareExport.tsx
 msgid "share-modal.export.cancel-button"
 msgstr "Cancel"
@@ -491,6 +555,10 @@ msgstr "Export for sharing externally"
 msgid "share-modal.export.view-button"
 msgstr "View JSON"
 
+#: public/app/features/dashboard/components/ShareModal/ShareLibraryPanel.tsx
+msgid "share-modal.library.info"
+msgstr "Create library panel."
+
 #: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
 msgid "share-modal.link.copy-link-button"
 msgstr "Copy"
@@ -527,22 +595,6 @@ msgstr "To render a panel image, you must save the dashboard first."
 msgid "share-modal.link.shorten-url"
 msgstr "Shorten URL"
 
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme"
-msgstr "Theme"
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-current"
-msgstr "Current"
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-dark"
-msgstr "Dark"
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-light"
-msgstr "Light"
-
 #: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
 msgid "share-modal.link.time-range-description"
 msgstr "Transforms the current relative time range to an absolute time range"
@@ -551,6 +603,10 @@ msgstr "Transforms the current relative time range to an absolute time range"
 msgid "share-modal.link.time-range-label"
 msgstr "Lock time range"
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.panel.title"
+msgstr "Share Panel"
+
 #: public/app/features/dashboard/components/ShareModal/ShareSnapshot.tsx
 msgid "share-modal.snapshot.cancel-button"
 msgstr "Cancel"
@@ -617,6 +673,42 @@ msgstr ""
 "You might need to configure the timeout value if it takes a long time to collect your dashboard\n"
 "metrics."
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.embed"
+msgstr "Embed"
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.export"
+msgstr "Export"
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.library-panel"
+msgstr "Library panel"
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.link"
+msgstr "Link"
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.snapshot"
+msgstr "Snapshot"
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.current"
+msgstr "Current"
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.dark"
+msgstr "Dark"
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.field-name"
+msgstr "Theme"
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.light"
+msgstr "Light"
+
 #: public/app/core/components/SharedPreferences/SharedPreferences.tsx
 msgid "shared-dashboard.fields.timezone-label"
 msgstr "Timezone"
diff --git a/public/locales/es-ES/messages.po b/public/locales/es-ES/messages.po
index 4ad90ba63d5..e7a9d438165 100644
--- a/public/locales/es-ES/messages.po
+++ b/public/locales/es-ES/messages.po
@@ -276,6 +276,42 @@ msgstr ""
 msgid "dashboard.toolbar.unmark-favorite"
 msgstr ""
 
+#: public/app/core/components/Select/FolderPicker.tsx
+msgid "folder-picker.loading"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.cancel"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.create"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.error"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.folder"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.folder-description"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.name"
+msgstr ""
+
+#: public/app/features/library-panels/utils/usePanelSave.ts
+msgid "library-panels.save.error"
+msgstr ""
+
+#: public/app/features/library-panels/utils/usePanelSave.ts
+msgid "library-panels.save.success"
+msgstr ""
+
 #: public/app/core/components/NavBar/navBarItem-translations.ts
 msgid "nav.alerting"
 msgstr ""
@@ -472,6 +508,34 @@ msgstr ""
 msgid "panel.header-menu.view"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.dashboard.title"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.copy"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.html"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.html-description"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.info"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.time-range"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.time-range-description"
+msgstr ""
+
 #: public/app/features/dashboard/components/ShareModal/ShareExport.tsx
 msgid "share-modal.export.cancel-button"
 msgstr ""
@@ -496,6 +560,10 @@ msgstr ""
 msgid "share-modal.export.view-button"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareLibraryPanel.tsx
+msgid "share-modal.library.info"
+msgstr ""
+
 #: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
 msgid "share-modal.link.copy-link-button"
 msgstr ""
@@ -532,22 +600,6 @@ msgstr ""
 msgid "share-modal.link.shorten-url"
 msgstr ""
 
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme"
-msgstr ""
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-current"
-msgstr ""
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-dark"
-msgstr ""
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-light"
-msgstr ""
-
 #: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
 msgid "share-modal.link.time-range-description"
 msgstr ""
@@ -556,6 +608,10 @@ msgstr ""
 msgid "share-modal.link.time-range-label"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.panel.title"
+msgstr ""
+
 #: public/app/features/dashboard/components/ShareModal/ShareSnapshot.tsx
 msgid "share-modal.snapshot.cancel-button"
 msgstr ""
@@ -620,6 +676,42 @@ msgstr ""
 msgid "share-modal.snapshot.timeout-description"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.embed"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.export"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.library-panel"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.link"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.snapshot"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.current"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.dark"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.field-name"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.light"
+msgstr ""
+
 #: public/app/core/components/SharedPreferences/SharedPreferences.tsx
 msgid "shared-dashboard.fields.timezone-label"
 msgstr ""
diff --git a/public/locales/fr-FR/messages.po b/public/locales/fr-FR/messages.po
index 6a769ee7cd2..374d6fff5de 100644
--- a/public/locales/fr-FR/messages.po
+++ b/public/locales/fr-FR/messages.po
@@ -276,6 +276,42 @@ msgstr ""
 msgid "dashboard.toolbar.unmark-favorite"
 msgstr ""
 
+#: public/app/core/components/Select/FolderPicker.tsx
+msgid "folder-picker.loading"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.cancel"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.create"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.error"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.folder"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.folder-description"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.name"
+msgstr ""
+
+#: public/app/features/library-panels/utils/usePanelSave.ts
+msgid "library-panels.save.error"
+msgstr ""
+
+#: public/app/features/library-panels/utils/usePanelSave.ts
+msgid "library-panels.save.success"
+msgstr ""
+
 #: public/app/core/components/NavBar/navBarItem-translations.ts
 msgid "nav.alerting"
 msgstr ""
@@ -472,6 +508,34 @@ msgstr ""
 msgid "panel.header-menu.view"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.dashboard.title"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.copy"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.html"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.html-description"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.info"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.time-range"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.time-range-description"
+msgstr ""
+
 #: public/app/features/dashboard/components/ShareModal/ShareExport.tsx
 msgid "share-modal.export.cancel-button"
 msgstr ""
@@ -496,6 +560,10 @@ msgstr ""
 msgid "share-modal.export.view-button"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareLibraryPanel.tsx
+msgid "share-modal.library.info"
+msgstr ""
+
 #: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
 msgid "share-modal.link.copy-link-button"
 msgstr ""
@@ -532,22 +600,6 @@ msgstr ""
 msgid "share-modal.link.shorten-url"
 msgstr ""
 
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme"
-msgstr ""
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-current"
-msgstr ""
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-dark"
-msgstr ""
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-light"
-msgstr ""
-
 #: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
 msgid "share-modal.link.time-range-description"
 msgstr ""
@@ -556,6 +608,10 @@ msgstr ""
 msgid "share-modal.link.time-range-label"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.panel.title"
+msgstr ""
+
 #: public/app/features/dashboard/components/ShareModal/ShareSnapshot.tsx
 msgid "share-modal.snapshot.cancel-button"
 msgstr ""
@@ -620,6 +676,42 @@ msgstr ""
 msgid "share-modal.snapshot.timeout-description"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.embed"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.export"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.library-panel"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.link"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.snapshot"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.current"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.dark"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.field-name"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.light"
+msgstr ""
+
 #: public/app/core/components/SharedPreferences/SharedPreferences.tsx
 msgid "shared-dashboard.fields.timezone-label"
 msgstr ""
diff --git a/public/locales/pseudo-LOCALE/messages.po b/public/locales/pseudo-LOCALE/messages.po
index 67a97dfb428..9872ff25591 100644
--- a/public/locales/pseudo-LOCALE/messages.po
+++ b/public/locales/pseudo-LOCALE/messages.po
@@ -270,6 +270,42 @@ msgstr ""
 msgid "dashboard.toolbar.unmark-favorite"
 msgstr ""
 
+#: public/app/core/components/Select/FolderPicker.tsx
+msgid "folder-picker.loading"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.cancel"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.create"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.error"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.folder"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.folder-description"
+msgstr ""
+
+#: public/app/features/library-panels/components/AddLibraryPanelModal/AddLibraryPanelModal.tsx
+msgid "library-panel.add-modal.name"
+msgstr ""
+
+#: public/app/features/library-panels/utils/usePanelSave.ts
+msgid "library-panels.save.error"
+msgstr ""
+
+#: public/app/features/library-panels/utils/usePanelSave.ts
+msgid "library-panels.save.success"
+msgstr ""
+
 #: public/app/core/components/NavBar/navBarItem-translations.ts
 msgid "nav.alerting"
 msgstr ""
@@ -466,6 +502,34 @@ msgstr ""
 msgid "panel.header-menu.view"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.dashboard.title"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.copy"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.html"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.html-description"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.info"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.time-range"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareEmbed.tsx
+msgid "share-modal.embed.time-range-description"
+msgstr ""
+
 #: public/app/features/dashboard/components/ShareModal/ShareExport.tsx
 msgid "share-modal.export.cancel-button"
 msgstr ""
@@ -490,6 +554,10 @@ msgstr ""
 msgid "share-modal.export.view-button"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareLibraryPanel.tsx
+msgid "share-modal.library.info"
+msgstr ""
+
 #: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
 msgid "share-modal.link.copy-link-button"
 msgstr ""
@@ -526,22 +594,6 @@ msgstr ""
 msgid "share-modal.link.shorten-url"
 msgstr ""
 
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme"
-msgstr ""
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-current"
-msgstr ""
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-dark"
-msgstr ""
-
-#: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
-msgid "share-modal.link.theme-light"
-msgstr ""
-
 #: public/app/features/dashboard/components/ShareModal/ShareLink.tsx
 msgid "share-modal.link.time-range-description"
 msgstr ""
@@ -550,6 +602,10 @@ msgstr ""
 msgid "share-modal.link.time-range-label"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.panel.title"
+msgstr ""
+
 #: public/app/features/dashboard/components/ShareModal/ShareSnapshot.tsx
 msgid "share-modal.snapshot.cancel-button"
 msgstr ""
@@ -614,6 +670,42 @@ msgstr ""
 msgid "share-modal.snapshot.timeout-description"
 msgstr ""
 
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.embed"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.export"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.library-panel"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.link"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ShareModal.tsx
+msgid "share-modal.tab-title.snapshot"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.current"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.dark"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.field-name"
+msgstr ""
+
+#: public/app/features/dashboard/components/ShareModal/ThemePicker.tsx
+msgid "share-modal.theme-picker.light"
+msgstr ""
+
 #: public/app/core/components/SharedPreferences/SharedPreferences.tsx
 msgid "shared-dashboard.fields.timezone-label"
 msgstr ""