codedsaif-react-hooks/hooks/useTheme.js

To make it easy for you to get started with GitLab, here's a list of recommended next steps.

import useLocalStorage from "./useLocalStorage";
/**
 * Custom hook to manage dark and light theme modes,
 * persisting the theme preference in localStorage.
 * @returns {[string, function]} - Current theme and a toggle function.
 * @example
 * const [theme, toggleTheme] = useDarkMode();
 * return (
 *   <button onClick={toggleTheme}>
 *     Switch to {theme === "light" ? "Dark" : "Light"} Mode
 *   </button>
 * );
 */
function useDarkMode() {
  const [theme, setTheme] = useLocalStorage("theme", "light");

  useEffect(() => {
    document.body.className = theme;
  }, [theme]);

  return [theme, () => setTheme(theme === "light" ? "dark" : "light")];
}

export default useDarkMode;