fix: prevent Radix Dialog and Vaul Drawer dismissal when closing a toast

[unrenamed]

What does this PR do?

Fixes #1654 by ensuring that clicking inside a Sonner Toast does not trigger the closure of Radix Dialog and Vaul Drawer components.

Root Cause

When using the Dub app, clicking within a toast notification was being interpreted as an "outside click" for Radix Dialog and Vaul Drawer components. Since all of these elements are rendered in the same HTML portal layer, the default behavior is to close dialogs and drawers on outside clicks.

Fix

To prevent dialogs and drawers from closing due to clicks inside a toast notification, this update adds a check to detect clicks within elements marked with data-sonner-toast. When a click is detected in such an element, the default dismiss action is prevented, allowing dialogs and drawers to remain open.

How to test?

1. Log in to the application.
2. Go to the links list and select a link to edit.
3. In the "Edit" modal, click on the "Tag" input field.
4. Enter a new tag name and click "Create"
5. When the toast notification appears in the bottom-right corner, close it.
6. Confirm that the "Edit" modal remains open.
7. Repeat on mobile and confirm the same behavior.
8. Test this behavior with other modals and popovers to ensure they also remain open when closing toasts.

[vercel]

@unrenamed is attempting to deploy a commit to the Dub Team on Vercel.

A member of the Team first needs to authorize it.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
dub	✅ Ready (Inspect)	Visit Preview	Dec 19, 2024 5:09pm