From 2611c88cee89d54a567248a8da1a3831cc6433d6 Mon Sep 17 00:00:00 2001
From: Aman Harwara <amanharwara@protonmail.com>
Date: Wed, 5 Jul 2023 20:43:55 +0530
Subject: [PATCH] chore: fix modal positioning when using themed desktop
 titlebar

---
 packages/desktop/app/javascripts/Renderer/Renderer.ts           | 2 +-
 .../Components/Popover/Utils/usePopoverCloseOnClickOutside.ts   | 2 ++
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/desktop/app/javascripts/Renderer/Renderer.ts b/packages/desktop/app/javascripts/Renderer/Renderer.ts
index a0b37f6bd..f3f1a2614 100644
--- a/packages/desktop/app/javascripts/Renderer/Renderer.ts
+++ b/packages/desktop/app/javascripts/Renderer/Renderer.ts
@@ -128,7 +128,7 @@ async function configureWindow(remoteBridge: CrossProcessBridge) {
     /* Use custom title bar. Take the sn-titlebar-height off of
     the app content height so its not overflowing */
     sheet.insertRule(
-      '[role="dialog"] { position: relative; height: calc(100vh - var(--sn-desktop-titlebar-height)) !important; margin-top: var(--sn-desktop-titlebar-height) !important; }',
+      '[role="dialog"] { height: calc(100vh - var(--sn-desktop-titlebar-height)) !important; top: var(--sn-desktop-titlebar-height); }',
       sheet.cssRules.length,
     )
     sheet.insertRule(
diff --git a/packages/web/src/javascripts/Components/Popover/Utils/usePopoverCloseOnClickOutside.ts b/packages/web/src/javascripts/Components/Popover/Utils/usePopoverCloseOnClickOutside.ts
index 5010f101a..efed1f2e8 100644
--- a/packages/web/src/javascripts/Components/Popover/Utils/usePopoverCloseOnClickOutside.ts
+++ b/packages/web/src/javascripts/Components/Popover/Utils/usePopoverCloseOnClickOutside.ts
@@ -27,11 +27,13 @@ export const usePopoverCloseOnClickOutside = ({
       const isDescendantOfChildPopover = closestPopoverId && childPopovers.has(closestPopoverId)
       const isPopoverInModal = popoverElement?.closest('[data-dialog], .sk-modal')
       const isDescendantOfModal = isPopoverInModal ? false : !!target.closest('[data-dialog], .sk-modal')
+      const isDescendantOfDesktopTitlebar = !!target.closest('#desktop-title-bar')
 
       if (
         !isDescendantOfMenu &&
         !isAnchorElement &&
         !isDescendantOfChildPopover &&
+        !isDescendantOfDesktopTitlebar &&
         (!isDescendantOfModal || (isDescendantOfModal && hideOnClickInModal))
       ) {
         if (!disabled) {