I am working on a React app where I have separated the actions into a different file from the service methods
hoplite.actions.ts
export const fetchBattleResult = createAsyncThunk<Result>(
'battle/fetchBattleResult',
HopliteService.battleResult,
);
hoplite.service.ts
In my service file, I have an async method called battleResult that takes in a parameter of type Battle and returns a Promise of type Result:
const battleResult = async (item: Battle): Promise<Result> =>
await fetch(`${API_URL}/battle`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(item),
}).then((response) => response.json());
When trying to send the signature of battleResult, VSCode is showing me an error regarding incompatible types for the parameters. It seems like it's not recognizing the param being passed.
The error message states: 'Argument of type '(item: Battle) => Promise<Result>' is not assignable to parameter of type 'AsyncThunkPayloadCreator<Result, void, {}>'.
Types of parameters 'item' and 'arg' are incompatible.
Type 'void' is not assignable to type 'Battle'.ts(2345)
I would greatly appreciate any suggestions on how to correctly specify or include the parameters in the signature when sending it. Thank you!