import { useEffect, useState, memo } from "react";
import { useTheme } from "next-themes";
import styles from "./ThemeToggle.module.css";
// modified from Twemoji lightbulb:
const BulbIcon = ({ on = false, className = "" }) => (
);
const ThemeToggle = ({ className = "" }) => {
const [mounted, setMounted] = useState(false);
const { resolvedTheme, setTheme } = useTheme();
// render a dummy bulb until we're fully mounted and self-aware
useEffect(() => setMounted(true), []);
if (!mounted) return ;
return (
);
};
export default memo(ThemeToggle);