24 lines
698 B
TypeScript
24 lines
698 B
TypeScript
import { useState, useEffect } from "react";
|
|
|
|
// Custom React Hook for dark mode detect
|
|
export default function useDarkMode() {
|
|
const [darkMode, setDarkMode] = useState(false);
|
|
|
|
useEffect(() => {
|
|
const colorSchemeQueryList = window.matchMedia("(prefers-color-scheme: dark)");
|
|
setDarkMode(colorSchemeQueryList.matches ? true : false);
|
|
|
|
const handleChange = () => {
|
|
setDarkMode(colorSchemeQueryList.matches ? true : false);
|
|
};
|
|
|
|
colorSchemeQueryList.addEventListener("change", handleChange);
|
|
|
|
return () => {
|
|
colorSchemeQueryList.removeEventListener("change", handleChange);
|
|
};
|
|
}, []);
|
|
|
|
return darkMode;
|
|
}
|