This app should be able to do the following:
-
Render all character cards to the list. Each card should have a toggle and an edit button and the following information:
- Student Name
- BONUS: Student Role
- BONUS: Student Patronus
-
The toggle button should toggle between adding and removing the card from your team
-
The edit button should populate an edit form inside the card
-
The edit form should allow your changes to show on the page upon form submission (your changes will not persist - that's ok)
- HOWEVER the new info should still appear when you toggle between adding and removing the card from your team
-
Create a text filter that filters students by name; this filter should apply to student inside and outside of your team
- What is the component hierarchy?
- What data are we fetching? Which components should this data be displayed on?
- What data/components are changing due to user interaction?
- On which component is the user interaction taking place?
- Which component(s) are re-rendered due to this user interaction?
- Based on all of the above, where should state be placed?