✨ feat : zustand persist 추가

src/app/store/index.tsx

@@ -1,21 +1,25 @@
-import { create } from "zustand";
+import { create, StateCreator } from "zustand";
+import { persist } from "zustand/middleware";
 
 type User = {
   accessToken: string;
 };
 
-type Store = {
+type UserState = {
   user: User | null;
   login: (accessToken: string) => void;
   logout: () => void;
 };
 
-export const useStore = create<Store>()((set) => ({
+export const useStoreSlice: StateCreator<UserState> = (set) => ({
   user: null,
-  login: (accessToken: string) => {
-    localStorage.setItem("accessToken", accessToken);
-    document.cookie = `accessToken=${localStorage.getItem("accessToken")}`;
-    return set(() => ({ user: { accessToken } }));
-  },
+  login: (accessToken: string) => set(() => ({ user: { accessToken } })),
   logout: () => set(() => ({ user: null })),
-}));
+});
+
+const persistedUserStore = persist<UserState>(useStoreSlice, {
+  name: "user",
+  getStorage: () => localStorage,
+});
+
+export const useUserStore = create(persistedUserStore);

src/pages/login/ui/index.tsx

@@ -1,4 +1,4 @@
-import { useStore } from "@/app/store";
+import { useUserStore } from "@/app/store";
 import { postSignIn } from "@/shared/api/api";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { FieldValues, useForm } from "react-hook-form";
@@ -11,7 +11,7 @@ const schema = z.object({
 });
 // 네트워크 요청을 보내기 전에 형식 검사
 export function LoginPage() {
-  const { login } = useStore();
+  const { login } = useUserStore();
   const navigate = useNavigate();
   const {
     register,

src/widgets/header/ui/header.tsx

@@ -3,10 +3,10 @@ import logoUrl from "/src/shared/asset/headerLogo.png";
 import { Link } from "react-router-dom";
 import loginUrl from "/src/shared/asset/login.png";
 import { Button } from "@/shared/ui/Button";
-import { useStore } from "@/app/store";
+import { useUserStore } from "@/app/store";
 
 export const Header = () => {
-  const { user } = useStore();
+  const { user } = useUserStore();
   return (
     <header className="header">
       <div className="wrapper">