You are given a semi-working implementation of a login component, pair-programming with your interviewer you will need to complete some of the following tasks:
-
Make sure clicking the "Login" button will show the modal.
-
Make sure clicking the "Close" button will hide the modal.
-
Clicking anywhere outside the modal should close it.
-
Make click-outside logic into a reuseable hook
useClickOutsidethat can be used in other components.
Bonus Tasks:
-
When modal is open, focus should be on the first input field. When modal is closed, focus should return to the "Login" button.
-
Move the modal control logic into a Context and add another button that will open the modal.
Note: not all tasks need to be completed, the goal is to see how you approach the problem and how you work with the interviewer.