Design comparison
Solution retrospective
I achieved the render of DropDownMenu
and Dialog
using React Portal
and referenced states with useContext
hook.
I could not implement full interaction of dialog and dropdown I think in future projects I will consider using 3rd-party to assist in creating a proper dialog with correct accessibility.
useContext
was really useful for minimizing prop pass drilling but depending on a bigger project scope I could use 3rd-party plugin to store and manage states.
The biggest challenge I kept facing was to properly pass the correct array value of cards and when to and not to recreate a new .map
copy of it.
I learned how to work with map in states and compare the original cards object with a copy and check for the intended conditionals.
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord