Por favor, ayúdenme con una situación relacionada con el kit de herramientas react-redux. Tengo problemas para actualizar el estado (que trato de hacer de manera inmutable), y el componente donde lo uso, nunca se vuelve a renderizar.

 export const updateUser = createAsyncThunk("users/updateUser", async ({ id, name, username }) => { const response = await axios.patch(`https://jsonplaceholder.typicode.com/users/${id}`,{ name, username }); return response.data; }); const userEntity = createEntityAdapter({ selectId: (user) => user.id }) const userSlice = createSlice({ name: "user", initialState: userEntity.getInitialState(), extraReducers: { [getUsers.fulfilled]: (state, action) => { userEntity.setAll(state, action.payload); }, [updateUser.fulfilled]: (state, action) => { userEntity.updateOne(state, { id: action.payload.id, update: action.payload}); } }, }); export const userSelectors = userEntity.getSelectors(state => state.user) export default userSlice.reducer;

 const EditUser = () => { const [name, setName] = useState(''); const [username, setUserName] = useState(''); const dispatch = useDispatch(); const navigate = useNavigate(); const { id } = useParams(); const user = useSelector((state) => userSelectors.selectById(state, id)); useEffect(() => { dispatch(getUsers()); },[dispatch]); useEffect(() => { if(user){ setName(user.name); setUserName(user.username); } },[user]); const handleUpdate = async (e) => { e.preventDefault(); await dispatch(updateUser({id, name, username})); navigate('/user'); }

cada vez que hago clic en el botón y actualizo el estado. se actualiza en redux. pero el estado no se actualiza. ¿Qué estoy haciendo mal?

Imagen Explicación 1

Imagen Explicación 2

Imagen Explicación 3