Merge pull request #112 from codeit9-temporary/feature/AuthStore

Fix:로그아웃 시, 사용 도중 쿠키 만료 시 user정보 초기화

Author: venise5224

components/HeaderMenu.tsx

@@ -5,12 +5,12 @@ import Link from "next/link";
 import SubmitButton from "./SubMitButton";
 import { useRouter } from "next/router";
 import useAuthStore from "@/store/useAuthStore";
-import { useRef, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import Dropdown from "./Dropdown";
 import useOutsideClick from "@/hooks/useOutsideClick";
 
 const HeaderMenu = () => {
-  const { user, logout } = useAuthStore();
+  const { user, logout, fetchUserInfo } = useAuthStore();
   const [isOpen, setIsOpen] = useState(false);
   const router = useRouter();
   const dropdownRef = useRef<HTMLDivElement | null>(null);
@@ -19,6 +19,10 @@ const HeaderMenu = () => {
     setIsOpen(false);
   });
 
+  useEffect(() => {
+    fetchUserInfo();
+  }, [fetchUserInfo]);
+
   const dropdownItems = [
     {
       label: "마이링크",

lib/api/axiosInstanceApi.ts

@@ -6,7 +6,7 @@ const axiosInstance = axios.create({
 
 export const proxy = axios.create({
   // 배포 이후에는 배포된 URL로 변경해야 함.
-  baseURL: "https://linkbrary-9-99.vercel.app",
+  baseURL: "http://localhost:3000",
 });
 
 proxy.interceptors.response.use(

store/useAuthStore.tsx

@@ -12,11 +12,8 @@ import { persist } from "zustand/middleware";
 
 interface AuthStore {
   user: User | null;
+  fetchUserInfo: () => Promise<boolean>;
   login: (body: signInProps) => Promise<boolean>;
-  SNSLogin: (
-    provider: "google" | "kakao",
-    body: easySignInProps
-  ) => Promise<boolean>;
   logout: () => Promise<void>;
 }
 
@@ -38,32 +35,40 @@ const useAuthStore = create<AuthStore>()(
     (set) => ({
       user: null,
 
-      login: async (body) => {
+      // 사용자 정보 가져오기 함수
+      fetchUserInfo: async () => {
         try {
-          const response = await postSignIn(body);
-          if (response) {
-            return await fetchUserInfo(set);
+          const userInfo = await getUserInfo();
+          if (userInfo) {
+            set({ user: userInfo });
+            return true;
+          } else {
+            set({ user: null });
+            return false;
           }
         } catch (error) {
-          console.error("로그인 중 에러가 발생했습니다", error);
+          console.error("사용자 정보 가져오기 에러", error);
         }
         return false;
       },
 
-      SNSLogin: async (provider, body) => {
+      // 로그인 함수
+      login: async (body) => {
         try {
-          const response = await postEasySignIn(provider, body);
+          const response = await postSignIn(body);
           if (response) {
             return await fetchUserInfo(set);
           }
         } catch (error) {
-          console.error("소셜 로그인 중 에러가 발생했습니다.", error);
+          console.error("로그인 중 에러가 발생했습니다", error);
         }
         return false;
       },
 
+      // 로그아웃 함수
       logout: async () => {
         try {
+          set({ user: null });
           await proxy.post("/api/auth/sign-out");
           localStorage.removeItem("auth-storage");
         } catch (error) {