React.js 에러 Warning: Failed prop type

노마드 코더의 토이 프로젝트를 만들던 중 알 수 없는 에러가 떴다..
구글링 결과 id라는 prop가 없거나, prop 모두를 받아오지 않을 때 생긴다고 한다.
눈 빠지게 오타를 찾은 결과.. 찾을 수 없었다ㅜㅜ 결국 니꼴라스 쌤의 깃헙에서 복붙했더니 id 말고도 다른 prop도 에러가 났다.

✔Home.js

import { useEffect, useState } from "react";
import Movie from "../components/Movie";
function Home() {
  const [loading, setLoading] = useState(true);
  const [movies, setMovies] = useState([]);
  const getMovies = async () => {
    const json = await (
      await fetch(
        `https://yts.mx/api/v2/list_movies.json?minimum_rating=8.8&sort_by=year`
      )
    ).json();
    setMovies(json.data.movies);
    setLoading(false);
  };
  useEffect(() => {
    getMovies();
  }, []);
  return (
    <div>
      {loading ? (
        <h1>Loading...</h1>
      ) : (
        <div>
          {movies.map((movie) => (
            <Movie
              key={movie.id}
              id={movie.id}
              coverImg={movie.medium_cover_image}
              title={movie.title}
              summary={movie.summary}
              genres={movie.genres}
            />
          ))}
        </div>
      )}
    </div>
  );
}
export default Home;

✔Movie.js

import PropTypes from "prop-types";
import { Link } from "react-router-dom";

function Movie({ id, coverImg, title, summary, genres }) {
  return (
    <div>
      <img src={coverImg} alt={title} />
      <h2>
        <Link to={`/movie/${id}`}>{title}</Link>
      </h2>
      <p>{summary}</p>
      <ul>{genres && genres.map((g) => <li key={g}>{g}</li>)}</ul>
    </div>
  );
}

Movie.propTypes = {
  id: PropTypes.number.isRequired,
  coverImg: PropTypes.string.isRequired,
  title: PropTypes.string.isRequired,
  summary: PropTypes.string.isRequired,
  genres: PropTypes.arrayOf(PropTypes.string).isRequired,
};
export default Movie;

Movie.js의 propTypes를 주석 처리하면 에러가 안뜨는 것을 확인하였다.
api의 json중 빠진 부분이 있어서인지, 자료형이 달라서 인지 알 수 없기 때문에 그냥 코드를 빼는게 최선이라 생각하고 에러를 만드는 상황을 그냥 없앴다ㅜㅜ