feat :: API response 전역 state에 적용

src/apis/students/index.ts

@@ -3,7 +3,7 @@ import { useMutation, useQuery } from "@tanstack/react-query";
 import { useToastStore } from "@team-return/design-system";
 import axios, { AxiosError } from "axios";
 import { useRouter } from "next/navigation";
-import { useContext } from "react";
+import { Dispatch, SetStateAction, useContext } from "react";
 import { useCookies } from "react-cookie";
 import { instance } from "../axios";
 import { ResponseBody } from "../user/type";
@@ -74,29 +74,14 @@ export const useSignup = () => {
   );
 };
 
-export const useMyProfile = () => {
-  const { setUserProfile } = useContext(UserProfileContext);
-  return useQuery(
-    ["myProfile"],
-    async () => {
-      const { data } = await instance.get<MyProfileProps>(`${router}/my`);
-      return data;
-    },
-    {
-      refetchOnWindowFocus: false,
-      onSuccess: ({
-        student_name,
-        student_gcn,
-        department,
-        profile_image_url,
-      }) => {
-        setUserProfile({
-          student_name,
-          student_gcn,
-          department,
-          profile_image_url,
-        });
-      },
-    }
-  );
+export const useMyProfile = async (
+  setUserProfile: Dispatch<SetStateAction<MyProfileProps>>
+) => {
+  const data = await instance
+    .get<MyProfileProps>(`${router}/my`)
+    .then(({ data: profile }) => {
+      setUserProfile(profile);
+      return profile;
+    });
+  return data;
 };

src/apis/user/index.ts

@@ -3,7 +3,6 @@ import { useToastStore } from "@team-return/design-system";
 import axios, { AxiosError } from "axios";
 import { useRouter } from "next/navigation";
 import { useCookies } from "react-cookie";
-import { useMyProfile } from "../students";
 import { RequestBody, ResponseBody } from "./type";
 
 const router = "/users";
@@ -47,7 +46,6 @@ export const useLogin = (body: RequestBody, checkBoxValue: boolean) => {
           }
           navigator.push("/");
         }
-        useMyProfile()
       },
       onError: (error: AxiosError) => {
         switch (error.response?.status) {

src/app/page.tsx

@@ -1,8 +1,8 @@
 "use client";
 
+import BandBanner from "@/components/BandBanner";
 import Banner from "@/components/Carousel";
 import Suggestion from "@/components/Suggestion";
-import BandBanner from "@/components/BandBanner";
 
 export default function Home() {
   return (

src/components/Provider.tsx

@@ -16,14 +16,14 @@ export default function Provider({ children }: PropsType) {
   return (
     <QueryClientProvider client={queryClient}>
       <CookiesProvider>
-        <UserProfileProvider>
-          <ModalContextProvider>
-            <SignupContextProvider>
+        <ModalContextProvider>
+          <SignupContextProvider>
+            <UserProfileProvider>
               <ToastContainer />
               {children}
-            </SignupContextProvider>
-          </ModalContextProvider>
-        </UserProfileProvider>
+            </UserProfileProvider>
+          </SignupContextProvider>
+        </ModalContextProvider>
       </CookiesProvider>
     </QueryClientProvider>
   );

src/components/common/Header.tsx

@@ -1,15 +1,19 @@
 "use client";
 
+import { useMyProfile } from "@/apis/students";
 import { UserProfileContext } from "@/context/UserContext";
 import Logo from "@public/Logo.png";
+import { access } from "fs";
 import Image from "next/image";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import React, { useContext, useEffect } from "react";
+import { Cookies, useCookies } from "react-cookie";
 
 function Header() {
   const pathname = usePathname();
-  const {userProfile} = useContext(UserProfileContext)
+  const { userProfile, setUserProfile } = useContext(UserProfileContext);
+  const [cookies] = useCookies();
   useEffect(() => {
     if (
       pathname.toString().indexOf("/apply") !== -1 ||
@@ -20,12 +24,17 @@ function Header() {
       document.querySelector("body")!.style.backgroundColor = "#ffffff";
     }
   }, [pathname]);
+
+  useEffect(() => {
+    if(cookies.access_token){
+      useMyProfile(setUserProfile);
+    }
+  }, [cookies.access_token]);
 
   if (pathname.toString().indexOf("/account") !== -1) {
     return null;
   }
 
-
   return (
     <div
       className={`w-screen h-[68px] bg-white flex justify-between shadow-[0_2px_4px_0_rgba(229,229,229,0.2)] items-center fixed top-0 left-0 py-[12px] md:px-[17.5vw] sm:px-[7.5vw] z-[4]`}

src/util/object/kebabMenuItems.ts

@@ -41,7 +41,6 @@ export const getMypageKebabItems = (): KebabItemType[] => {
     {
       label: "로그아웃",
       onClick: () => {
-        console.log("로그아웃");
         cookies.remove("access_token", { path: "/" });
         cookies.remove("refresh_token", { path: "/" });
         navigator.push("/account/login");