Fixed toggle navigator and aside (#7289)

Signed-off-by: Alexander Platov <alexander.platov@hardcoreeng.com>

plugins/love-resources/src/components/Floor.svelte

@@ -42,7 +42,7 @@
 </script>
 
 <div class="hulyComponent">
-  <Header allowFullsize adaptive={'disabled'}>
+  <Header adaptive={'disabled'}>
     <Breadcrumb title={selectedFloor?.name ?? ''} size={'large'} isCurrent />
     <svelte:fragment slot="beforeTitle">
       <ViewletSelector bind:viewlet bind:preference bind:loading viewletQuery={{ attachTo: lovePlg.class.Floor }} />

plugins/workbench-resources/src/components/Applications.svelte

@@ -13,6 +13,7 @@
 // limitations under the License.
 -->
 <script lang="ts">
+  import { createEventDispatcher } from 'svelte'
   import core, { getCurrentAccount, type Ref } from '@hcengineering/core'
   import { createQuery } from '@hcengineering/presentation'
   import { Scroller, deviceOptionsStore as deviceInfo } from '@hcengineering/ui'
@@ -27,6 +28,8 @@
   export let apps: Application[] = []
   export let direction: 'vertical' | 'horizontal' = 'vertical'
 
+  const dispatch = createEventDispatcher()
+
   let loaded: boolean = false
   let hiddenAppsIds: Array<Ref<Application>> = []
   const hiddenAppsIdsQuery = createQuery()
@@ -66,9 +69,7 @@
             label={app.label}
             navigator={app._id === active && $deviceInfo.navigator.visible}
             on:click={() => {
-              if (app._id === active) {
+              if (app._id === active) dispatch('toggleNav')
-                $deviceInfo.navigator.visible = !$deviceInfo.navigator.visible
-              }
             }}
           />
         </NavLink>
@@ -82,9 +83,7 @@
             label={app.label}
             navigator={app._id === active && $deviceInfo.navigator.visible}
             on:click={() => {
-              if (app._id === active) {
+              if (app._id === active) dispatch('toggleNav')
-                $deviceInfo.navigator.visible = !$deviceInfo.navigator.visible
-              }
             }}
           />
         </NavLink>

plugins/workbench-resources/src/components/Workbench.svelte

@@ -160,11 +160,26 @@
 
   const linkProviders = client.getModel().findAllSync(view.mixin.LinkIdProvider, {})
 
-  $deviceInfo.navigator.visible = getMetadata(workbench.metadata.NavigationExpandedDefault) ?? true
+  const defaultNavigator = !(getMetadata(workbench.metadata.NavigationExpandedDefault) ?? true)
-  $deviceInfo.aside.visible = getMetadata(workbench.metadata.NavigationExpandedDefault) ?? true
+  const savedNavigator = localStorage.getItem('hiddenNavigator')
+  const savedAside = localStorage.getItem('hiddenAside')
+  let hiddenNavigator: boolean = savedNavigator !== null ? savedNavigator === 'true' : defaultNavigator
+  let hiddenAside: boolean = savedAside !== null ? savedAside === 'true' : defaultNavigator
+  $deviceInfo.navigator.visible = !hiddenNavigator
+  $deviceInfo.aside.visible = !hiddenAside
+  sidebarStore.subscribe((sidebar) => {
+    if (!$deviceInfo.aside.float) {
+      hiddenAside = sidebar.variant === SidebarVariant.MINI
+      localStorage.setItem('hiddenAside', `${hiddenAside}`)
+    }
+  })
 
   async function toggleNav (): Promise<void> {
     $deviceInfo.navigator.visible = !$deviceInfo.navigator.visible
+    if (!$deviceInfo.navigator.float) {
+      hiddenNavigator = !$deviceInfo.navigator.visible
+      localStorage.setItem('hiddenNavigator', `${hiddenNavigator}`)
+    }
     closeTooltip()
     if (currentApplication && navigatorModel) {
       await tick()
@@ -638,14 +653,12 @@
 
   $deviceInfo.navigator.float = workbenchWidth <= HIDE_NAVIGATOR
   const checkWorkbenchWidth = (): void => {
-    if (workbenchWidth <= HIDE_NAVIGATOR && !$deviceInfo.navigator.float && $deviceInfo.navigator.visible) {
+    if (workbenchWidth <= HIDE_NAVIGATOR && !$deviceInfo.navigator.float) {
       $deviceInfo.navigator.visible = false
       $deviceInfo.navigator.float = true
     } else if (workbenchWidth > HIDE_NAVIGATOR && $deviceInfo.navigator.float) {
-      if (getMetadata(workbench.metadata.NavigationExpandedDefault) === undefined) {
       $deviceInfo.navigator.float = false
-        $deviceInfo.navigator.visible = true
+      $deviceInfo.navigator.visible = !hiddenNavigator
-      }
     }
   }
   checkWorkbenchWidth()
@@ -653,10 +666,8 @@
     $deviceInfo.aside.visible = false
     $deviceInfo.aside.float = true
   } else if ($deviceInfo.docWidth > HIDE_ASIDE && $deviceInfo.aside.float) {
-    if (getMetadata(workbench.metadata.NavigationExpandedDefault) === undefined) {
     $deviceInfo.aside.float = false
-      $deviceInfo.aside.visible = true
+    $deviceInfo.aside.visible = !hiddenAside
-    }
   }
   const checkOnHide = (): void => {
     if ($deviceInfo.navigator.visible && $deviceInfo.navigator.float) $deviceInfo.navigator.visible = false
@@ -847,7 +858,12 @@
             notify={hasInboxNotifications}
           />
         </NavLink>
-        <Applications {apps} active={currentApplication?._id} direction={$deviceInfo.navigator.direction} />
+        <Applications
+          {apps}
+          active={currentApplication?._id}
+          direction={$deviceInfo.navigator.direction}
+          on:toggleNav={toggleNav}
+        />
       </div>
       <div
         class="info-box {$deviceInfo.navigator.direction}"

tests/sanity/tests/tracker/subissues.spec.ts

@@ -12,7 +12,6 @@ import {
 } from './tracker.utils'
 import { Issue, NewIssue } from '../model/tracker/types'
 import { IssuesDetailsPage } from '../model/tracker/issues-details-page'
-import { CommonTrackerPage } from '../model/tracker/common-tracker-page'
 
 test.use({
   storageState: PlatformSetting
@@ -20,17 +19,14 @@ test.use({
 test.describe('Tracker sub-issues tests', () => {
   let issuesPage: IssuesPage
   let issuesDetailsPage: IssuesDetailsPage
-  let commonTrackerPage: CommonTrackerPage
 
   test.beforeEach(async ({ page }) => {
     issuesPage = new IssuesPage(page)
     issuesDetailsPage = new IssuesDetailsPage(page)
-    commonTrackerPage = new CommonTrackerPage(page)
     await (await page.goto(`${PlatformURI}/workbench/sanity-ws`))?.finished()
   })
 
   test('create sub-issue', async ({ page }) => {
-    await commonTrackerPage.clickOnApplicationButton()
     const props = {
       name: `issue-${generateId(5)}`,
       description: 'description',