So I want to iterate results and also iterate movies at the same time not like I'm doing, and pass the movie object only if it matches, because sometimes I get undefined.
code:
{results.map((result) => (
<Thumbnail
key={result.id}
result={result}
movie={movies.find((movie) => movie.tmdb_id === result.id)}
/>
))}
You can create another component to filter the data first then pass it down to your thumbnail component like this:
function YourFunction(props){
return(
<ul>
{
results
.filter(result => result.id = {props.id})
.map(movie => <Thumbnail key={movie.id} result={movie} />
}
</ul>
)
}