update : 로그아웃(#10)

Kim-s-Crew · Jun 5, 2024 · 35a3e9d · 35a3e9d
1 parent 5a30e89
commit 35a3e9d
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 1 deletion.
diff --git a/src/apis/auth.ts b/src/apis/auth.ts
@@ -20,6 +20,11 @@ export const login = async (reqData: loginReqData) => {
   }
 };
 
+// 로그아웃
+export const logout = async () => {
+  sessionStorage.removeItem('token');
+};
+
 // 회원가입
 export const registerUser = async (reqData: registerReqData) => {
   console.log('회원가입 펑션 호출됨');

diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx
@@ -7,6 +7,7 @@ import { useRouter } from 'next/navigation';
 import { Button, Input, Spacer } from '@nextui-org/react';
 import { useForm, SubmitHandler } from 'react-hook-form';
 import { login } from '../../apis/auth';
+import { useAuthStore } from '@/zustand/store';
 
 interface FormValues {
   email: string;
@@ -15,6 +16,7 @@ interface FormValues {
 
 const LoginPage = () => {
   const router = useRouter();
+  const { setIsLoggedIn } = useAuthStore();
 
   const {
     register,
@@ -30,6 +32,7 @@ const LoginPage = () => {
     const { email, password } = formData;
     console.log(email, password);
     login({ email, password });
+    setIsLoggedIn(true);
     router.push('/');
   };
 

diff --git a/src/components/admin/Header.tsx b/src/components/admin/Header.tsx
@@ -1,9 +1,20 @@
+'use client';
 import Image from 'next/image';
 import React from 'react';
 import logo from '@/assets/images/spaghetti_logo.png';
 import Link from 'next/link';
+import { logout } from '@/apis/auth';
+import { useRouter } from 'next/navigation';
+import { useAuthStore } from '@/zustand/store';
 
 const Header = () => {
+  const router = useRouter();
+  const { setIsLoggedIn } = useAuthStore();
+  const HandleLogout = () => {
+    logout();
+    setIsLoggedIn(false);
+    router.replace('/');
+  };
   return (
     <header className='flex flex-col justify-center items-center bg-slate-400 w-[200px] min-w-[200px] h-screen p-6'>
       <div className='mb-8'>
@@ -40,7 +51,9 @@ const Header = () => {
           </li>
         </ul>
         <div>
-          <span className='text-3xl'>🚪</span>
+          <span className='text-3xl cursor-pointer' onClick={HandleLogout}>
+            🚪
+          </span>
         </div>
       </div>
     </header>