25 lines
664 B
TypeScript
25 lines
664 B
TypeScript
"use client";
|
|
|
|
import { useState, useEffect } from "react";
|
|
import { useTheme } from "next-themes";
|
|
import { IoSunnyOutline, IoMoonOutline } from "react-icons/io5";
|
|
import { IconButton } from "@/components/IconButton";
|
|
|
|
export function ThemeToggleButton() {
|
|
const { theme, setTheme } = useTheme();
|
|
const [mounted, setMounted] = useState(false);
|
|
useEffect(() => {
|
|
setMounted(true);
|
|
}, []);
|
|
if (!mounted) {
|
|
return null;
|
|
}
|
|
return (
|
|
<IconButton
|
|
onClick={() => setTheme(theme === "dark" ? "light" : "dark")}
|
|
aria-label="Toggle theme"
|
|
>
|
|
{theme === "dark" ? <IoSunnyOutline /> : <IoMoonOutline />}
|
|
</IconButton>
|
|
);
|
|
}
|