From a7568dbef1f0cdee9731067fce2395b550748c1b Mon Sep 17 00:00:00 2001
From: Sean Sube <seansube@gmail.com>
Date: Sat, 13 Jan 2024 20:54:36 -0600
Subject: [PATCH] fix(gui): translate tab labels

---
 gui/src/components/OnnxWeb.tsx | 4 +++-
 gui/src/strings/de.ts          | 4 +++-
 gui/src/strings/en.ts          | 2 ++
 gui/src/strings/es.ts          | 2 ++
 gui/src/strings/fr.ts          | 2 ++
 5 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/gui/src/components/OnnxWeb.tsx b/gui/src/components/OnnxWeb.tsx
index 8de0d4b8..78c1f230 100644
--- a/gui/src/components/OnnxWeb.tsx
+++ b/gui/src/components/OnnxWeb.tsx
@@ -5,6 +5,7 @@ import { createTheme, ThemeProvider } from '@mui/material/styles';
 import { Allotment } from 'allotment';
 import * as React from 'react';
 import { useContext, useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useHash } from 'react-use/lib/useHash';
 import { useStore } from 'zustand';
 
@@ -126,6 +127,7 @@ export function TabGroup(props: TabGroupProps) {
   const layout = LAYOUT_STYLES[props.direction];
 
   const [hash, setHash] = useHash();
+  const { t } = useTranslation();
 
   return <Stack direction='column' minWidth={layout.control.width} sx={{ mx: STANDARD_MARGIN }}>
     <TabContext value={getTab(hash)}>
@@ -133,7 +135,7 @@ export function TabGroup(props: TabGroupProps) {
         <TabList onChange={(_e, idx) => {
           setHash(idx);
         }}>
-          {TAB_LABELS.map((name) => <Tab key={name} label={name} value={name} />)}
+          {TAB_LABELS.map((name) => <Tab key={name} label={t(`tab.${name}`)} value={name} />)}
         </TabList>
       </Box>
       <TabPanel value='txt2img'>
diff --git a/gui/src/strings/de.ts b/gui/src/strings/de.ts
index 6c58c7ab..73ce3853 100644
--- a/gui/src/strings/de.ts
+++ b/gui/src/strings/de.ts
@@ -75,7 +75,7 @@ export const I18N_STRINGS_DE = {
       },
       loading: {
         cancel: 'Stornieren',
-        progress: '{{current}} von {{total}} Schritten, {{tiles.current}} of {{tiles.total}} Kacheln, {{stages.current}} of {{stages.total}} Abschnitten',
+        progress: '{{steps.current}} von {{steps.total}} Schritten, {{tiles.current}} of {{tiles.total}} Kacheln, {{stages.current}} of {{stages.total}} Abschnitten',
         queue: '{{current}} von {{total}} in der Warteschlange',
         server: 'Verbindung zum Server...',
         unknown: 'vielen',
@@ -248,6 +248,8 @@ export const I18N_STRINGS_DE = {
         blend: 'Mischung',
         img2img: 'Img2img',
         inpaint: '',
+        models: 'Modelle',
+        settings: 'Einstellungen',
         txt2txt: 'Txt2txt',
         txt2img: 'Txt2img',
         upscale: 'Vergrößern',
diff --git a/gui/src/strings/en.ts b/gui/src/strings/en.ts
index 64a07d72..387f67e7 100644
--- a/gui/src/strings/en.ts
+++ b/gui/src/strings/en.ts
@@ -329,6 +329,8 @@ export const I18N_STRINGS_EN = {
         blend: 'Blend',
         img2img: 'Img2img',
         inpaint: 'Inpaint',
+        models: 'Models',
+        settings: 'Settings',
         txt2txt: 'Txt2txt',
         txt2img: 'Txt2img',
         upscale: 'Upscale',
diff --git a/gui/src/strings/es.ts b/gui/src/strings/es.ts
index d9670d48..765c9b5b 100644
--- a/gui/src/strings/es.ts
+++ b/gui/src/strings/es.ts
@@ -250,6 +250,8 @@ export const I18N_STRINGS_ES = {
         blend: 'Mezclar',
         img2img: 'Img2img',
         inpaint: 'Inpaint',
+        models: '',
+        settings: '',
         txt2txt: 'Txt2txt',
         txt2img: 'Txt2img',
         upscale: 'Aumentar',
diff --git a/gui/src/strings/fr.ts b/gui/src/strings/fr.ts
index 779d4b25..afe1614e 100644
--- a/gui/src/strings/fr.ts
+++ b/gui/src/strings/fr.ts
@@ -250,6 +250,8 @@ export const I18N_STRINGS_FR = {
         blend: '',
         img2img: '',
         inpaint: '',
+        models: '',
+        settings: '',
         txt2txt: '',
         txt2img: '',
         upscale: '',