fix: 변수명 변경

Techeer-blabla · Dec 30, 2024 · d956984 · d956984
1 parent bd8adfe
commit d956984
Show file tree

Hide file tree

Showing 5 changed files with 120 additions and 13 deletions.
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -21,6 +21,7 @@ export default function App() {
               <Route path="/" element={<MainPage />} />
               <Route path="/login" element={<Login />} />
               <Route path="/search" element={<SearchPage />} />
+
               <Route element={<ProtectedRoute />}>
                 <Route path="/feedback/:id" element={<ResumeFeedbackPage />} />
                 <Route path="/upload" element={<Upload />} />

diff --git a/frontend/src/api/bookMarkApi.ts b/frontend/src/api/bookMarkApi.ts
@@ -0,0 +1,38 @@
+import { jsonAxios } from "./axios.config.ts";
+
+// 북마크 추가
+export const postBookmark = async (resumeId: number) => {
+  try {
+    console.log("아이디", resumeId);
+    const response = await jsonAxios.post(`/bookmarks/${resumeId}`);
+    // 응답에서 bookmark_id를 받아옵니다
+    const bookmarkId = response.data.result.bookmark_id;
+    return bookmarkId;
+  } catch (error) {
+    console.error("북마크 추가 오류:", error);
+    throw error;
+  }
+};
+
+// 북마크 조회
+export const getBookmarkById = async (userId: number) => {
+  try {
+    const response = await jsonAxios.get(`/bookmarks/users/${userId}`);
+    return response.data;
+  } catch (error) {
+    console.error("북마크 조회 오류:", error);
+    throw error;
+  }
+};
+
+// 북마크 삭제
+export const deleteBookmarkById = async (bookmarkId: number) => {
+  try {
+    const response = await jsonAxios.delete(`/bookmarks/${bookmarkId}`);
+    console.log("북마크 삭제 성공:", response.data);
+    return response.data;
+  } catch (error) {
+    console.error("북마크 삭제 오류:", error);
+    throw error;
+  }
+};
diff --git a/frontend/src/components/common/Navbar.tsx b/frontend/src/components/common/Navbar.tsx
@@ -25,7 +25,7 @@ function Navbar() {
         });
 
         // 응답이 성공적일 경우 사용자 정보와 상태 설정
-        if (response.data?.message === "USER_200") {
+        if (response.data?.code === "USER_200") {
           setLoginStatus(1); // 로그인 상태 업데이트
           setUserName(response.data?.result.username); // 사용자 이름 설정
         } else {
@@ -38,7 +38,7 @@ function Navbar() {
     };
 
     checkAuth();
-  }, [setLoginStatus]);
+  }, [loginStatus]);
 
   const moveMainPage = () => {
     navigate("/");

diff --git a/frontend/src/pages/ResumeFeedbackPage.tsx b/frontend/src/pages/ResumeFeedbackPage.tsx
@@ -14,25 +14,41 @@ import {
 import { AddFeedbackPoint, FeedbackPoint, ResumeData } from "../types.ts";
 import useResumeStore from "../store/ResumeStore.ts";
 import { useParams } from "react-router-dom";
+import { Bookmark, BookmarkMinus } from "lucide-react";
+import { postBookmark, deleteBookmarkById } from "../api/bookMarkApi.ts";
 
 function ResumeFeedbackPage() {
   const [resumeData, setResumeData] = useState<ResumeData | null>(null); //이력서 데이터를 관리
   const [feedbackPoints, setFeedbackPoints] = useState<FeedbackPoint[]>([]); //피드백 데이터를 관리
   const [hoveredCommentId, setHoveredCommentId] = useState<number | null>(null); //마우스 호버시 코멘트 아이디를 관리
   const [loading, setLoading] = useState<boolean>(true); //로딩 상태를 관리
   const [error, setError] = useState<string | null>(null); //에러 상태를 관리
-  const { resumeId, setResumeUrl } = useResumeStore(); //이력서 아이디와 이력서 URL을 관리 -> 이게 왜 필요한지 모르겠음
+  const { setResumeUrl } = useResumeStore(); //이력서 아이디와 이력서 URL을 관리 -> 이게 왜 필요한지 모르겠음
   const { id } = useParams(); // useParams로 URL의 id 파라미터 가져오기
+  const [isBookmarked, setIsBookmarked] = useState<boolean>(false); // 북마크 상태
+  const [bookmarkId, setBookmarkId] = useState<number | null>(null); // 북마크 ID 저장
 
   useEffect(() => {
     const fetchData = async () => {
+      console.log("api호출");
+      if (!id) {
+        setError("Resume ID is missing.");
+        return;
+      }
+
       try {
         setLoading(true);
         setError(null);
         const data = await getResumeApi(Number(id)); //여기서 레쥬메 아이디로 관리를 해서 데이터를 불러옴
         setResumeData(data);
-        console.log(data);
+        // 북마크 상태 초기화
+        const bookmarkResponse = await postBookmark(Number(id)); // userId 제거, resumeId만 사용
+        if (bookmarkResponse) {
+          setIsBookmarked(true);
+          setBookmarkId(bookmarkResponse);
+        }
         setResumeUrl(data.fileUrl);
+        console.log("id:", id);
         setFeedbackPoints(data.feedbackResponses || []); // 관련된 설정들
       } catch (error) {
         console.error("Failed to fetch resume data", error);
@@ -41,13 +57,43 @@ function ResumeFeedbackPage() {
         setLoading(false);
       }
     };
+
     fetchData();
   }, [id]);
 
+  // 북마크 토글 기능
+  const toggleBookmark = async () => {
+    if (!id) {
+      setError("Resume ID is missing.");
+      return;
+    }
+
+    try {
+      if (isBookmarked) {
+        // 북마크 해제
+        if (bookmarkId !== null) {
+          await deleteBookmarkById(bookmarkId);
+        }
+        setIsBookmarked(false);
+        setBookmarkId(null);
+      } else {
+        // 북마크 추가
+        const response = await postBookmark(Number(id)); // userId 제거, resumeId만 사용
+        console.log("포스트북마크 값", response);
+        setIsBookmarked(true);
+        setBookmarkId(response); // 서버로부터 받은 북마크 ID 저장
+        console.log("북마크 아이디 생성", response);
+      }
+    } catch (error) {
+      console.error("Failed to toggle bookmark", error);
+      alert("북마크 상태를 변경할 수 없습니다. 다시 시도해주세요.");
+    }
+  };
+
   const handleAiFeedback = async () => {
     setLoading(true);
     try {
-      const aiFeedback = await postAiFeedback(resumeId);
+      const aiFeedback = await postAiFeedback(Number(id));
       setFeedbackPoints((prevPoints) => [
         ...prevPoints,
         ...aiFeedback.feedbacks,
@@ -78,8 +124,8 @@ function ResumeFeedbackPage() {
         content: point.content,
         pageNumber: 1,
       };
-      await addFeedbackApi(Number(resumeId), newPoint);
-      const updatedData = await getResumeApi(Number(resumeId));
+      await addFeedbackApi(Number(id), newPoint);
+      const updatedData = await getResumeApi(Number(id));
       console.log("업데이트 데이터: ", updatedData);
       setFeedbackPoints(updatedData.feedbackResponses);
     } catch (error) {
@@ -95,10 +141,10 @@ function ResumeFeedbackPage() {
       setLoading(true);
       setError(null);
 
-      // Call the API to delete the feedback point
-      await deleteFeedbackApi(Number(resumeId), id);
+      // 피드백 점 삭제 API 호출
+      await deleteFeedbackApi(Number(id), id);
 
-      // After successful deletion, update the local state to remove the feedback
+      // 삭제 후 상태 갱신
       setFeedbackPoints((prevComments) =>
         (prevComments || []).filter((item) => item.id !== id)
       );
@@ -132,6 +178,29 @@ function ResumeFeedbackPage() {
       <Layout
         sidebar={
           <div className="flex flex-col justify-between bg-white p-2 mt-10">
+            {/* 북마크 버튼 */}
+            <button
+              onClick={toggleBookmark}
+              className={`flex items-center px-6 py-3 rounded-lg ${
+                isBookmarked
+                  ? "bg-yellow-100 text-yellow-900"
+                  : "text-gray-500 hover:bg-gray-50"
+              }`}
+            >
+              {isBookmarked ? (
+                <>
+                  <BookmarkMinus className="w-5 h-5 mr-2" />
+                  북마크 제거
+                </>
+              ) : (
+                <>
+                  <Bookmark className="w-5 h-5 mr-2" />
+                  북마크 추가
+                </>
+              )}
+            </button>
+
+            {/* Resume Overview */}
             <ResumeOverview
               userName={resumeData.userName}
               position={resumeData.position}
@@ -140,6 +209,7 @@ function ResumeFeedbackPage() {
               fileUrl={resumeData.fileUrl}
               isLoading={loading}
             />
+
             {/* Comment Section */}
             <div className="overflow-y-auto mt-2">
               <CommentSection

diff --git a/frontend/src/utils/Token.tsx b/frontend/src/utils/Token.tsx
@@ -17,12 +17,10 @@ function ProtectedRoute() {
         });
 
         // 응답 코드가 USER_200일 경우 인증 성공
-        if (response.data?.message === "USER_200") {
-          console.log("성공: ", response.data?.message);
+        if (response.data?.code === "USER_200") {
           setIsAuthenticated(true);
           setLoginStatus(1);
         } else {
-          console.log("실패: ", response.data?.message);
           setIsAuthenticated(false);
           setLoginStatus(0);
         }