From d710ed62113a891adbbc2914206c7a43ab9b0583 Mon Sep 17 00:00:00 2001
From: eunhak <akfmzh1207@naver.com>
Date: Fri, 17 May 2024 15:33:25 +0900
Subject: [PATCH] feat: add zustand store

---
 src/api/auth/auth.get.api.ts |  4 ++--
 src/api/types/auth.ts        |  4 ++--
 src/pages/index.tsx          | 24 ++++++++++++++++++------
 src/stores/user.ts           | 24 +++++++++++++++++-------
 4 files changed, 39 insertions(+), 17 deletions(-)

diff --git a/src/api/auth/auth.get.api.ts b/src/api/auth/auth.get.api.ts
index 6f25f8d..e12cc8c 100644
--- a/src/api/auth/auth.get.api.ts
+++ b/src/api/auth/auth.get.api.ts
@@ -1,10 +1,10 @@
 // import { ICommon } from '../types/common';
 import { getRequest } from '../request';
-import { IUpdateProfile } from '../types/auth';
+import { UserInfoType } from '../types/auth';
 
 /* 회원 상세정보 */
 
 export const userinfo = async () => {
-  const response = await getRequest<IUpdateProfile>('members');
+  const response = await getRequest<UserInfoType>('members');
   return response;
 };
diff --git a/src/api/types/auth.ts b/src/api/types/auth.ts
index 95fe880..18b4cba 100644
--- a/src/api/types/auth.ts
+++ b/src/api/types/auth.ts
@@ -31,8 +31,8 @@ export interface IUserInfo {
   memberEmail: string;
   memberName: string;
   memberJob: string;
-  memberPhone: string;
-  memberBirthDate: string;
+  memberNickName: string;
+  memberSmsAgree: string;
 }
 
 export interface IWithdraw {
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index b40d056..bd2eeec 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,16 +1,24 @@
 // import { Inter } from 'next/font/google';
-// import { userinfo } from '@/api/auth/auth.get.api';
+import { userinfo } from '@/api/auth/auth.get.api';
 // import Layout from '@/components/layout/Layout';
+import { useMember, useSetMember } from '@/stores/user';
 import Image from 'next/image';
-// import { useEffect } from 'react';
+import { useEffect } from 'react';
+import { useQuery } from 'react-query';
 
 // const inter = Inter({ subsets: ['latin'] });
 
 export default function Home() {
-  // useEffect(() => {
-  //   userinfo();
-  // }, []);
-
+  ////////////// zustand 테스트 부분//////////////////
+  const member = useMember();
+  const { data: memberData } = useQuery('userinfo', userinfo);
+  const setmember = useSetMember();
+  useEffect(() => {
+    console.log(memberData);
+    setmember(memberData?.data);
+  }, [memberData, setmember]);
+  console.log(member);
+  /////////////////////////////////////////////////////
   return (
     <main className={`flex min-h-screen flex-col items-center justify-between p-24 `}>
       <div className=" z-10 max-w-5xl w-full items-center justify-between font-mono text-sm lg:flex">
@@ -30,6 +38,10 @@ export default function Home() {
               height={24}
               priority
             />
+            {/*
+             */}
+            {/* 여기서 test */}
+            {member?.memberEmail}
           </a>
         </div>
       </div>
diff --git a/src/stores/user.ts b/src/stores/user.ts
index b9591ff..b294c12 100644
--- a/src/stores/user.ts
+++ b/src/stores/user.ts
@@ -1,28 +1,38 @@
+import { IUserInfo } from '@/api/types/auth';
 import { create } from 'zustand';
 import { persist } from 'zustand/middleware';
 
 /* eslint-disable no-unused-vars */
 
 interface IMember {
-  member: object;
-  setmember: (payload: string) => void;
+  member: IUserInfo;
+  setmember: (payload: IUserInfo | undefined) => void;
 }
 
-export const useMemberStore = create(
+const useMemberStore = create(
   persist<IMember>(
     (set) => ({
-      member: { job: '' },
-      setmember: (payload: string) =>
+      member: {
+        memberEmail: '',
+        memberName: '',
+        memberNickName: '',
+        memberJob: '',
+        memberSmsAgree: ''
+      },
+      setmember: (payload: IUserInfo | undefined) =>
         set((state) => ({
           ...state,
           member: {
             ...state.member,
-            job: payload
+            ...payload
           }
         }))
     }),
     {
-      name: 'job'
+      name: 'member'
     }
   )
 );
+
+export const useMember = () => useMemberStore((state) => state.member);
+export const useSetMember = () => useMemberStore((state) => state.setmember);