score:2

Accepted answer

you're using typescript without defining types and using any everywhere.

if you know the shape of the data that you expect to receive from the api, it's not too difficult to create some types to begin using in your component.

this would solve the other ts errors in your question.

interface movie {
  title: string;
  year: string;
  rated: string;
  released: string;
  runtime: string;
  genre: string;
  director: string;
  writer: string;
  actors: string;
  plot: string;
  language: string;
  country: string;
  awards: string;
  poster: string;
  ratings?: ratingsentity[] | null;
  metascore: string;
  imdbrating: string;
  imdbvotes: string;
  imdbid: string;
  type: string;
  dvd: string;
  boxoffice: string;
  production: string;
  website: string;
  response: string;
}
interface ratingsentity {
  source: string;
  value: string;
}

interface favorite extends movie {
  isfavorite?: boolean;
}

then you can specify what the type will be within your state.

  const [favorites, setfavorites] = usestate<favorite[]>([]);
  const [movies, setmovies] = usestate<movie[]>([]);
  const [selectedmovie, setselectedmovie] = usestate<movie | null>(null);
  const [search, setsearch] = usestate<string>("");

score:1

react.createcontext needs to be passed a default value, that will be used by consumers not contained by a provider.

and as everyone else said, if you're not assigning any useful types, why use typescript in the first place?

type movie = {
  // ...
}
type moviecontexttype = {
  setsearch(value: string): void
  movies: movie[]
  // ...
}
const moviecontext = createcontext<moviecontexttype>({ /* ... */ })

const movieapp: react.fc = ({children}) => // ...

// etc.

score:1

you need to define what types of data your state should be, for example:

const [movies, setmovies] = usestate<thetypethatisreturn>()

// an example of using an array of objects:
const [movies, setmovies] = usestate<array<{id: string, name: string}>>([])

also you should set a default value for the movies state, as its currently set to nothing and thats why you're getting the 'any[] is not assignable to never[] error.

you'll find it way easier to debug these issues if you stop using 'any', as this will allow all types to pass through and then throw errors which is whole point of typescript. you can define this at the top of the file using an interface, or even in a seperate folder/file to store your interfaces and models:

interface imoviemodel {
  id: string;
  name: string;
}
const [movies, setmovies] = usestate<array<imoviemodel>>([])

if you follow these steps you will fix the errors, you will also need to model the api response or at least the parts of it you want to use to stop ts complaining about id not being found.


Related Query

More Query from same tag