Merge pull request #49 from LikeLionHGU/#43/ConnectSignInAPI-최예라

feat: 강좌 상세정보 페이지 찜하기 api 연결
LikeLionHGU · Aug 3, 2024 · 719b24e · 719b24e
2 parents cf7c3fb + f7ec234
commit 719b24e
Showing 1 changed file with 26 additions and 5 deletions.
diff --git a/src/components/LectureListPage/LectureDetailContent.jsx b/src/components/LectureListPage/LectureDetailContent.jsx
@@ -20,7 +20,6 @@ function LectureDetailContent() {
     useState(false);
 
   const [data, setData] = useState();
-
   const [isLike, setIsLike] = useState(false);
 
   useEffect(() => {
@@ -36,6 +35,7 @@ function LectureDetailContent() {
       .then((response) => {
         console.log(response.data);
         setData(response.data);
+        setIsLike(response.data.like);
       });
   }, [courseId]);
 
@@ -69,10 +69,31 @@ function LectureDetailContent() {
   };
 
   const handleHeartIconClick = () => {
-    setIsLike((prevState) => !prevState);
-    if (isLike === false) {
-      alert("찜한 강좌에 저장되었습니다.");
-    }
+    const newLikeState = !isLike;
+    setIsLike(newLikeState);
+
+    axios
+      .post(
+        `${process.env.REACT_APP_HOST_URL}/api/course/like?courseId=${courseId}`,
+        {},
+        {
+          headers: {
+            Authorization: `Bearer ${localStorage.getItem("jwtToken")}`,
+          },
+        }
+      )
+      .then((response) => {
+        console.log(response.data);
+        if (newLikeState) {
+          alert("찜한 강좌에 저장되었습니다.");
+        } else {
+          alert("찜한 강좌에서 제거되었습니다.");
+        }
+      })
+      .catch((error) => {
+        console.error("Error updating like status:", error);
+        setIsLike(!newLikeState); // 실패시 상태 롤백
+      });
   };
 
   useEffect(() => {