diff --git a/src/app/layout.tsx b/src/app/layout.tsx index c15444e..4720d1e 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -8,7 +8,7 @@ import { getAuthCookie } from "@/lib/server-auth"; import { ThemeProvider } from "@/contexts/theme/ThemeContext"; import { UserProvider } from "@/contexts/auth/UserContext"; -// getUser를 layout 레벨에서 캐싱 +// getUser 함수 수정 const getUser = async () => { const accessToken = getAuthCookie(); @@ -25,8 +25,14 @@ const getUser = async () => { credentials: "include", }); - if (!response.ok) return null; - return response.json(); + if (!response.ok) { + console.error('Failed to fetch user:', response.status); + return null; + } + + // response.json() 한 번만 호출 + const userData = await response.json(); + return userData; } catch (error) { console.error('Failed to fetch user:', error); return null; @@ -51,14 +57,16 @@ export default async function RootLayout({ }: { children: React.ReactNode; }) { - const user = await getUser(); + // 초기 유저 정보 가져오기 + const initialUser = await getUser(); + const isAuthenticated = !!initialUser; return ( - - + +
diff --git a/src/components/profile/AlbumList.tsx b/src/components/profile/AlbumList.tsx index 031f175..def6c08 100644 --- a/src/components/profile/AlbumList.tsx +++ b/src/components/profile/AlbumList.tsx @@ -69,10 +69,10 @@ export function AlbumList({ albums }: AlbumListProps) { {/* 앨범 정보 */}
-

+

{album.title}

-
+
{formatDate(album.releaseDate)}
diff --git a/src/contexts/auth/AuthContext.tsx b/src/contexts/auth/AuthContext.tsx index 3955990..26594ec 100644 --- a/src/contexts/auth/AuthContext.tsx +++ b/src/contexts/auth/AuthContext.tsx @@ -1,7 +1,8 @@ "use client"; -import { createContext, useContext, useCallback, useMemo, useReducer } from "react"; +import { createContext, useContext, useCallback, useMemo, useReducer, useEffect } from "react"; import { AuthContextType, AuthState } from "./types"; +import { checkAuth } from "@/lib/auth"; const initialState: AuthState = { isAuthenticated: false, @@ -29,8 +30,32 @@ function authReducer(state: AuthState, action: AuthAction): AuthState { const AuthContext = createContext(null); -export function AuthProvider({ children }: { children: React.ReactNode }) { - const [state, dispatch] = useReducer(authReducer, initialState); +interface AuthProviderProps { + children: React.ReactNode; + initialAuth: boolean; +} + +export function AuthProvider({ children, initialAuth }: AuthProviderProps) { + const [state, dispatch] = useReducer(authReducer, { + ...initialState, + isAuthenticated: initialAuth, + }); + + // 인증 상태 체크 + const checkAuthStatus = useCallback(async () => { + try { + const { isAuthenticated } = await checkAuth(); + dispatch({ type: "SET_AUTH", payload: isAuthenticated }); + } catch (error) { + console.error('Auth check failed:', error); + dispatch({ type: "SET_AUTH", payload: false }); + } + }, []); + + // 초기 마운트 시 인증 상태 체크 + useEffect(() => { + checkAuthStatus(); + }, [checkAuthStatus]); const login = useCallback(async () => { dispatch({ type: "SET_LOADING", payload: true }); @@ -69,7 +94,8 @@ export function AuthProvider({ children }: { children: React.ReactNode }) { ...state, login, logout, - }), [state, login, logout]); + checkAuthStatus, + }), [state, login, logout, checkAuthStatus]); return ( diff --git a/src/contexts/auth/UserContext.tsx b/src/contexts/auth/UserContext.tsx index 2411662..8e487df 100644 --- a/src/contexts/auth/UserContext.tsx +++ b/src/contexts/auth/UserContext.tsx @@ -1,7 +1,8 @@ "use client"; -import { createContext, useContext, useCallback, useMemo, useReducer } from "react"; +import { createContext, useContext, useCallback, useMemo, useReducer, useEffect } from "react"; import { UserContextType, UserState, User } from "./types"; +import { useAuth } from "./AuthContext"; type UserAction = | { type: "SET_USER"; payload: User | null } @@ -26,10 +27,17 @@ interface UserProviderProps { } export function UserProvider({ children, initialUser }: UserProviderProps) { + const { isAuthenticated } = useAuth(); const [state, dispatch] = useReducer(userReducer, { user: initialUser, }); + useEffect(() => { + if (!isAuthenticated) { + dispatch({ type: "CLEAR_USER" }); + } + }, [isAuthenticated]); + const updateUser = useCallback((user: User) => { dispatch({ type: "SET_USER", payload: user }); }, []); diff --git a/src/lib/auth.ts b/src/lib/auth.ts index c6307b3..64f954c 100644 --- a/src/lib/auth.ts +++ b/src/lib/auth.ts @@ -8,12 +8,4 @@ export async function checkAuth() { console.error('Error checking auth:', error); return { isAuthenticated: false, accessToken: null }; } -} - -// API 요청을 위한 헤더 생성 헬퍼 함수 -export function getAuthHeaders(token: string) { - return { - Authorization: `Bearer ${token}`, - 'Content-Type': 'application/json', - }; } \ No newline at end of file