From a6811598440f5d130faa01570d6cc4108782ad2d Mon Sep 17 00:00:00 2001 From: Fabrice Rochette <45168870+mjfelis@users.noreply.github.com> Date: Sat, 12 Sep 2026 11:02:32 +0200 Subject: [PATCH 1/9] fix(nav): keep the chosen theme when switching language The server no longer renders data-theme="dark" on : a client-side navigation between locales re-rendered the attribute without re-running the pre-paint theme script, so a light theme flipped to dark. The language switch is now a full navigation, so the proxy records the NEXT_LOCALE cookie and redirects to the canonical path instead of leaving /en/... in the address bar. --- app/[locale]/layout.tsx | 9 +++++++-- app/components/Nav.tsx | 5 +++-- 2 files changed, 10 insertions(+), 4 deletions(-) diff --git a/app/[locale]/layout.tsx b/app/[locale]/layout.tsx index ee755f5..95a4a29 100644 --- a/app/[locale]/layout.tsx +++ b/app/[locale]/layout.tsx @@ -47,7 +47,12 @@ export async function generateMetadata({ params }: { params: Promise }; } -/** Sets data-theme before first paint: stored choice, else OS preference, else dark. */ +/** + * Sets data-theme before first paint: stored choice, else OS preference, else + * dark. The server never renders the attribute itself: a client-side + * navigation between locales re-renders and would reset a server value + * to "dark" without running this script again. + */ const themeInitScript = ` (function(){try{var s=localStorage.getItem('mobiera-theme');var t=(s==='light'||s==='dark')?s:(window.matchMedia('(prefers-color-scheme: light)').matches?'light':'dark');document.documentElement.setAttribute('data-theme',t);}catch(e){document.documentElement.setAttribute('data-theme','dark');}})(); `; @@ -57,7 +62,7 @@ export default async function RootLayout({ children, params }: { children: React setRequestLocale(locale); const t = await getTranslations("common"); return ( - +