From fb5c4b1f414301b756ccff9d8d04c3ff4dc06c05 Mon Sep 17 00:00:00 2001
From: Denis Bykhov <bykhov.denis@gmail.com>
Date: Mon, 22 May 2023 15:25:45 +0600
Subject: [PATCH] TSK-1524/UBER-195 (#3230)

Signed-off-by: Denis Bykhov <bykhov.denis@gmail.com>
---
 packages/panel/src/components/Panel.svelte      |  8 +++++++-
 packages/ui/src/components/PanelInstance.svelte | 17 +++++++++++++++--
 .../src/components/EditDoc.svelte               |  1 +
 .../src/components/issues/edit/EditIssue.svelte |  7 ++-----
 .../src/components/EditDoc.svelte               |  1 +
 5 files changed, 26 insertions(+), 8 deletions(-)

diff --git a/packages/panel/src/components/Panel.svelte b/packages/panel/src/components/Panel.svelte
index 2c2ed5369d..6f247663bc 100644
--- a/packages/panel/src/components/Panel.svelte
+++ b/packages/panel/src/components/Panel.svelte
@@ -14,7 +14,7 @@
     // limitations under the License.
     -->
 <script lang="ts">
-  import { afterUpdate } from 'svelte'
+  import { afterUpdate, createEventDispatcher, onMount } from 'svelte'
   import { Writable, writable } from 'svelte/store'
 
   import activity from '@hcengineering/activity'
@@ -56,6 +56,8 @@
   let lastScrollHeight: number = -1
   let count: number = 0
 
+  const dispatch = createEventDispatcher()
+
   const waitCount = 10
   const PanelScrollTop: Writable<Record<string, number>> = writable<Record<string, number>>({})
 
@@ -86,6 +88,10 @@
       startScrollHeightCheck()
     }
   })
+
+  onMount(() => {
+    dispatch('open')
+  })
 </script>
 
 <Panel
diff --git a/packages/ui/src/components/PanelInstance.svelte b/packages/ui/src/components/PanelInstance.svelte
index e0ceefe2cc..bd0f9ab351 100644
--- a/packages/ui/src/components/PanelInstance.svelte
+++ b/packages/ui/src/components/PanelInstance.svelte
@@ -89,8 +89,20 @@
     }
   }
 
+  function _open (): void {
+    if (modalHTML && props) {
+      if (props.element === 'content') {
+        modalHTML.classList.add('bg')
+      } else {
+        modalHTML.classList.remove('bg')
+      }
+    }
+  }
+
   const _update = (): void => {
-    if (props) fitPopup(props, contentPanel)
+    if (props) {
+      fitPopup(props, contentPanel)
+    }
   }
 
   afterUpdate(() => {
@@ -120,7 +132,7 @@
     <slot name="panel-header" />
     <div
       class="panel-instance"
-      class:bg={props.element === 'content'}
+      class:bg={false}
       bind:this={modalHTML}
       style:top={options?.props?.top}
       style:bottom={options?.props?.bottom}
@@ -142,6 +154,7 @@
           rightSection={props.rightSection}
           position={props.element}
           bind:popupOptions={options}
+          on:open={_open}
           on:close={_close}
           on:update={_update}
         />
diff --git a/plugins/document-resources/src/components/EditDoc.svelte b/plugins/document-resources/src/components/EditDoc.svelte
index 13293386d3..f4ae649685 100644
--- a/plugins/document-resources/src/components/EditDoc.svelte
+++ b/plugins/document-resources/src/components/EditDoc.svelte
@@ -380,6 +380,7 @@
     bind:innerWidth
     floatAside={false}
     useMaxWidth={true}
+    on:open
     on:close={() => dispatch('close')}
   >
     <svelte:fragment slot="navigator">
diff --git a/plugins/tracker-resources/src/components/issues/edit/EditIssue.svelte b/plugins/tracker-resources/src/components/issues/edit/EditIssue.svelte
index 61846bd39e..f9748611ac 100644
--- a/plugins/tracker-resources/src/components/issues/edit/EditIssue.svelte
+++ b/plugins/tracker-resources/src/components/issues/edit/EditIssue.svelte
@@ -35,7 +35,7 @@
     showPopup
   } from '@hcengineering/ui'
   import { ActionContext, ContextMenu, DocNavLink, UpDownNavigator, contextStore } from '@hcengineering/view-resources'
-  import { createEventDispatcher, onDestroy, onMount } from 'svelte'
+  import { createEventDispatcher, onDestroy } from 'svelte'
   import { generateIssueShortLink, getIssueId } from '../../../issues'
   import tracker from '../../../plugin'
   import IssueStatusActivity from '../IssueStatusActivity.svelte'
@@ -140,10 +140,6 @@
     }
   }
 
-  onMount(() => {
-    dispatch('open', { ignoreKeys: ['comments', 'name', 'description', 'number'] })
-  })
-
   const manager = createFocusManager()
   export function canClose (): boolean {
     if (descriptionBox.isFocused()) {
@@ -176,6 +172,7 @@
     {embedded}
     withoutTitle
     bind:innerWidth
+    on:open
     on:close={() => dispatch('close')}
   >
     <svelte:fragment slot="navigator">
diff --git a/plugins/view-resources/src/components/EditDoc.svelte b/plugins/view-resources/src/components/EditDoc.svelte
index 0eb175ecf9..b3d08cfeaa 100644
--- a/plugins/view-resources/src/components/EditDoc.svelte
+++ b/plugins/view-resources/src/components/EditDoc.svelte
@@ -283,6 +283,7 @@
     isAside={true}
     bind:panelWidth
     bind:innerWidth
+    on:open
     on:update={(ev) => _update(ev.detail)}
     on:close={() => {
       dispatch('close')