Web application users are accustomed to canceling a popup (aka dialog or modal) by pressing the escape key, and many modals can even cancel if the user clicks outside it. How does a React developer code that without a plumbing mess between the modal and every visible component beneath it? How do you cancel a React modal with an escape key or external click?
I’m glad you asked because I have an answer. In this blog, I’ll show a pair of easy-to-use custom React hooks that simplify the task.