How can I re-render stats with a function and redux (for re-render likes)?

Question

I saw a lot of docs about stats but I can't find a way to re-render my stats (I'm using redux but I saw this is nothing to do in reducer or action). I only use a function onClick (for likes true or false) and other function to show the results with some conditions:

Here is my functions:

 const likesData = useSelector((state) => state.likesReducer);

const handleLikes = async () => {
    let id = userData.id;
    let idComment = comment.idObject;
      dispatch(likesComment(id, idComment)).then(() =>  
        dispatch(getComment()))  
   
 
};

const isLiked = () => {
  return Array.from(likesData).filter(likes => likes.id === userData.id && likes.idComment === comment.idObject).length > 0;
 };
 
 const returnLikes = (commentId) => {
  return Array.from(likesData).filter(likes => likes.idComment === commentId).length;
};

Here is my return :

    <div className="home-icon-post" onClick={() => handleLikes()} > 
             
                  {
                  <FontAwesomeIcon className={`${isLiked(comment.idObject) ? "heartFull" 
                   : "heartEmpty"}`}  icon={["fa","heart"]} />
                  }
             </div>
                  <span>
                    <p>{returnLikes(comment.idObject)}</p>
                  </span>

here is my action likes:

And my reducer likes:

Thanks for help :)

Is there more code in this component? I don't see why it would not re-render on its own. — timotgl, Aug 31 '22 at 08:45
Yes there is more code but nothing to do with those function :/ I can show my reducer and action if it can help — Elodie Jean, Aug 31 '22 at 09:42
Maybe an example of how the data inside `state.likesReducer` changes would be helpful — timotgl, Aug 31 '22 at 09:56
let me update my question with the reducer and action I think is my data response that is wrong. — Elodie Jean, Aug 31 '22 at 15:14
There are some strange things happening in your likesReducer: when it handles `LIKES_COMMENT` the entire state changes to an array (`initialState` is an object). Inside the .map loop you're spreading the entire previous state into each mapped array element? Since the rest of the code looks fine I'd check if maybe there is something unexpected happening in the reducer. — timotgl, Aug 31 '22 at 15:34
I thought I could Map my state to change only the element onclick to catch the id and idComment — Elodie Jean, Aug 31 '22 at 16:43

score 0 · Answer 1 · answered Sep 01 '22 at 19:22

Ok it was a little error on my callback "dispatch". Here is my old call:

const handleLikes = async () => {
let id = userData.id;
let idComment = comment.idObject;
  dispatch(likesComment(id, idComment)).then(() =>  
    dispatch(getComment()))

};

The problem what that I "dispatch(getComment())" but I should call "dispatch(getAllLike))"

Thanks for helping me !

How can I re-render stats with a function and redux (for re-render likes)?

1 Answers1