From 316f5507cebc0dd693b310f8a42647ce3dda891b Mon Sep 17 00:00:00 2001 From: Shivam Kumar Date: Sun, 19 Jul 2026 18:52:22 +0530 Subject: [PATCH] SCAL-324146 Fix: Dark mode resets to light on client-side navigation when isDarkMode URL param is set --- src/components/DevDocTemplate/index.tsx | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/src/components/DevDocTemplate/index.tsx b/src/components/DevDocTemplate/index.tsx index 4b0ac293c..6f289a997 100644 --- a/src/components/DevDocTemplate/index.tsx +++ b/src/components/DevDocTemplate/index.tsx @@ -108,6 +108,14 @@ const DevDocTemplate: FC = (props) => { if (typeof window === 'undefined') return false; // In-product (embedded) presentation always uses light mode — product UI has no theme toggle. if (!isPublicSite(location.search)) return false; + // URL param takes highest priority (set by embedding product to pass its theme). + const urlParams = new URLSearchParams(window.location.search); + const darkModeParam = urlParams.get('isDarkMode'); + if (darkModeParam !== null) { + const isDark = darkModeParam === 'true'; + localStorage.setItem('themeMode', isDark ? 'dark' : 'light'); + return isDark; + } /* themeMode is only written when the user explicitly clicks the toggle. If absent, follow OS preference fresh every load. */ const explicitChoice = localStorage.getItem('themeMode'); @@ -265,6 +273,7 @@ const isVersionedIframe = VERSION_DROPDOWN.some( const newDarkMode = darkModeParam === 'true'; setDarkMode(newDarkMode); localStorage.setItem('theme', newDarkMode ? 'dark' : 'light'); + localStorage.setItem('themeMode', newDarkMode ? 'dark' : 'light'); } } }, [location.search]);