In my React project, I am utilizing redux-starter-kit. I am currently working on specifying the type of action payload in the reducer using the createSlice method.
I have implemented two reducers:
setFetchingMenuItems: (
state: IPagesState,
{ payload }: PayloadAction<boolean>
) => {
state.isFetchingMenuItems = payload;
},
setMenuItems: (
state: IPagesState,
{ payload }: PayloadAction<IMenuItemViewModel[]>
) => {
state.menuItems = payload;
},
The second reducer functions as intended. When I dispatch the setMenuItems action, it only accepts an array of IMenuItemViewModel.
However, when I attempt to dispatch the setFetchingMenuItems action with a payload of true or false, TypeScript throws an error: "TS2345: Argument of type 'false' is not assignable to parameter of type 'false & true'."
What could I be overlooking?
UPDATE:
Below is my asynchronous method where I dispatch actions:
export const fetchMenuItems = () => async (
dispatch: Dispatch
): Promise<void> => {
dispatch(setFetchingMenuItems(true));
try {
const { value } = await PageService.getMenuItems();
dispatch(setMenuItems(value));
} catch (e) {
console.log(e);
}
dispatch(setFetchingMenuItems(false));
};
The TypeScript version being used is 3.5.1.