user-settings: avoid unknown translation keys

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

plugins/user-settings/alpha-api-report.md

@@ -16,11 +16,8 @@ export const userSettingsTranslationRef: TranslationRef<
     readonly theme_dark: 'Dark';
     readonly theme_auto: 'Auto';
     readonly change_the_theme_mode: 'Change the theme mode';
-    readonly select_theme_light: 'Select light';
-    readonly select_theme_dark: 'Select dark';
+    readonly select_theme: 'Select {{theme}}';
     readonly select_theme_auto: 'Select Auto Theme';
-    readonly select_theme_custom: 'Select {{custom}}';
-    readonly lng: '{{language}}';
     readonly select_lng: 'Select language {{language}}';
   }
 >;

plugins/user-settings/src/components/General/UserSettingsLanguageToggle.tsx

@@ -135,7 +135,7 @@ export const UserSettingsLanguageToggle = () => {
                 title={t('select_lng', { language })}
                 value={language}
               >
-                <>{t('lng', { language })}</>
+                <>{language}</>
               </TooltipToggleButton>
             );
           })}

plugins/user-settings/src/components/General/UserSettingsThemeToggle.tsx

@@ -142,24 +142,21 @@ export const UserSettingsThemeToggle = () => {
         >
           {themeIds.map(theme => {
             const themeIcon = themeIds.find(it => it.id === theme.id)?.icon;
-            const themeId = theme.id as 'light' | 'dark';
+            const themeId = theme.id;
+            const themeTitle =
+              theme.title ||
+              (themeId === 'light' || themeId === 'dark'
+                ? t(`theme_${themeId}`)
+                : themeId);
             return (
               <TooltipToggleButton
-                key={theme.id}
-                title={
-                  theme.title
-                    ? t('select_theme_custom', { custom: theme.title })
-                    : t(`select_theme_${themeId}`)
-                }
-                value={theme.id}
+                key={themeId}
+                title={t('select_theme', { theme: themeTitle })}
+                value={themeId}
               >
                 <>
-                  {theme.title || t(`theme_${themeId}`)}&nbsp;
-                  <ThemeIcon
-                    id={theme.id}
-                    icon={themeIcon}
-                    activeId={themeId}
-                  />
+                  {themeTitle}&nbsp;
+                  <ThemeIcon id={themeId} icon={themeIcon} activeId={themeId} />
                 </>
               </TooltipToggleButton>
             );

plugins/user-settings/src/translation.ts

@@ -27,11 +27,8 @@ export const userSettingsTranslationRef = createTranslationRef({
     theme_dark: 'Dark',
     theme_auto: 'Auto',
     change_the_theme_mode: 'Change the theme mode',
-    select_theme_light: 'Select light',
-    select_theme_dark: 'Select dark',
+    select_theme: 'Select {{theme}}',
     select_theme_auto: 'Select Auto Theme',
-    select_theme_custom: 'Select {{custom}}',
-    lng: '{{language}}',
     select_lng: 'Select language {{language}}',
   } as const,
 });