Return spaces to card navigator (#10243)

* Return spaces to card navigator

Signed-off-by: Denis Bykhov <bykhov.denis@gmail.com>

* Fix formatting

Signed-off-by: Denis Bykhov <bykhov.denis@gmail.com>

---------

Signed-off-by: Denis Bykhov <bykhov.denis@gmail.com>

models/card/src/index.ts

@@ -472,7 +472,7 @@ export function createModel (builder: Builder): void {
               _class: card.class.Card,
               icon: card.icon.All,
               label: card.string.AllCards,
-              defaultViewletDescriptor: card.viewlet.CardFeedDescriptor
+              defaultViewletDescriptor: view.viewlet.Table
             },
             position: 'top'
           },
@@ -491,7 +491,17 @@ export function createModel (builder: Builder): void {
             position: 'top'
           }
         ],
-        spaces: [],
+        spaces: [
+          {
+            id: 'spaces',
+            label: core.string.Spaces,
+            spaceClass: card.class.CardSpace,
+            addSpaceLabel: core.string.Space,
+            icon: card.icon.Space,
+            // intentionally left empty in order to make space presenter working
+            specials: []
+          }
+        ],
         groups: [
           {
             id: 'types',
@@ -503,14 +513,12 @@ export function createModel (builder: Builder): void {
               {
                 id: 'type',
                 label: card.string.Cards,
-                component: card.component.Main,
-                componentProps: {
-                  defaultViewletDescriptor: card.viewlet.CardFeedDescriptor
-                }
+                component: card.component.Main
               }
             ]
           }
-        ]
+        ],
+        hideStarred: true
       },
       navHeaderActions: card.component.CardHeaderButton
     },

plugins/card-resources/src/components/Favorites.svelte

@@ -26,6 +26,5 @@
   _class={card.class.FavoriteCard}
   icon={view.icon.Star}
   label={preference.string.Starred}
-  defaultViewletDescriptor={view.viewlet.List}
   baseQuery={{ application }}
 />

plugins/card-resources/src/components/Main.svelte

@@ -14,7 +14,7 @@
 -->
 <script lang="ts">
   import { MasterTag } from '@hcengineering/card'
-  import { Class, Doc, Ref } from '@hcengineering/core'
+  import { Class, Doc, Ref, Space } from '@hcengineering/core'
   import { IntlString } from '@hcengineering/platform'
   import { createQuery } from '@hcengineering/presentation'
   import { location } from '@hcengineering/ui'
@@ -23,11 +23,12 @@
   import card from '../plugin'
 
   let _class: Ref<Class<Doc>> | undefined
+  let space: Ref<Space> | undefined
 
   onDestroy(
     location.subscribe((loc) => {
-      const isTypeSpecified = loc.path[3] === 'type'
-      _class = isTypeSpecified ? loc.path[4] : card.class.Card
+      space = loc.path[3] === 'type' ? undefined : loc.path[3]
+      _class = loc.path[4]
     })
   )
 
@@ -38,7 +39,7 @@
     allClasses = res.filter((it) => it.removed !== true)
   })
 
-  $: clazz = allClasses.find((it) => it._id === _class)
+  $: clazz = allClasses.find((it) => it._id === _class) ?? allClasses.find((it) => it._id === card.class.Card)
 
   $: label = getLabel(clazz)
 
@@ -50,8 +51,9 @@
 {#if clazz !== undefined && label !== undefined}
   <SpecialView
     _class={clazz._id}
-    defaultViewletDescriptor={card.viewlet.CardFeedDescriptor}
+    baseQuery={space !== undefined ? { space } : {}}
+    {space}
     {label}
-    icon={card.icon.Card}
+    icon={clazz.icon ?? card.icon.Card}
   />
 {/if}

plugins/card-resources/src/components/navigator/TypesNavigator.svelte

@@ -14,7 +14,7 @@
 -->
 <script lang="ts">
   import { FavoriteType, MasterTag } from '@hcengineering/card'
-  import core, { Class, Doc, getCurrentAccount, Ref } from '@hcengineering/core'
+  import core, { Class, Doc, getCurrentAccount, Ref, Space } from '@hcengineering/core'
   import preference from '@hcengineering/preference'
   import { createQuery, getClient } from '@hcengineering/presentation'
   import { Action, getCurrentLocation, location as locationStore, navigate } from '@hcengineering/ui'
@@ -25,6 +25,7 @@
   import TagHierarchy from './TagHierarchy.svelte'
 
   export let model: GroupsNavModel
+  export let currentSpace: Ref<Space> | undefined
 
   let classes: MasterTag[] = []
   let _class: Ref<Class<Doc>> | undefined
@@ -116,7 +117,7 @@
   $: empty = rootClasses === undefined || rootClasses.length === 0
 </script>
 
-<div class="flex-col w-full">
+<div class="flex-col w-full flex-no-shrink">
   {#if favoriteRootClasses.length > 0}
     <TreeNode
       _id={'tree-favorites-' + model.id}
@@ -130,7 +131,7 @@
         allClasses={classes}
         {_class}
         space={undefined}
-        currentSpace={undefined}
+        {currentSpace}
         {getItemActions}
         on:select={(e) => {
           selectType(e.detail)
@@ -152,7 +153,7 @@
         allClasses={classes}
         {_class}
         space={undefined}
-        currentSpace={undefined}
+        {currentSpace}
         {getItemActions}
         excludedClasses={favoriteTypes}
         on:select={(e) => {

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

@@ -81,8 +81,8 @@
 
   let requestIndex = 0
   async function update (model: NavigatorModel, spaces: Space[], preferences: Map<Ref<Doc>, SpacePreference>) {
-    shownSpaces = spaces.filter((sp) => !sp.archived && !preferences.has(sp._id))
-    starred = spaces.filter((sp) => preferences.has(sp._id))
+    shownSpaces = spaces.filter((sp) => !sp.archived && (model.hideStarred || !preferences.has(sp._id)))
+    starred = model.hideStarred ? [] : spaces.filter((sp) => preferences.has(sp._id))
     if (model.specials !== undefined) {
       const [sp, resIndex] = await updateSpecials(model.specials, spaces, ++requestIndex)
       if (resIndex !== requestIndex) return
@@ -173,7 +173,7 @@
     <div class="min-h-3 flex-no-shrink" />
 
     <SavedView alias={currentApplication?.alias} on:select={(res) => (menuSelection = res.detail)} />
-    {#if starred.length}
+    {#if starred.length > 0 && !model.hideStarred}
       <StarredNav
         label={preference.string.Starred}
         spaces={starred}
@@ -186,6 +186,15 @@
       />
     {/if}
 
+    {#if model.groups && model.groups.length > 0}
+      <div class="min-h-3 flex-no-shrink" />
+      {#each model.groups as group (group.id)}
+        {#if group.component}
+          <Component is={group.component} props={{ model: group, currentSpace }} />
+        {/if}
+      {/each}
+    {/if}
+
     {#each model.spaces as m (m.label)}
       <SpacesNav
         spaces={shownSpaces.filter((it) => hierarchy.isDerived(it._class, m.spaceClass))}
@@ -198,14 +207,5 @@
         deselect={menuSelection || starred.some((s) => s._id === currentSpace)}
       />
     {/each}
-
-    {#if model.groups && model.groups.length > 0}
-      <div class="min-h-3 flex-no-shrink" />
-      {#each model.groups as group (group.id)}
-        {#if group.component}
-          <Component is={group.component} props={{ model: group }} />
-        {/if}
-      {/each}
-    {/if}
   </Scroller>
 {/if}

plugins/workbench/src/types.ts

@@ -159,6 +159,7 @@ export interface NavigatorModel {
   spaces: SpacesNavModel[]
   specials?: SpecialNavModel[]
   groups?: GroupsNavModel[]
+  hideStarred?: boolean
 }
 
 /** @public */