Justin Edmund
9b60134933
- Add useSnapshot from Valtio to make Header reactive to state changes - Replace accountState references with accountSnap for reactive updates - Add missing router import for navigation methods - Fix router.reload() to router.refresh() for Next.js 13+ - Create AccountStateInitializer component to load auth from cookies - Add initializer to root layout to ensure state is set on page load The header now properly updates to show user avatar and authenticated menu when logging in. 🤖 Generated with Claude Code (https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
48 lines
No EOL
1.4 KiB
TypeScript
48 lines
No EOL
1.4 KiB
TypeScript
'use client'
|
|
|
|
import { useEffect } from 'react'
|
|
import { getCookie } from 'cookies-next'
|
|
import { accountState } from '~utils/accountState'
|
|
import { setHeaders } from '~utils/userToken'
|
|
|
|
export default function AccountStateInitializer() {
|
|
useEffect(() => {
|
|
const accountCookie = getCookie('account')
|
|
const userCookie = getCookie('user')
|
|
|
|
if (accountCookie && userCookie) {
|
|
try {
|
|
const accountData = JSON.parse(accountCookie as string)
|
|
const userData = JSON.parse(userCookie as string)
|
|
|
|
if (accountData && accountData.token) {
|
|
console.log(`Logged in as user "${accountData.username}"`)
|
|
|
|
// Set headers for API calls
|
|
setHeaders()
|
|
|
|
// Update account state
|
|
accountState.account.authorized = true
|
|
accountState.account.user = {
|
|
id: accountData.userId,
|
|
username: accountData.username,
|
|
role: accountData.role,
|
|
granblueId: '',
|
|
avatar: {
|
|
picture: userData.avatar.picture,
|
|
element: userData.avatar.element,
|
|
},
|
|
gender: userData.gender,
|
|
language: userData.language,
|
|
theme: userData.theme,
|
|
bahamut: userData.bahamut || false,
|
|
}
|
|
}
|
|
} catch (error) {
|
|
console.error('Error parsing account cookies:', error)
|
|
}
|
|
}
|
|
}, [])
|
|
|
|
return null
|
|
} |