Refresh invite and repository web pages (#1808)

Signed-off-by: Fizz <8a675edd33677aa0389f6650d467b2041fb0df4ca820eacb009babb95e3715d4@sprout-oss.stage.blox.sqprod.co>
Co-authored-by: npub13fn4ahfnvaa2qwylvegdgeajqs0mph6v4qsw4jcqnw4mjh3hzh2quuucm5 <8a675edd33677aa0389f6650d467b2041fb0df4ca820eacb009babb95e3715d4@sprout-oss.stage.blox.sqprod.co>
This commit is contained in:
klopez4212
2026-07-13 19:20:34 +01:00
committed by GitHub
parent a6cfd65511
commit a227bb45f6
18 changed files with 528 additions and 218 deletions

View File

@@ -15,33 +15,35 @@ type ThemeContextValue = {
setTheme: (theme: Theme) => void;
};
const STORAGE_KEY = "buzz-web-theme";
const ThemeContext = createContext<ThemeContextValue | undefined>(undefined);
function getSystemDark(): boolean {
return window.matchMedia("(prefers-color-scheme: dark)").matches;
}
function getInitialTheme(): Theme {
if (!import.meta.env.DEV) return "system";
const previewTheme = new URLSearchParams(window.location.search).get(
"previewTheme",
);
return previewTheme === "light" || previewTheme === "dark"
? previewTheme
: "system";
}
function applyClass(isDark: boolean) {
const root = document.documentElement;
root.classList.remove("light", "dark");
root.classList.add(isDark ? "dark" : "light");
}
function readStoredTheme(): Theme {
const stored = window.localStorage.getItem(STORAGE_KEY);
if (stored === "light" || stored === "dark" || stored === "system") {
return stored;
}
return "system";
}
export function ThemeProvider({ children }: { children: ReactNode }) {
const [theme, setThemeState] = useState<Theme>(readStoredTheme);
const [theme, setThemeState] = useState<Theme>(getInitialTheme);
const [isDark, setIsDark] = useState<boolean>(() => {
const t = readStoredTheme();
const dark = t === "system" ? getSystemDark() : t === "dark";
const initialTheme = getInitialTheme();
const dark =
initialTheme === "system" ? getSystemDark() : initialTheme === "dark";
applyClass(dark);
return dark;
});
@@ -65,7 +67,6 @@ export function ThemeProvider({ children }: { children: ReactNode }) {
}, [theme]);
const setTheme = useCallback((t: Theme) => {
window.localStorage.setItem(STORAGE_KEY, t);
setThemeState(t);
}, []);