redux - Need advice with typescript and createAsyncThunk

Question

I am learning to create slices to handle all of my state and async actions. I am copying the docs in trying to do this but I am getting an error with typescript.

My Code:

export const fetchTrackData = createAsyncThunk(
  "posts/fetchAllTracksData",
  async (user: any, data: any, spotifyToken: any, thunkApi: any) => {
    try {
      if (!spotifyToken)
        return thunkApi.rejectWithValue({
          type: CustomError.NO_SPOTIFY_TOKEN,
        });
      const response = await fetchSpotifyData(user, data, spotifyToken);
      return response;
    } catch (err) {
      thunkApi.rejectWithValue({
        type: CustomError.ERROR_FETCHING_SPOTIFY_DATA,
        reason: err.response,
      });
    }
  }
);

The Error:

Argument of type '(user: any, data: any, spotifyToken: any, thunkApi: any) => Promise<any>' is not assignable to parameter of type 'AsyncThunkPayloadCreator<any, void, {}>'.ts(2345)

question from:https://stackoverflow.com/questions/65907698/need-advice-with-typescript-and-createasyncthunk

Answer 1

I think the signature of your callback (payloadCreator) is not correct, In the documentation, it states two values are passed to the function.

'The payloadCreator function will be called with two arguments:'

https://redux-toolkit.js.org/api/createAsyncThunk