feat: add localized home routes

src/layouts/PublicLayout.tsx

@@ -11,6 +11,7 @@ import { DocumentMeta } from "../components/DocumentMeta";
 import { SearchPanel } from "../components/SearchPanel";
 import { useI18n, type Lang } from "../i18n";
 import { LANG_OPTIONS } from "../i18nLanguages";
+import { homePathForLang, isHomePathname } from "../languageRoutes";
 
 type PublicNavWhich =
   | "home"
@@ -30,13 +31,13 @@ function navIsActive(
   const sp = new URLSearchParams(search);
   switch (which) {
     case "home":
-      return pathname === "/";
+      return isHomePathname(pathname);
     case "browseAll":
       return pathname === "/browse" && !sp.has("sort");
     case "categories":
       return (
         pathname === "/categories" ||
-        (pathname === "/" && hash === "#categories")
+        (isHomePathname(pathname) && hash === "#categories")
       );
     case "browseLatest":
       return pathname === "/browse" && sp.get("sort") === "latest";
@@ -46,7 +47,8 @@ function navIsActive(
       return pathname === "/browse" && sp.get("sort") === "popular";
     case "favorites":
       return (
-        pathname === "/favorites" || (pathname === "/" && hash === "#favorites")
+        pathname === "/favorites" ||
+        (isHomePathname(pathname) && hash === "#favorites")
       );
     default:
       return false;
@@ -296,7 +298,12 @@ export function PublicLayout() {
 
   const na = (which: PublicNavWhich) =>
     navIsActive(pathname, search, hash, which);
-  const isHome = pathname === "/";
+  const isHome = isHomePathname(pathname);
+  const homePath = homePathForLang(lang);
+  const changeLang = (nextLang: Lang) => {
+    setLang(nextLang);
+    if (isHome) nav(homePathForLang(nextLang), { replace: true });
+  };
   const footerInContentFlow = pathname === "/browse";
   // Current page name shown in the header brand slot (falls back to the brand).
   const pageTitle = usePageTitle();
@@ -453,7 +460,7 @@ export function PublicLayout() {
           <div className="flex h-8 min-w-0 shrink items-center gap-2 text-[20px] font-black leading-5 tracking-tight text-ark-gold">
             {/* Logo → home; page-name text → scroll to top of the current page. */}
             <Link
-              to="/"
+              to={homePath}
               aria-label={t("brand")}
               onClick={(e) => {
                 if (isHome) {
@@ -498,7 +505,7 @@ export function PublicLayout() {
             </button>
             <MobileLanguageButton
               lang={lang}
-              setLang={setLang}
+              setLang={changeLang}
               ariaLabel={t("langLabel")}
               onOpen={() => {
                 setOpen(false);
@@ -541,7 +548,7 @@ export function PublicLayout() {
             <div className="flex min-w-0 shrink items-center gap-2.5 text-xl font-bold tracking-wide text-ark-gold">
               {/* Logo → home; page-name text → scroll to top of the current page. */}
               <Link
-                to="/"
+                to={homePath}
                 aria-label={t("brand")}
                 onClick={(e) => {
                   if (isHome) {
@@ -628,7 +635,7 @@ export function PublicLayout() {
               </div>
               <LanguageDropdown
                 lang={lang}
-                setLang={setLang}
+                setLang={changeLang}
                 ariaLabel={t("langLabel")}
                 className="hidden h-10 w-36 md:block lg:w-40"
               />
@@ -754,10 +761,10 @@ export function PublicLayout() {
       <nav className="fixed inset-x-0 bottom-0 z-40 select-none bg-[#0C0D0F]/95 pb-[max(env(safe-area-inset-bottom),0px)] backdrop-blur md:hidden">
         <div className="grid h-[68px] grid-cols-4 gap-3 px-5 py-[10px] text-center text-[11px] leading-[17.6px]">
           <BottomNavIcon
-            to="/"
+            to={homePath}
             label={t("home")}
             icon="home"
-            active={pathname === "/"}
+            active={isHome}
           />
           <BottomNavIcon
             to="/browse"