Error : reviews not iterable

[chandravaibhav98]

I observed Error: reviews not iterable on trying to create a Review, being traced to the addReview on Reviews Component.
I've tested the same on your project and the issue is observed there as well.

const addReview = async (e) => {
		e.preventDefault();
		const rev = revText.current;
		try {
			const response = await api.post("/api/v1/reviews", { reviewBody: rev.value, imdbId: movieId });
			const updatedReviews = [...reviews, { body: rev.value }];
			rev.value = "";
			setReviews(updatedReviews);
		} catch (err) {
			console.error(err);
		}
	};

The fix being on App : getMovieData()

// Changing
setReviews(singleMovie.reviews);
// To this
setReviews(singleMovie.reviewIds);

The 'singleMovie' response has a property of 'reviewIds' and not 'reviews'.

const getMovieData = async (movieId) => {
try {
	const response = await api.get(`/api/v1/movies/${movieId}`);
	const singleMovie = response.data;

	setMovie(singleMovie);
	setReviews(singleMovie.reviewIds);
} catch (err) {
	console.error(err);
}
};