Как создать динамичную смену картинок при нажатии в ReactJS

поставил себе задачу при клике на картинку like менять ее на другую в посте, чтобы пользователь понимал, что, что-либо поменялось в initialState у posts добавил значение isYouLike, которое принимает true/false идея была передавать при клике в редьюсер id поста,

let initialState = {
posts: [
    { id: 3, message: "Я в лазурном", date: '24 авг в 12:30', likesCount: 1, isYouLike: true},
    { id: 2, message: "It's my first post", date: '30 июл в 19:01', likesCount: 15, isYouLike: true},
    { id: 1, message: "Hello everybody", date: '30 июл в 19:00', likesCount: 3, isYouLike: false},
]}

замапить все посты и найти такой же id, поменять на противоположное значение isYouLike

const profileReduser = (state = initialState, action) => {
switch (action.type) {
case LIKE_IT:
        return{
            ...state,
            posts: state.posts.map(post => {
                debugger
                if(post.id === action.postId){
                    debugger
                    return { ...post, isYouLike: true, likesCount: post.likesCount++ }
                }
                return post
            })   
        }
    case DONT_LIKE_IT:
        return{
            ...state,
            users: state.posts.map(post => {
                if (post.id === action.userId) {
                    return { ...post, isYouLike: false, likesCount: post.likesCount--}
                }
                return post
            })
        }
    default:
        return state
}}

и проверку на самой картинке в компоненте

<div className={styles.like}>
                <div className={styles.onClickWrapper} >
                    <img src={props.isYouLike ? onClickLikePicture : likePicture} alt="Нравится" />
                </div>
                <p>{props.likesCount}</p>       
            </div>

На сколько я знаю onClick на саму картинку повесить нельзя, поэтому я обернул ее div'ом и при задавании ему метода onClick все ломается, картинки позываются неправильно(независимо от проверки) вот сама проверка при клике

onClick={props.isYouLike ? dislike(props.id) : like(props.id)}>

сами функции просто передавали в редьюсер id поста, подскажите пожалуйста в чем кроется моя ошибка, сами посты я мапил .map в компоненте, которая вызывала эту компоненту

let postsElements =
    props.posts.map(post =>
        <Post message={post.message}
            likesCount={post.likesCount}
            postAuthor={props.postAuthor}
            isYouLike={post.isYouLike}
            date={post.date}
            id={post.id}
            key={post.id}
            likeIt={props.likeIt}
            dontLikeIt={props.dontLikeIt} />)