Function useSystemColorScheme

desktop/src/shared/theme/useSystemColorScheme.ts:18–37

()

}

export function useSystemColorScheme(): SystemColorScheme {
  const [colorScheme, setColorScheme] =
    React.useState<SystemColorScheme>(getSystemColorScheme);

  React.useEffect(() => {
    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
    const updateColorScheme = () => {
      setColorScheme(mediaQuery.matches ? "dark" : "light");
    };

    updateColorScheme();
    mediaQuery.addEventListener("change", updateColorScheme);

    return () => {
      mediaQuery.removeEventListener("change", updateColorScheme);
    };
  }, []);

  return colorScheme;
}