проблемы с Redux

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

INDEX PAGE

import { createStore } from 'redux';
import { Provider } from 'react-redux';



const root = ReactDOM.createRoot(document.getElementById('root'));


const initialState = [
    {name: "text", completed: false},
    {name: "text", completed: false},
    {name: "text", completed: false},
]

const reducer = (state = initialState , action) => {
    console.log(action.payload)
    switch (action.type) {
    
        default:
             return state
    }
}
const store = createStore(reducer)


root.render(

    <Provider store={store}>
    <App />
    </Provider>
);

COMPONENT PAGE

import { useDispatch, useSelector } from "react-redux";

function Todo() {
  const dispatch = useDispatch();
  const poop = useSelector((state) => state);

  const del = (id) => {
    dispatch({
      type: "DEL",
      payload: id,
    });
  };

  return (
    <div>
      {poop.map((item, id) => {
        return (
          <div className="todo">
            <p>{item.name}</p>
            <button className="btn" onClick={() => del(id)}></button>
          </div>
        );
      })}
    </div>
  );
}
export default Todo;