Add ThemeProvider

pages/_app.tsx

@@ -1,42 +1,43 @@
-import { useEffect } from "react";
-import { getCookie } from "cookies-next";
-import { appWithTranslation } from "next-i18next";
+import { useEffect } from "react"
+import { getCookie } from "cookies-next"
+import { appWithTranslation } from "next-i18next"
+import { ThemeProvider } from "next-themes"
 
-import type { AppProps } from "next/app";
-import Layout from "~components/Layout";
+import type { AppProps } from "next/app"
+import Layout from "~components/Layout"
 
-import { accountState } from "~utils/accountState";
+import { accountState } from "~utils/accountState"
 
-import "../styles/globals.scss";
+import "../styles/globals.scss"
 
 function MyApp({ Component, pageProps }: AppProps) {
-  const cookie = getCookie("account");
-  const cookieData: AccountCookie = cookie
-    ? JSON.parse(cookie as string)
-    : null;
+  const cookie = getCookie("account")
+  const cookieData: AccountCookie = cookie ? JSON.parse(cookie as string) : null
 
   useEffect(() => {
     if (cookie) {
-      console.log(`Logged in as user "${cookieData.username}"`);
+      console.log(`Logged in as user "${cookieData.username}"`)
 
-      accountState.account.authorized = true;
+      accountState.account.authorized = true
       accountState.account.user = {
         id: cookieData.userId,
         username: cookieData.username,
         picture: "",
         element: "",
         gender: 0,
-      };
+      }
     } else {
-      console.log(`You are not currently logged in.`);
+      console.log(`You are not currently logged in.`)
     }
-  }, [cookie, cookieData]);
+  }, [cookie, cookieData])
 
   return (
-    <Layout>
-      <Component {...pageProps} />
-    </Layout>
-  );
+    <ThemeProvider>
+      <Layout>
+        <Component {...pageProps} />
+      </Layout>
+    </ThemeProvider>
+  )
 }
 
-export default appWithTranslation(MyApp);
+export default appWithTranslation(MyApp)