Linux SRV-16 6.18.44-paas #1 SMP PREEMPT_DYNAMIC Thu Aug 13 10:08:12 UTC 2026 x86_64
/srv/data/trash/vhost_www.traiteur-75.fr_1689065491/htdocs/assets/js/front/
/srv/data/trash/vhost_www.traiteur-75.fr_1689065491/htdocs/assets/js/front/LikeButton.js
 import React, { useEffect, useState } from 'react';
import addWishlist from './api/addWishlist';
import removeWishlist from './api/removeWishlist';

const LikeButton = ({ productId, userId, isWishlist, countWishlist }) => {
    const [isWishlistState, setIsWishlistState] = useState(false)
    const [countWishlistState, setCountWishlistState] = useState(0)

    useEffect(() => {
        if (isWishlist === "true") {
            setIsWishlistState(true)
        }
        if (isNaN(+countWishlist)) {
            setCountWishlistState(0)
        }
        else {
            setCountWishlistState(+countWishlist)
        }

    }, []);

    const handleClick = () => {
        if (userId === "false") {
            alert("Vous ne pouvez pas ajouté cet article à votre wishlist, car vous n'etes pas connecté.")
        }
        if (!isWishlistState && userId !== "false") {
            addWishlist({
                userId,
                productId
            })
            setCountWishlistState(countWishlistState + 1)
            setIsWishlistState(!isWishlistState);

        }
        if (isWishlistState && userId !== "false") {
            removeWishlist({
                userId,
                productId
            })
            setCountWishlistState(countWishlistState - 1)

            setIsWishlistState(!isWishlistState);

        }

    }

    if (!isWishlistState) {
        return (
            <a className="btn d-flex" onClick={() => handleClick()}>
                <svg width="35" height="46" viewBox="0 0 35 46" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M11.4977 42.8979C11.3648 42.4989 11.2073 42.0625 11.0333 41.6027C10.3658 39.8376 9.38311 37.537 8.36372 35.2302C7.35633 32.9505 6.30187 30.6398 5.46026 28.7955L5.4241 28.7162C4.55376 26.8089 3.96418 25.5125 3.84679 25.1924L3.84518 25.188C1.13318 17.862 0.243543 10.191 4.07538 3.53622C4.76334 2.34944 5.41159 1.70122 6.0388 1.57543L6.03881 1.57543L6.04212 1.57476C8.08268 1.16074 10.1438 2.55939 11.9086 5.33823C13.6223 8.03654 14.6125 11.4033 14.6587 13.4309L14.7886 19.1339L17.4807 14.1046C19.1269 11.0292 20.8294 8.22757 23.3339 6.49133C24.7222 5.53119 26.5273 4.99086 28.1985 5.08038C29.8378 5.16819 31.2628 5.84607 32.1631 7.24154C33.6733 9.58343 33.8193 12.825 33.0256 16.4757C31.9062 21.6211 29.0465 27.0007 26.837 30.3207C23.3324 35.5742 17.3139 39.8123 11.4977 42.8979Z" stroke="#DE25A4" stroke-width="3" />
                </svg>&nbsp; <p className="fs-3 numberWishlist">{countWishlistState}</p>
            </a>
        )
    }
    else {
        return (
            <a className="btn d-flex" onClick={() => handleClick()}>
                <svg width="31" height="40" viewBox="0 0 31 40" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M30.5495 14.8752C31.2824 11.504 31.2233 8.20519 29.6038 5.69391C27.4603 2.37098 22.8265 2.64021 19.9107 4.65727C17.4008 6.39708 15.7656 9.14945 14.3116 11.8656C14.217 7.715 10.4344 -0.992126 5.08741 0.0927472C3.90533 0.329812 3.07394 1.40666 2.45926 2.46743C-1.2249 8.86416 -0.298941 16.1288 2.15979 22.7706C2.66809 24.1568 10.064 39.562 9.1853 40C14.8632 37.1874 21.2544 33.0206 24.8755 27.5923C26.8811 24.5787 29.5092 19.6566 30.5495 14.8752Z" fill="#DE25A4" fill-opacity="0.65" />
                </svg>&nbsp; <p className="fs-3 numberWishlist"> {countWishlistState}</p>
            </a>
        )
    }

}
export default LikeButton;