diff --git a/components/Navbar.tsx b/components/Navbar.tsx index 6a03eb6..341f5c8 100644 --- a/components/Navbar.tsx +++ b/components/Navbar.tsx @@ -1,28 +1,42 @@ /* eslint-disable jsx-a11y/click-events-have-key-events */ /* eslint-disable jsx-a11y/no-noninteractive-tabindex */ /* eslint-disable jsx-a11y/no-static-element-interactions */ -import { useState } from 'react' +import { useEffect, useState } from 'react' import Link from 'next/link' import { useRouter } from 'next/router' import { redirectTo } from '@utils/Tools' -import { UserCache } from '@types' +import { User, UserCache } from '@types' import DiscordAvatar from '@components/DiscordAvatar' +import Fetch from '@utils/Fetch' -const Navbar = (): JSX.Element => { - let userCache:UserCache - try { - userCache = JSON.parse(localStorage.userCache) - } catch { - userCache = null - } - +const Navbar = ({ token }:{ token: string }): JSX.Element => { + const [userCache, setUserCache] = useState() const [navbarOpen, setNavbarOpen] = useState(false) const [dropdownOpen, setDropdownOpen] = useState(false) const router = useRouter() const logged = userCache?.id && userCache.version === 2 const dev = router.pathname.startsWith('/developers') + + useEffect(() => { + try { + if(localStorage.userCache) { + setUserCache(token ? JSON.parse(localStorage.userCache) : null) + } + Fetch('/users/@me').then(data => { + if(data.code !== 200) return + setUserCache(JSON.parse(localStorage.userCache = JSON.stringify({ + id: data.data.id, + username: data.data.username, + tag: data.data.tag, + version: 2 + }))) + }) + } catch { + setUserCache(null) + } + }, [ token ]) return ( <>