From f3fed0b10f3c6b1527459b756d109b0f205c5590 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Tue, 16 Jan 2024 18:31:49 +1100
Subject: [PATCH] fix(ui): use native langs for language select

Use each language's own language for their option in the language select. This falls back to the english translation if the language name isn't translated.
---
 .../SettingsModal/SettingsLanguageSelect.tsx  | 35 ++++++++++---------
 1 file changed, 19 insertions(+), 16 deletions(-)

diff --git a/invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsLanguageSelect.tsx b/invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsLanguageSelect.tsx
index 862fb615fe..491c605f41 100644
--- a/invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsLanguageSelect.tsx
+++ b/invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsLanguageSelect.tsx
@@ -14,22 +14,25 @@ export const SettingsLanguageSelect = memo(() => {
   const language = useAppSelector((s) => s.system.language);
   const options = useMemo(
     () => [
-      { label: t('common.langArabic'), value: 'ar' },
-      { label: t('common.langDutch'), value: 'nl' },
-      { label: t('common.langEnglish'), value: 'en' },
-      { label: t('common.langFrench'), value: 'fr' },
-      { label: t('common.langGerman'), value: 'de' },
-      { label: t('common.langHebrew'), value: 'he' },
-      { label: t('common.langItalian'), value: 'it' },
-      { label: t('common.langJapanese'), value: 'ja' },
-      { label: t('common.langKorean'), value: 'ko' },
-      { label: t('common.langPolish'), value: 'pl' },
-      { label: t('common.langBrPortuguese'), value: 'pt_BR' },
-      { label: t('common.langPortuguese'), value: 'pt' },
-      { label: t('common.langRussian'), value: 'ru' },
-      { label: t('common.langSimplifiedChinese'), value: 'zh_CN' },
-      { label: t('common.langSpanish'), value: 'es' },
-      { label: t('common.langUkranian'), value: 'ua' },
+      { label: t('common.langArabic', { lng: 'ar' }), value: 'ar' },
+      { label: t('common.langDutch', { lng: 'nl' }), value: 'nl' },
+      { label: t('common.langEnglish', { lng: 'en' }), value: 'en' },
+      { label: t('common.langFrench', { lng: 'fr' }), value: 'fr' },
+      { label: t('common.langGerman', { lng: 'de' }), value: 'de' },
+      { label: t('common.langHebrew', { lng: 'he' }), value: 'he' },
+      { label: t('common.langItalian', { lng: 'it' }), value: 'it' },
+      { label: t('common.langJapanese', { lng: 'ja' }), value: 'ja' },
+      { label: t('common.langKorean', { lng: 'ko' }), value: 'ko' },
+      { label: t('common.langPolish', { lng: 'pl' }), value: 'pl' },
+      { label: t('common.langBrPortuguese', { lng: 'pt_BR' }), value: 'pt_BR' },
+      { label: t('common.langPortuguese', { lng: 'pt' }), value: 'pt' },
+      { label: t('common.langRussian', { lng: 'ru' }), value: 'ru' },
+      {
+        label: t('common.langSimplifiedChinese', { lng: 'zh_CN' }),
+        value: 'zh_CN',
+      },
+      { label: t('common.langSpanish', { lng: 'es' }), value: 'es' },
+      { label: t('common.langUkranian', { lng: 'ua' }), value: 'ua' },
     ],
     [t]
   );