Adding a working checkbox to a todo list using redux

Question

I have made this to-do list App using redux with the help of a tutorial for the sake of learning Redux architecture. so the check box should work for every individual task added, but onChange I get all of the boxes' values turning to true when I figured I wasn't mapping throw the state. but then if you look into the logger on the console you see that I have got it working, only failing to display the check properly. you can find the full code here

this is the Task component

const Todo = ({ todo , idx , deleteTodo , editTodo,selected,text,check,checkTodo }) => { 
    return (
        
        <div style={{ display: 'flex', flexDirection: 'flex-start', justifyContent: 'space-evenly', border: '1px solid white', padding: '5px', width: '200px', cursor: 'pointer' }} >
            <input style={{ width: '1rem', height: '0.8rem', margin: '0', padding: '0' }} type="checkbox" checked={check} onChange={() => checkTodo(idx)} />
            <div onClick={() => editTodo(idx)} >
            {
                selected === idx ? text : todo
            } </div>
            <div style={{ cursor: 'pointer' }} onClick={() => deleteTodo(idx)}>x</div>
        </div>
            
            
    )
}

Here is the action.reducer

export const checkTodo = key => ({
    type: "CHECK_TODO",
    payload: key
})

and this is the reducer switch case (the check box part )

case 'CHECK_TODO':
    const todos5 = state.todos.map((todo, i) => { 
        if (i == action.payload) {
            return { ...state, check: !todo.check ,text: todo}
        }
        return todo
    })
    setPersist(todos5)
    return {
        ...state,todos5
    }

https://github.com/Faycal88/Todo-App