31 lines
688 B
TypeScript
31 lines
688 B
TypeScript
|
import { useEffect, useMemo, useState } from "preact/hooks";
|
||
|
|
import {
|
||
|
|
applyThemeToDocument,
|
||
|
|
DEFAULT_THEME,
|
||
|
|
getStoredThemeName,
|
||
|
|
THEME_OPTIONS,
|
||
|
|
THEME_STORAGE_KEY,
|
||
|
|
type ThemeName,
|
||
|
|
} from "./themes";
|
||
|
|
|
||
|
|
export function useThemePreference() {
|
||
|
|
const [themeName, setThemeName] = useState<ThemeName>(() => {
|
||
|
|
if (typeof window === "undefined") return DEFAULT_THEME;
|
||
|
|
return getStoredThemeName();
|
||
|
|
});
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
applyThemeToDocument(themeName);
|
||
|
|
window.localStorage.setItem(THEME_STORAGE_KEY, themeName);
|
||
|
|
}, [themeName]);
|
||
|
|
|
||
|
|
return useMemo(
|
||
|
|
() => ({
|
||
|
|
themeName,
|
||
|
|
themeOptions: THEME_OPTIONS,
|
||
|
|
setThemeName,
|
||
|
|
}),
|
||
|
|
[themeName],
|
||
|
|
);
|
||
|
|
}
|