fix(theme): use current theme as fallback in preferences, prevent session override of localStorage

This commit is contained in:
Théo LAGACHE
2026-06-19 11:47:47 +02:00
parent 7674ff4625
commit d5aa90a7d9
2 changed files with 9 additions and 3 deletions
@@ -24,9 +24,9 @@ const AVATAR_COLORS = [
export const StepPreferences = () => { export const StepPreferences = () => {
const { next, updateContext, state } = useOnboarding(); const { next, updateContext, state } = useOnboarding();
const { setTheme } = useTheme(); const { theme: currentTheme, setTheme } = useTheme();
const preferences = state?.context.flowData.preferences ?? { const preferences = state?.context.flowData.preferences ?? {
theme: "dark" as const, theme: (currentTheme ?? "system") as ThemeKey,
}; };
const account = state?.context.flowData.account as const account = state?.context.flowData.account as
| OnboardingAccountData | OnboardingAccountData
+7 -1
View File
@@ -15,7 +15,13 @@ export function ThemeMetaUpdater() {
useEffect(() => { useEffect(() => {
if (isPending || !session?.user?.theme) return; if (isPending || !session?.user?.theme) return;
setTheme(session.user.theme); // Only apply the DB theme if the browser has no locally stored preference.
// This prevents a stale session value from overriding a theme the user
// just selected (localStorage is always written first by next-themes).
const stored = localStorage.getItem("theme");
if (!stored) {
setTheme(session.user.theme);
}
}, [session, isPending, setTheme]); }, [session, isPending, setTheme]);
useEffect(() => { useEffect(() => {