From 5e068b05cab0e2851447ed550c964384ff51fd75 Mon Sep 17 00:00:00 2001
From: yudejp <i@yude.jp>
Date: Sat, 22 May 2021 10:23:46 +0900
Subject: [PATCH] Switch button text by theme condition

---
 pages/components/DarkmodeSwitcher.js | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/pages/components/DarkmodeSwitcher.js b/pages/components/DarkmodeSwitcher.js
index 53c16d8..f31489a 100644
--- a/pages/components/DarkmodeSwitcher.js
+++ b/pages/components/DarkmodeSwitcher.js
@@ -13,17 +13,27 @@ const Layout = (props) => {
   const { locale, locales, defaultLocale, pathname } = router
   
   const [isMounted, setIsMounted] = useState(false);
-  const { theme, setTheme } = useTheme();
-useEffect(() => {
+  const { theme, setTheme, getTheme } = useTheme();
+  let moon = "🌙";
+  useEffect(() => {
     setIsMounted(true);
   }, []);
-const switchTheme = () => {
+  const switchTheme = () => {
     if (isMounted) {
       setTheme(theme === "light" ? "dark" : "light");
     }
+    if (theme == "light") moon = "🌙";
+    if (theme == "dark") moon = "🌅";
   };
+  console.log(theme);
   return (
-    <button className="my-4 mx-3 text-2xl" onClick={switchTheme}>🌙</button>
+      <button className="my-4 mx-3 text-2xl" onClick={switchTheme}>
+        {theme === 'light' ? (
+          <span>🌙</span>
+        ) : (
+          <span>🌄</span>
+        )}
+      </button>
   )
 }
 export default Layout
\ No newline at end of file