[fix] 메인페이지 토큰/어드민페이지 토큰 분리, 로그인시 환영합니다가 즉시 없어지던 버그 수정

src/common/constants.js

@@ -1,2 +1,3 @@
 export const EVENT_ID = "0";
-export const TOKEN_ID = "AWESOME_ORANGE_ACCESS_TOKEN";
+export const SERVICE_TOKEN_ID = "AWESOME_ORANGE_ACCESS_TOKEN";
+export const ADMIN_TOKEN_ID = "AWESOME_ORANGE_ADMIN_ACCESS_TOKEN";

src/common/dataFetch/tokenSaver.js

@@ -1,31 +1,31 @@
-import { TOKEN_ID } from "@common/constants.js";
-
 class TokenSaver {
   initialized = false;
   token = null;
-  init() {
+  tokenId = null;
+  init(tokenId) {
     if (typeof window === "undefined") return;
-    this.token = localStorage.getItem(TOKEN_ID) ?? null;
+    this.tokenId = tokenId;
+    this.token = localStorage.getItem(this.tokenId) ?? null;
     this.initialized = true;
   }
-  get() {
+  get(tokenId = this.tokenId) {
     if (this.initialized) return this.token;
-    this.init();
+    this.init(tokenId);
     return this.token;
   }
   set(token) {
     this.token = token;
-    if (typeof window !== "undefined") localStorage.setItem(TOKEN_ID, token);
+    if (typeof window !== "undefined") localStorage.setItem(this.tokenId, token);
     this.initialzed = true;
   }
-  has() {
+  has(tokenId = this.tokenId) {
     if (this.initialized) return this.token !== null;
-    this.init();
+    this.init(tokenId);
     return this.token !== null;
   }
   remove() {
     this.token = null;
-    if (typeof window !== "undefined") localStorage.removeItem(TOKEN_ID);
+    if (typeof window !== "undefined") localStorage.removeItem(this.tokenId);
     this.initialzed = true;
   }
 }

src/common/modal/modal.jsx

@@ -1,6 +1,5 @@
 import { createContext, useCallback, useEffect, useState, useRef } from "react";
 import useModalStore, { closeModal } from "./store.js";
-import { delay } from "@common/utils.js";
 
 export const ModalCloseContext = createContext(() => {
   console.log("모달이 닫힙니다.");
@@ -10,12 +9,16 @@ function Modal({ layer }) {
   const timeoutRef = useRef(null);
   const child = useModalStore(layer);
   const [opacity, setOpacity] = useState(0);
-  const close = useCallback(async () => {
-    setOpacity(0);
-    if (timeoutRef.current === null) {
-      await delay(150);
-      closeModal(layer);
-    }
+  const close = useCallback(() => {
+    return new Promise( (resolve)=>{
+      setOpacity(0);
+
+      if (timeoutRef.current !== null) return resolve();
+      timeoutRef.current = setTimeout( ()=>{
+        closeModal(layer);
+        resolve();
+      }, 150 );
+    } );
   }, [layer]);
 
   useEffect(() => {

src/mainPage/shared/auth/store.js

@@ -1,5 +1,6 @@
 import { create } from "zustand";
 import tokenSaver from "@common/dataFetch/tokenSaver.js";
+import { SERVICE_TOKEN_ID } from "@common/constants.js";
 
 const userStore = create(() => ({
   isLogin: false,
@@ -23,8 +24,8 @@ export function logout() {
 }
 
 export function initLoginState() {
-  tokenSaver.init();
-  const token = tokenSaver.get();
+  tokenSaver.init(SERVICE_TOKEN_ID);
+  const token = tokenSaver.get(SERVICE_TOKEN_ID);
   const userName = parseTokenToUserName(token);
   if (token === null)
     userStore.setState(() => ({ isLogin: false, userName: "" }));