AI: address issue #455

frontend/src/App.tsx

@@ -26,7 +26,7 @@ import { isAuthorityDependentQuery, localesKeys, sessionKeys } from '@/lib/query
 import { isCountsPath } from '@/lib/routeLocales'
 import { switchPostFilterLocale } from '@/lib/posts'
 import { switchWikiLocale } from '@/lib/wiki'
-import { useLocale, useVerticalPreview } from '@/lib/useLocale'
+import { useLocale, useUILocale, useVerticalPreview } from '@/lib/useLocale'
 import { applyClientAnimationMode,
 	 applyClientAppearance,
 	 fetchUserThemeSlots,
@@ -46,7 +46,7 @@ import ServiceUnavailable from '@/pages/ServiceUnavailable'
 import type { ComponentType, Dispatch, FC, ReactNode, SetStateAction } from 'react'
 import type { RouteMatch } from 'react-router-dom'
 
-import type { AvailableLocale, LocaleCode } from '@/lib/locales'
+import type { AvailableLocale, LocaleCode, UILocaleCode } from '@/lib/locales'
 import type { PageRoute } from '@/lib/routeLocales'
 import type { User } from '@/types'
 
@@ -272,11 +272,16 @@ const RoutedApp = ({ locales }: { locales: AvailableLocale[] }) => {
   const robots = isCountsPath (location.pathname) ? 'noindex' : route?.route.handle?.robots
   const pagePath = unlocalisedPath (location.pathname)
   const countsPage = pagePath === '/counts' || pagePath.startsWith ('/counts/')
-  const switchLocale = async (targetLocale: LocaleCode): Promise<string> => {
+  const switchLocale = async (target: UILocaleCode): Promise<string> => {
+    const targetLocale = target === 'mn-Mong' ? 'ja' : target
+    if (targetLocale === locale)
+      return switchLocalePath (location, target)
     const resolve = route?.route.handle?.switchLocale
-    return (resolve != null && route != null)
-	? resolve ({ location, params: route.params, locale, targetLocale })
+    const destination =
+	(resolve != null && route != null)
+	? await resolve ({ location, params: route.params, locale, targetLocale })
 	: switchLocalePath (location, targetLocale)
+    return target === 'mn-Mong' ? `/mn-Mong${unlocalisedPath (destination)}` : destination
   }
   const [user, setUserState] = useState<User | null> (
       () => client.getQueryData<User> (sessionKeys.current) ?? null)
@@ -413,6 +418,7 @@ const RoutedApp = ({ locales }: { locales: AvailableLocale[] }) => {
 
 const LocaleRoute: FC = () => {
   const { locale } = useParams ()
+  const uiLocale = useUILocale ()
   const location = useLocation ()
   const verticalPreview = isVerticalPreviewPath (location.pathname)
   const { i18n } = useTranslation ()
@@ -433,10 +439,10 @@ const LocaleRoute: FC = () => {
 
   useLayoutEffect (() => {
     if (activeLocale != null)
-      document.documentElement.lang = activeLocale
-    if (activeLocale != null && i18n.language !== activeLocale)
-      void i18n.changeLanguage (activeLocale)
-  }, [activeLocale, i18n])
+      document.documentElement.lang = uiLocale
+    if (activeLocale != null && i18n.language !== uiLocale)
+      void i18n.changeLanguage (uiLocale)
+  }, [activeLocale, uiLocale, i18n])
 
   const redirect = legacyLocalePath (location, pathname => resolvePageRoute (pathname) != null)
   if (!(isLocaleCode (locale)) && !verticalPreview && redirect == null)