Encountering an error in my Redux Saga file, specifically when using the takeLatest()
Saga effect. TypeScript is throwing the following error:
(alias) const getMovies: ActionCreatorWithoutPayload<string>
import getMovies
No overload matches this call.
The last overload gave the following error.
Argument of type 'string' is not assignable to parameter of type 'TakeableChannel<unknown>'.ts(2769)
effects.d.ts(291, 17): The last overload is declared here.
Can anyone help me pinpoint the issue? I've tried searching for solutions online but haven't had any luck.
TYPES
export type Movie = { title: string; year: number };
export type MovieState = {
moviesList: Movie[];
totalResults: number;
};
export type MoviesFetchType = {
payload: { query: string; page: number };
};
export type MoviesType = {
status: number;
json: () => number;
};
export type FormatedMoviesType = {
Search: Movie[];
totalResults: number;
};
SAGA + SLICE
import { call, put, fork, takeLatest } from "redux-saga/effects";
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
import {Movie, MovieState, MoviesFetchType, MoviesType, FormatedMoviesType} from "./types";
// SLICE
const initialState = {
moviesList: [{}],
totalResults: 0
} as MovieState;
const movieSlice = createSlice({
name: "movie",
initialState,
reducers: {
getMovies(name) {
return name;
},
setMovies: (state, action: PayloadAction<Movie[]>) => {
state.moviesList = action.payload;
}
}
});
const { getMovies, setMovies } = movieSlice.actions;
// SAGA
function* moviesFetch({ payload }: MoviesFetchType) {
const { query, page } = payload;
const movies: MoviesType = yield call(() =>
fetch(`https://example.com/&s=${query}&page=${page}`)
);
const formatedMovies: FormatedMoviesType = yield movies.json();
yield put(setMovies(formatedMovies["Search"]));
}
function* moviesSaga() {
// HERE IS PROBLEM
yield takeLatest(getMovies.type, moviesFetch);
}
export const moviesSagas = fork(moviesSaga);
getMovies.type
give me an error: No overload matches this call. What is it and How to solve it?
Thank you!
// EDIT - add Slice // EDIT 2 - merge into one file