Compare commits

...

1 Commits

Author SHA1 Message Date
Atif Ali 53fea3d068 fix(site): use embedded metadata for theme preference on initial load
Fixes #20050

Previously, the theme preference was only read from the query data,
which could be undefined during initial render even when embedded
metadata was available. This caused the theme to default to dark
mode until the Appearance page was loaded.

Now the ThemeProvider checks the embedded metadata first, then
falls back to query data, and finally defaults to dark mode. This
ensures the user's saved theme preference is applied immediately
on page load.
2025-11-03 13:39:55 +00:00
+6 -1
View File
@@ -56,8 +56,13 @@ export const ThemeProvider: FC<PropsWithChildren> = ({ children }) => {
}, [themeQuery]);
// We might not be logged in yet, or the `theme_preference` could be an empty string.
// First check if metadata has the preference, then query data, then default to dark
const themePreference =
appearanceSettingsQuery.data?.theme_preference || DEFAULT_THEME;
appearanceSettingsQuery.data?.theme_preference ||
(metadata.userAppearance.available
? metadata.userAppearance.value?.theme_preference
: undefined) ||
DEFAULT_THEME;
// The janky casting here is find because of the much more type safe fallback
// We need to support `themePreference` being wrong anyway because the database
// value could be anything, like an empty string.