fix(core): handle modal overlay click event correctly (#8063)

1. overlay click + hide is brought back. this is because modal (ormobile menu)'s `onPointerDownOutside` is bound to document.body. Code in e58af08f63/packages/frontend/core/src/modules/explorer/views/tree/node.tsx (L353-L356) will stop the event from bubbling to the document element.
2. when Menu's set to modal=true, the parent is set to pointer-events: none as well. changed menu to modal false instead.

![image.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/T2klNLEk0wxLh4NRDzhk/3e50281f-839d-4463-af00-dff2fce8202b.png)

packages/frontend/component/src/ui/menu/desktop/root.tsx

@@ -10,7 +10,7 @@ export const DesktopMenu = ({
   children,
   items,
   portalOptions,
-  rootOptions: { onOpenChange, defaultOpen, ...rootOptions } = {},
+  rootOptions: { onOpenChange, defaultOpen, modal, ...rootOptions } = {},
   contentOptions: {
     className = '',
     style: contentStyle = {},
@@ -30,9 +30,18 @@ export const DesktopMenu = ({
     <DropdownMenu.Root
       onOpenChange={handleOpenChange}
       defaultOpen={defaultOpen}
+      modal={modal ?? false}
       {...rootOptions}
     >
-      <DropdownMenu.Trigger asChild>{children}</DropdownMenu.Trigger>
+      <DropdownMenu.Trigger
+        asChild
+        onClick={e => {
+          e.stopPropagation();
+          e.preventDefault();
+        }}
+      >
+        {children}
+      </DropdownMenu.Trigger>
 
       <DropdownMenu.Portal {...portalOptions}>
         <DropdownMenu.Content