diff options
author | lonkaars <l.leblansch@gmail.com> | 2021-03-10 19:13:14 +0100 |
---|---|---|
committer | lonkaars <l.leblansch@gmail.com> | 2021-03-10 19:13:14 +0100 |
commit | 0cb860559dce5299272b87e5e03e0a9347df27e6 (patch) | |
tree | 550320f4587ee62771009cd911b9c401ac7acfd5 /pages | |
parent | 9a72d2310682dd0dcb0f9296273fca93591d8a31 (diff) |
working global dark mode :tada:
Diffstat (limited to 'pages')
-rw-r--r-- | pages/_app.tsx | 42 | ||||
-rw-r--r-- | pages/user.tsx | 2 |
2 files changed, 42 insertions, 2 deletions
diff --git a/pages/_app.tsx b/pages/_app.tsx index 39b6372..08338d0 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -1,10 +1,50 @@ +import Head from 'next/head'; +import axios from 'axios'; +import { useState, useEffect } from 'react'; + +import { userPreferences } from '../api/api'; + import '../styles/global.css'; import '../styles/dark.css'; import '../styles/disk.css'; -import Head from "next/head"; +function applyPreferences(preferences: userPreferences) { + if(typeof preferences === "undefined") return; + if(typeof preferences.darkMode !== "undefined") + document.getElementsByTagName("html")[0].classList[preferences.darkMode ? "add" : "remove"]("dark"); +} export default function VierOpEenRijWebsite({ Component, pageProps }) { + var [gotData, setGotData] = useState(false); + var [preferences, setPreferences] = useState<userPreferences>(); + + useEffect(() => {(async() => { + if (gotData) return; + if (typeof window === "undefined") return; + if (!document.cookie.includes("token")) return; + + var local_prefs = window.localStorage.getItem("preferences"); + if (local_prefs) { + var local_prefs_json = JSON.parse(local_prefs) as userPreferences; + console.log(typeof local_prefs_json); + setPreferences(local_prefs_json); + applyPreferences(local_prefs_json); + } + + var preferencesReq = await axios.request<{ preferences: userPreferences; }>({ + method: "get", + url: `/api/user/preferences`, + headers: {"content-type": "application/json"} + }); + + window.localStorage.setItem("preferences", JSON.stringify(preferencesReq.data.preferences)); + setPreferences(preferencesReq.data.preferences); + + setGotData(true); + })()}) + + useEffect(() => applyPreferences(preferences), [preferences]); + return <div> <Head> <title>4 op een rij</title> diff --git a/pages/user.tsx b/pages/user.tsx index d0c6f5b..f190efd 100644 --- a/pages/user.tsx +++ b/pages/user.tsx @@ -115,7 +115,7 @@ export default function AccountPage() { } setGotData(true); - })()}) + })()}); return <div> <NavBar/> |