Trying to Implement MUI like drawer

When the show button is clicked, the drawer opens, and when the hide button is clicked, it closes. So far, everything seems to be working perfectly.

However, I also want to close the drawer when the user clicks outside of it. Here’s the issue:

When show button is clicked for the first time, the drawer unexpectedly remains closed due to a conflict with the functionality of the click outside,

This is the example link.
https://codesandbox.io/p/sandbox/relaxed-turing-2vdwjy

This topic has been created from a Discord post (1234597537940373666) to give it more visibility.
It will be on Read-Only mode here.
Join the conversation on Discord