From 6256f8b02d74da94da948161621d1949eae70cca Mon Sep 17 00:00:00 2001
From: Alexander Platov <alexander.platov@hardcoreeng.com>
Date: Fri, 6 Dec 2024 04:15:27 +0300
Subject: [PATCH] Fixed Navigator (#7268)

---
 .../src/components/Workbench.svelte           | 38 +++++++++++--------
 1 file changed, 23 insertions(+), 15 deletions(-)

diff --git a/plugins/workbench-resources/src/components/Workbench.svelte b/plugins/workbench-resources/src/components/Workbench.svelte
index ab051c2d8d..484f1f91b7 100644
--- a/plugins/workbench-resources/src/components/Workbench.svelte
+++ b/plugins/workbench-resources/src/components/Workbench.svelte
@@ -125,6 +125,8 @@
   } from '../workbench'
   import { get } from 'svelte/store'
 
+  const HIDE_NAVIGATOR = 720
+  const HIDE_ASIDE = 1024
   let contentPanel: HTMLElement
 
   const { setTheme } = getContext<{ setTheme: (theme: string) => void }>('theme')
@@ -164,7 +166,7 @@
   async function toggleNav (): Promise<void> {
     $deviceInfo.navigator.visible = !$deviceInfo.navigator.visible
     closeTooltip()
-    if (currentApplication && navigatorModel && navigator) {
+    if (currentApplication && navigatorModel) {
       await tick()
       panelInstance.fitPopupInstance()
       popupInstance.fitPopupInstance()
@@ -634,12 +636,12 @@
   let cover: HTMLElement
   let workbenchWidth: number = $deviceInfo.docWidth
 
-  $deviceInfo.navigator.float = !(workbenchWidth < 1024)
+  $deviceInfo.navigator.float = workbenchWidth <= HIDE_NAVIGATOR
   const checkWorkbenchWidth = (): void => {
-    if (workbenchWidth <= 720 && !$deviceInfo.navigator.float && $deviceInfo.navigator.visible) {
+    if (workbenchWidth <= HIDE_NAVIGATOR && !$deviceInfo.navigator.float && $deviceInfo.navigator.visible) {
       $deviceInfo.navigator.visible = false
       $deviceInfo.navigator.float = true
-    } else if (workbenchWidth > 720 && $deviceInfo.navigator.float) {
+    } else if (workbenchWidth > HIDE_NAVIGATOR && $deviceInfo.navigator.float) {
       if (getMetadata(workbench.metadata.NavigationExpandedDefault) === undefined) {
         $deviceInfo.navigator.float = false
         $deviceInfo.navigator.visible = true
@@ -647,17 +649,17 @@
     }
   }
   checkWorkbenchWidth()
-  $: if ($deviceInfo.docWidth <= 1024 && !$deviceInfo.aside.float) {
+  $: if ($deviceInfo.docWidth <= HIDE_ASIDE && !$deviceInfo.aside.float) {
     $deviceInfo.aside.visible = false
     $deviceInfo.aside.float = true
-  } else if ($deviceInfo.docWidth > 1024 && $deviceInfo.aside.float) {
+  } else if ($deviceInfo.docWidth > HIDE_ASIDE && $deviceInfo.aside.float) {
     if (getMetadata(workbench.metadata.NavigationExpandedDefault) === undefined) {
       $deviceInfo.aside.float = false
       $deviceInfo.aside.visible = true
     }
   }
   const checkOnHide = (): void => {
-    if ($deviceInfo.navigator.visible && workbenchWidth <= 1024) $deviceInfo.navigator.visible = false
+    if ($deviceInfo.navigator.visible && $deviceInfo.navigator.float) $deviceInfo.navigator.visible = false
   }
   let oldNavVisible: boolean = $deviceInfo.navigator.visible
   let oldASideVisible: boolean = $deviceInfo.aside.visible
@@ -742,7 +744,7 @@
   defineSeparators('workbench', workbenchSeparators)
   defineSeparators('main', mainSeparators)
 
-  $: mainNavigator = currentApplication && navigatorModel && navigator && $deviceInfo.navigator.visible
+  $: mainNavigator = currentApplication && navigatorModel && $deviceInfo.navigator.visible
   $: elementPanel = $deviceInfo.replacedPanel ?? contentPanel
 
   $: deactivated =
@@ -818,7 +820,11 @@
           />
         </div>
         <!-- <ActivityStatus status="active" /> -->
-        <NavLink app={notificationId} shrink={0}>
+        <NavLink
+          app={notificationId}
+          shrink={0}
+          disabled={!$deviceInfo.navigator.visible && $deviceInfo.navigator.float && currentAppAlias === notificationId}
+        >
           <AppItem
             icon={notification.icon.Notifications}
             label={notification.string.Inbox}
@@ -827,7 +833,9 @@
               $deviceInfo.navigator.visible}
             on:click={(e) => {
               if (e.metaKey || e.ctrlKey) return
-              if (currentAppAlias === notificationId && lastLoc !== undefined) {
+              if (!$deviceInfo.navigator.visible && $deviceInfo.navigator.float && currentAppAlias === notificationId) {
+                toggleNav()
+              } else if (currentAppAlias === notificationId && lastLoc !== undefined) {
                 e.preventDefault()
                 e.stopPropagation()
                 navigate(lastLoc)
@@ -911,12 +919,12 @@
         checkWorkbenchWidth()
       }}
     >
+      <!-- svelte-ignore a11y-click-events-have-key-events -->
+      <!-- svelte-ignore a11y-no-static-element-interactions -->
+      {#if $deviceInfo.navigator.float && $deviceInfo.navigator.visible}
+        <div class="cover shown" on:click={() => ($deviceInfo.navigator.visible = false)} />
+      {/if}
       {#if mainNavigator}
-        <!-- svelte-ignore a11y-click-events-have-key-events -->
-        <!-- svelte-ignore a11y-no-static-element-interactions -->
-        {#if $deviceInfo.navigator.float}
-          <div class="cover shown" on:click={() => ($deviceInfo.navigator.visible = false)} />
-        {/if}
         <div
           class="antiPanel-navigator no-print {$deviceInfo.navigator.direction === 'horizontal'
             ? 'portrait'