وظيفة الإعجاب وعدم الإعجاب بالمنشور لا تعمل في الفرونت إند (react)

أنا أعمل على مشروع موقع تواصل اجتماعي لغرض التدريب وقمت بعمل دالة الإعجاب وعدم الإعجاب بالمنشورات بشكل جيد وعندما أضغط على "like" للنشر يعمل بشكل جيد للغاية وتتغير أيقونة الإعجاب إلى أيقونة ممتلئة(أيقونة تم الإعجاب)، لكن عندما أقوم بتحديث الصفحة يختفي الإعجاب كما لو أنه لم يكن موجوداً ، ولا أعرف السبب، لقد حاولت عمل الإعجاب من الباك إند وهو يعمل بشكل جيد وحتى الأيقونة تتغير في الصفحة عندما أفعل ذلك من الباك إند وتبقى كذلك حتى بعد تحديث الصفحة، ولكن عندما أضغط إعجاب من الصفحة مباشرة يختفي الإعجاب بمجرد تحديث الصفحة هذا يعني أن المشكلة في الفرونت إند.

هذا هو كود الإعجاب في ملف Post.jsx:

const [like, setLike] = useState([post.like.includes(userId) ? anotherLikeIcon : likeIcon]);
const [count, setCount] = useState(post.like.length);

const handleLike = async() => {


if(like == likeIcon){
        await fetch(`http://localhost:5000/api/post/${post._id}/like`, 
        {
            method:"PUT", 
            headers:{
                'Content-Type':"application/Json",
                token:accessToken
            }})
        setLike(anotherLikeIcon);
        setCount(count+1)
    } else {
        await fetch(`http://localhost:5000/api/post/${post._id}/like`, 
        {
            method:"PUT", 
            headers:{
                'Content-Type':"application/Json",
                token:accessToken
            }})
        setLike(likeIcon);
        setCount(count-1)
    }
}

فقط للعلم أنني وضعت الرمز المميز التوكن في المتغير AccessToken كـstring في نفس الملف ومع ذلك لم تُحل المشكلة