Struggling to determine the appropriate return type for an AsyncThunkAction in order to utilize it with the unwrapResult method from Redux Toolkit (refer to: Redux Tookit: Unwrapping Result Actions):
Here is how the Async thunk is declared in the Slice:
export
const createChannel = createAsyncThunk<
{ id: string },
ChannelReqDto,
InjectedAxiosClientType
>("channel/createChannel", async (req, thunkApi) => {
const result = await thunkApi.extra.client.post(
`/store/${req.storeId}/channels`,
{
category: req.category,
group: req.group,
name: req.name,
rules: [],
}
);
return result.data;
});
Usage within a React Component:
const newChannel = await dispatch(
createChannel({
name: name,
group: group,
category: category,
storeId: storeIdParam,
rules: [],
})
);
const result = unwrapResult(newChannel);
Error encountered in TypeScript:
TS2345: Argument of type 'AsyncThunkAction<{ id: string; }, ChannelReqDto, InjectedAxiosClientType>' is not assignable to parameter of type 'UnwrappableAction'. Property 'payload' is missing in type 'AsyncThunkAction<{ id: string; }, ChannelReqDto, InjectedAxiosClientType>' but required in type 'UnwrappableAction'.
The expected result type must extend the interface UnwrappableAction, but I'm having trouble resolving this without using ts-ignore:
export declare function unwrapResult<R extends UnwrappableAction>(action: R): UnwrappedActionPayload<R>;