Localize lang selectors according to the app language (#6207)

* Localize lang selectors according to the app language

* Explicitly ignore RangeError when translating locale names

src/view/com/modals/lang-settings/ContentLanguagesSettings.tsx

@@ -5,6 +5,7 @@ import {Trans} from '@lingui/macro'
 import {usePalette} from '#/lib/hooks/usePalette'
 import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
 import {deviceLanguageCodes} from '#/locale/deviceLocales'
+import {languageName} from '#/locale/helpers'
 import {useModalControls} from '#/state/modals'
 import {
   useLanguagePrefs,
@@ -88,7 +89,7 @@ export function Component({}: {}) {
             key={lang.code2}
             code2={lang.code2}
             langType="contentLanguages"
-            name={lang.name}
+            name={languageName(lang, langPrefs.appLanguage)}
             onPress={() => {
               onPress(lang.code2)
             }}

src/view/com/modals/lang-settings/PostLanguagesSettings.tsx

@@ -5,6 +5,7 @@ import {Trans} from '@lingui/macro'
 import {usePalette} from '#/lib/hooks/usePalette'
 import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries'
 import {deviceLanguageCodes} from '#/locale/deviceLocales'
+import {languageName} from '#/locale/helpers'
 import {useModalControls} from '#/state/modals'
 import {
   hasPostLanguage,
@@ -91,7 +92,7 @@ export function Component() {
           return (
             <ToggleButton
               key={lang.code2}
-              label={lang.name}
+              label={languageName(lang, langPrefs.appLanguage)}
               isSelected={isSelected}
               onPress={() => (isDisabled ? undefined : onPress(lang.code2))}
               style={[