0802

src/App.js

@@ -237,38 +237,72 @@ export default function App() {
     //     }
     // }
 
-    const handleOnLike = (item) => {
-        let favoriteItem = favorites.find(it => it.collectionId == item.collectionId)
-        if (favoriteItem) {
+    // const handleOnLike = (item) => {
+    //     let favoriteItem = favorites.find(it => it.collectionId == item.collectionId)
+    //     if (favoriteItem) {
+    //         fetch(`/likes/${item.collectionId}`, {
+    //             method: 'DELETE',
+    //             headers: {},
+    //         })
+    //             .then(r => {
+    //                 let i = searchResult.find(it => it.collectionId == item.collectionId)
+    //                 if (i) {
+    //                     item.like = false;
+    //                 }
+    //                 let remains = favorites.filter((it) => it.collectionId !== item.collectionId);
+    //                 setFavorites(remains);
+    //             })
+    //             .catch(e => console.log('error when delete method >', e));
+    //     }
+    //     else {
+    //         fetch(`/likes`, {
+    //             method: 'POST',
+    //             headers: { 'Content-Type': 'application/json' },
+    //             body: JSON.stringify(item)
+    //         })
+    //             .then(r => r.json())
+    //             .then(r => {
+    //                 let i = searchResult.find(it => it.collectionId == item.collectionId)
+    //                 if (i) {
+    //                     item.like = true;
+    //                 }
+    //                 setFavorites([...favorites, item]);
+    //             })
+    //             .catch(e => console.log('error when post >', e));
+    //     }
+
+    const handleOnlike = (item) => {
+        let t = favoriteItem.find(it => it.collectionId == item.collectionId)
+
+        if (t) {
             fetch(`/likes/${item.collectionId}`, {
-                method: 'DELETE',
+                method: "DELETE",
                 headers: {},
-            })
-                .then(r => {
-                    let i = searchResult.find(it => it.collectionId == item.collectionId)
+            }).then((response) => {
+                if (response.ok) {
+                    let i = searchResult.find((is) => is.collectionId === item.collectionId);
                     if (i) {
                         item.like = false;
                     }
-                    let remains = favorites.filter((it) => it.collectionId !== item.collectionId);
-                    setFavorites(remains);
-                })
-                .catch(e => console.log('error when delete method >', e));
+                    var selc = favorites.filter((it) => it.collectionId !== item.collectionId);
+                    setFavorites(selc);
+                }
+            }).catch((e) => console.log("error deleting favorite:", e));
+
         }
         else {
             fetch(`/likes`, {
-                method: 'POST',
+                method: "POST",
                 headers: { 'Content-Type': 'application/json' },
                 body: JSON.stringify(item)
-            })
-                .then(r => r.json())
-                .then(r => {
-                    let i = searchResult.find(it => it.collectionId == item.collectionId)
+            }).then((response) => response.json()).then((data) => {
+                let i = searchResult.find(is => is.collectionId == item.collectionId);
                 if (i) {
                     item.like = true;
                 }
-                    setFavorites([...favorites, item]);
-                })
-                .catch(e => console.log('error when post >', e));
+
+                setFavorites([...favorites, item])
+            }).catch((e) => console.log("error add favorite:", e));
         }
     };
 
@@ -290,7 +324,7 @@ export default function App() {
             </Box>
 
             {currentTab == 0 && <SearchPage list={searchResult} onSearch={setSearchResult} onLike={handleOnLike} />}
-            {currentTab == 1 && <Favorites list={favorites} onLike={handleOnLike} />}
+            {currentTab == 1 && <Favorites list={favorites} onLike={handleOnlike} />}
             {currentTab == 2 &&
                 <Typography align="center" variant="h2">Item Three</Typography>}
         </React.Fragment>