The state is actually updating, you can see the updated state in the dev tool.
However...
There is no data property in the state until this fetchUser action is fulfilled, in which case the reducer case sets a state.data property equal to action.payload. I suspect you want to be setting the state.user property to the user property of the response JSON in the action payload, e.g. state.user = action.payload.user;.
const initialState = {
user: {
_id: "",
fname: "",
lname: "",
email: "",
streetAddress: "",
postalCode: "",
city: "",
county: "",
country: "",
},
loading: false,
error: null,
};
const userSlice = createSliceWithThunks({
name: "user",
initialState,
reducers: (create) => ({
fetchUser: create.asyncThunk(
async (_, thunkApi) => {
try {
const response = await fetch("/api/user");
const userData = await response.json();
return userData;
} catch(error) {
return thunkApi.rejectWithValue(error);
}
},
{
pending: (state) => {
state.loading = true;
state.error = null;
},
fulfilled: (state, action) => {
state.loading = false;
state.user = action.payload.user; // <-- update user property
},
rejected: (state, action) => {
state.loading = false;
state.error = action.errorpayload.message;
},
}
),
}),
});