Expected 0 arguments, but got 1 while passing arguments to the async func in redux toolkit store

Question

I am creating a project using Redux Toolkit + Typescript + React. I have the function the fetches movies in my moviesSlice (as part of redux toolkit store) that has movieId as an argument. When I try to dispatch this function in my component and pass this id, TypeScript shows an error: Expected 0 arguments, but got 1. How can I fix it? Thank you

// moviesSlice.tsx

export const fetchMovie = createAsyncThunk(
  "people/fetchPerson",
  async (movieId) => {
    try {
      const response = await axios(`${BASE_URL}/films/${movieId}`);
      return response.data;
    } catch (error) {
      console.log(error);
    }
  }
);

// store.tsx
export const store = configureStore({
  reducer: {
    people: peopleReducer,
    movies: moviesReducer,
    planets: planetsReducer,
  },
});

// Movie.tsx
useEffect(() => {
    dispatch(fetchMovie(movieId));
  }, []);

Answer 1

This is TypeScript. Give your arguments a type - otherwise the created thunk action creator will not know what to do:

export const fetchMovie = createAsyncThunk(
  "people/fetchPerson",
  async (movieId: string) => {
    try {
      const response = await axios(`${BASE_URL}/films/${movieId}`);
      return response.data;
    } catch (error) {
      console.log(error);
    }
  }
);