[Feat] bookie 대화 히스토리 불러오기

src/App.tsx

@@ -2,6 +2,7 @@ import './App.css';
 import { RouterProvider } from 'react-router-dom';
 import { router } from './routes/router';
 import { useEffect } from 'react';
+import { Toaster } from 'react-hot-toast';
 
 function App() {
   useEffect(() => {
@@ -19,6 +20,7 @@ function App() {
   return (
     <>
       <RouterProvider router={router} />
+      <Toaster />
     </>
   );
 }

src/api/bookie.api.ts

@@ -16,3 +16,17 @@ export const sendMessageToChatAPI = async (message: string) => {
     throw error;
   }
 };
+
+// 이전 히스토리 가져오기
+export const getHistory = async () => {
+  try {
+    const response = await instance.get('/bookie/history');
+
+    if (response.status === 200) {
+      return response.data;
+    }
+  } catch (error) {
+    console.log(error);
+    throw error;
+  }
+};

src/api/booksnap.api.ts

@@ -89,9 +89,9 @@ export const deleteLike = async (bookReviewId: number) => {
 };
 
 // 책 담기
-export const pickBook = async (isbn: string) => {
+export const pickBook = async (bookId: string) => {
   try {
-    const response = await instance.post(`api/pick-book`, { isbn: isbn });
+    const response = await instance.post(`api/pick-book`, { bookId: bookId });
     if (response.status == 201) {
       return { success: true, message: '책이 정상적으로 담겼습니다!' };
     }

src/components/Common/MenuBar.tsx

@@ -6,6 +6,7 @@ import SearchIcon from '@mui/icons-material/Search';
 import SmartToyIcon from '@mui/icons-material/SmartToy';
 import RateReviewIcon from '@mui/icons-material/RateReview';
 import Person2Icon from '@mui/icons-material/Person2';
+import toast from 'react-hot-toast';
 
 const MenuBar = () => {
   const nav = useNavigate();
@@ -62,6 +63,14 @@ const MenuBar = () => {
             key={menuItem.name}
             className={`flex cursor-pointer flex-col items-center px-2 ${currentMenu === menuItem.name ? 'pb-[0px] pt-[6px]' : 'py-[6px]'}`}
             onClick={() => {
+              const isAuthenticated = !!localStorage.getItem('accessToken');
+
+              const protectedMenus = ['bookie'];
+
+              if (protectedMenus.includes(menuItem.name) && !isAuthenticated) {
+                toast.error('로그인이 필요한 서비스입니다!');
+                return;
+              }
               nav(menuItem.name);
             }}
           >

src/pages/Bookie.tsx

@@ -5,7 +5,7 @@ import Input from '../components/Bookie/Input';
 import { FaRegArrowAltCircleUp } from 'react-icons/fa';
 import { IoCloseOutline } from 'react-icons/io5';
 import { useNavigate } from 'react-router-dom';
-import { sendMessageToChatAPI } from '../api/bookie.api';
+import { getHistory, sendMessageToChatAPI } from '../api/bookie.api';
 import { MdBookmarkAdd } from 'react-icons/md';
 import toast from 'react-hot-toast';
 import { pickBook } from '../api/booksnap.api';
@@ -44,6 +44,12 @@ const Bookie = () => {
     }
   }, [systemRes]);
 
+  useEffect(() => {
+    getHistory().then((data) => {
+      setSystemRes(data.chat);
+    });
+  }, []);
+
   // 메세지 보내기
   const sendMessage = async () => {
     if (!input.trim() || isComposing) return;