fix: unable to login

src/layouts/RootLayout.tsx

@@ -15,10 +15,11 @@ import { toast } from "react-hot-toast"
 import { graphql, useLazyLoadQuery } from "react-relay"
 import { Outlet, useNavigate } from "react-router-dom"
 import { useEffectOnce } from "react-use"
-import { getToken, setToken } from "../utils/storage"
+import { getToken, setToken, useToken } from "../utils/storage"
 import { RootLayoutQuery } from "./__generated__/RootLayoutQuery.graphql"
 
 export const RootLayout: FC = () => {
+  const [token] = useToken()
   const navigate = useNavigate()
   useEffectOnce(() => {
     const token = getToken()
@@ -47,7 +48,7 @@ export const RootLayout: FC = () => {
             </div>
           </Tooltip>
           <div className="flex-1" />
-          <AccountButton />
+          {token && <AccountButton />}
         </Toolbar>
       </AppBar>
       <Container maxWidth="lg" className="pt-16">

src/utils/storage.ts

@@ -7,7 +7,9 @@ export const LOCALSTORAGE_KEYS = {
 }
 
 export const useToken = () => {
-  return useLocalStorage(LOCALSTORAGE_KEYS.TOKEN)
+  return useLocalStorage<string>(LOCALSTORAGE_KEYS.TOKEN, undefined, {
+    raw: true,
+  })
 }
 
 export const getToken = () => {

vite.config.ts

@@ -18,4 +18,7 @@ export default defineConfig(({ mode }) => ({
       disable: mode !== "production",
     }),
   ],
+  build: {
+    sourcemap: true,
+  },
 }))