🎨 fetchMyProfile 분리

src/app/main/_header.tsx

@@ -14,6 +14,7 @@ import { FaXmark } from 'react-icons/fa6';
 import WebSocketState from '../_components/webSocketState';
 import { NotificationContext } from './layout';
 import { webSocketManager } from '@/app/main/_websocketManager';
+import { fetchMyProfile } from '@/utils/profile/fetchMyProfile';
 
 type headerProps = {
   setUserProfile: Dispatch<SetStateAction<userProfileMeDto | undefined>>;
@@ -33,24 +34,6 @@ export default function MainHeader({ setUserProfile }: headerProps) {
 
   const notificationContext = useContext(NotificationContext);
 
-  const fetchMyProfile = async (): Promise<userProfileMeDto | undefined> => {
-    const user_handle = localStorage.getItem('user_handle');
-
-    if (user_handle) {
-      const res = await fetch('/api/db/fetch-my-profile', {
-        method: 'GET',
-      });
-      if (!res.ok) {
-        if (res.status === 401) {
-          forcedLogoutModalRef.current?.showModal();
-        }
-        return;
-      }
-      const data = await res.json();
-      return data;
-    }
-  };
-
   const onProfileUpdateEvent = (ev: CustomEvent<Partial<userProfileMeDto>>) => {
     const logger = new Logger('onProfileUpdateEvent', { noColor: true });
     setUserProfile((prev) => {
@@ -116,8 +99,11 @@ export default function MainHeader({ setUserProfile }: headerProps) {
   }, [notificationContext]);
 
   useEffect(() => {
+    const onResNotOk = () => {
+      forcedLogoutModalRef.current?.showModal();
+    };
     if (setUserProfile) {
-      fetchMyProfile().then((r) => {
+      fetchMyProfile(onResNotOk).then((r) => {
         setUserProfile(r);
         setQuestions_num(r?.questions ?? 0);
         setLoginChecked(true);

src/app/main/layout.tsx

@@ -38,7 +38,7 @@ export default function MainLayout({ modal, children }: { children: React.ReactN
 
   const onNotiEv = (ev: CustomEvent<NotificationPayloadTypes>) => {
     const notiData = ev.detail;
-    switch (ev.detail.notification_name) {
+    switch (notiData.notification_name) {
       case 'answer_on_my_question': {
         setNoti((prev) => {
           return {
@@ -78,7 +78,7 @@ export default function MainLayout({ modal, children }: { children: React.ReactN
     });
     fetchNoti();
 
-    const onEv = (ev: CustomEvent<string | undefined>) => {
+    const onFetchMoreEv = (ev: CustomEvent<string | undefined>) => {
       const id = ev.detail;
       fetchAllAnswers({ sort: 'DESC', limit: 25, untilId: id }).then((r) => {
         if (r.length === 0) {
@@ -113,12 +113,12 @@ export default function MainLayout({ modal, children }: { children: React.ReactN
       });
     };
 
-    AnswerEv.addFetchMoreRequestEventListener(onEv);
+    AnswerEv.addFetchMoreRequestEventListener(onFetchMoreEv);
     AnswerEv.addAnswerCreatedEventListener(onAnswerCreated);
     AnswerEv.addAnswerDeletedEventListener(onAnswerDeleted);
     NotificationEv.addNotificationEventListener(onNotiEv);
     return () => {
-      AnswerEv.removeFetchMoreRequestEventListener(onEv);
+      AnswerEv.removeFetchMoreRequestEventListener(onFetchMoreEv);
       AnswerEv.removeAnswerCreatedEventListener(onAnswerCreated);
       AnswerEv.removeAnswerDeletedEventListener(onAnswerDeleted);
       NotificationEv.removeNotificationEventListener(onNotiEv);

src/utils/profile/fetchMyProfile.ts

@@ -0,0 +1,19 @@
+import { userProfileMeDto } from '@/app/_dto/fetch-profile/Profile.dto';
+
+export async function fetchMyProfile(onResNotOk?: (code: number) => void): Promise<userProfileMeDto | undefined> {
+  const user_handle = localStorage.getItem('user_handle');
+
+  if (user_handle) {
+    const res = await fetch('/api/db/fetch-my-profile', {
+      method: 'GET',
+    });
+    if (!res.ok) {
+      if (onResNotOk) {
+        onResNotOk(res.status);
+      }
+      return;
+    }
+    const data = await res.json();
+    return data;
+  }
+}