Not able to delete an object from immer,redux toolkit

Question

I am using Redux Toolkit, having a slice where i am doing crud operations in a slice.list

but I am not able to filter slice.list

here is my code...

    showsRemoved: (shows, action) => {
      shows.list.filter((show) => show.id !== action.payload.deletedShowId);
    },

the show is succesfully deleted from the server, but I also want to do update my redux store, so I am filtering the shows with an id which is coming from the server. but code flow is not working. I have added these console.logs to check the data i am manipulating. here's the code

    showsRemoved: (shows, action) => {
      shows.list.filter((show) => {
        console.log(show.id, action.payload.deletedShowId);
        console.log(show.id !== action.payload.deletedShowId);
        return show.id !== action.payload.deletedShowId;
      });
    },

and its output in console looks fine, here the ss

what am i doing wrong? explain, solution, best practice?

thanks in advance.

Answer 1

You need to return the new state from your reducer after filtering out the deleted show.

showsRemoved: (shows, action) => {
  shows.list = shows.list.filter((show) => show.id !== action.payload.deletedShowId);
  return shows;
},