Jammming project problem

Web Development Full-Stack
1

Hey there, I’m currently working on the Jammming portfolio project and got into a bit of a porblem.
I finished building all of the static components that are hard-coded for now and started the task to “Implement Track Listing in The Component Tree”. I started with creating a state for the searchResults array and then carried on to passing it down to the children components in this order: App->SearchResults->TrackList->array.map on the prop returning Track components with a key and the track itself as a “track” prop.
I didn’t even got to the last part of dividing the track to name, artist and album inside the Track component as I encountered an error saying I cannot map over undefined. When I got to debugging I was surprised to know that my state passes okay but the component re-renders itself a few times when the last one just set the state to undefined…
Has anyone encountered such behavior/can tell me what is wrong with my code?
Thank you in advance

project’s GitHub:

2

Hello. I was reviewing your code and the error is in the Playlist component. Within the Playlist component you are using Tracklist, but you are not passing any props to Tracklist yet and this component expects a prop. While you define what the Playlist component will do, remove it from App.js and the error will go away. When you determine what Playlist will do and what data it will receive, you can add it to App.js and through props pass the information to Tracklist (when you use it within Playlist).