1510 Show starred dm name (#1534)

Signed-off-by: Denis Bunakalya <denis.bunakalya@xored.com>

plugins/workbench-resources/src/components/navigator/SpacesNav.svelte

@@ -36,7 +36,7 @@
   import { SpacesNavModel } from '@anticrm/workbench'
   import { createEventDispatcher } from 'svelte'
   import plugin from '../../plugin'
-  import { classIcon } from '../../utils'
+  import { classIcon, getSpaceName } from '../../utils'
   import SpecialElement from './SpecialElement.svelte'
   import TreeItem from './TreeItem.svelte'
   import TreeNode from './TreeNode.svelte'
@@ -132,20 +132,6 @@
     return lastView < value
   }
 
-  async function getName (space: Space) {
-    const clazz = hierarchy.getClass(space._class)
-    const nameMixin = hierarchy.as(clazz, view.mixin.SpaceName)
-
-    if (nameMixin.getName) {
-      const getSpaceName = await getResource(nameMixin.getName);
-      const name = await getSpaceName(client, space)
-
-      return name
-    }
-
-    return space.name
-  }
-  
   function getParentActions(): Action[] {
     return hasSpaceBrowser ? [browseSpaces, addSpace] : [addSpace]
   }
@@ -169,7 +155,7 @@
         {/each}
       </TreeNode>
     {:else}
-      {#await getName(space) then name}
+      {#await getSpaceName(client, space) then name}
         <TreeItem
           indent={'ml-4'}
           _id={space._id}

plugins/workbench-resources/src/components/navigator/StarredNav.svelte

@@ -24,7 +24,7 @@
   import view from '@anticrm/view'
   import { getActions as getContributedActions } from '@anticrm/view-resources'
   import { createEventDispatcher } from 'svelte'
-  import { classIcon } from '../../utils'
+  import { classIcon, getSpaceName } from '../../utils'
   import TreeItem from './TreeItem.svelte'
   import TreeNode from './TreeNode.svelte'
 
@@ -52,15 +52,19 @@
       const ids = spaces.map((space) => space._id)
       const current = await client.findAll(preference.class.SpacePreference, { attachedTo: { $in: ids } })
 
-      await Promise.all(current.map(async (item) => { await client.remove(item) }))
+      await Promise.all(
+        current.map(async (item) => {
+          await client.remove(item)
+        })
+      )
     }
   }
 
-  function selectSpace (id: Ref<Space>, spaceSpecial?: string) {
+  function selectSpace(id: Ref<Space>, spaceSpecial?: string) {
     dispatch('space', { space: id, spaceSpecial })
   }
 
-  async function getActions (space: Space): Promise<Action[]> {
+  async function getActions(space: Space): Promise<Action[]> {
     const result = [unStarSpace]
 
     const extraActions = await getContributedActions(client, space, core.class.Space)
@@ -81,7 +85,7 @@
   const lastViews = notificationClient.getLastViews()
   const hierarchy = client.getHierarchy()
 
-  function isChanged (space: Space, lastViews: Map<Ref<Doc>, number>): boolean {
+  function isChanged(space: Space, lastViews: Map<Ref<Doc>, number>): boolean {
     const clazz = hierarchy.getClass(space._class)
     const lastEditMixin = hierarchy.as(clazz, notification.mixin.SpaceLastEdit)
     const field = lastEditMixin?.lastEditField
@@ -95,19 +99,21 @@
   }
 </script>
 
-<TreeNode label={label} parent actions={async () => [unStarAll]} indent={'ml-2'}>
+<TreeNode {label} parent actions={async () => [unStarAll]} indent={'ml-2'}>
   {#each spaces as space (space._id)}
-    <TreeItem
-      indent={'ml-4'}
-      _id={space._id}
-      title={space.name}
-      icon={classIcon(client, space._class)}
-      selected={currentSpace === space._id}
-      actions={() => getActions(space)}
-      bold={isChanged(space, $lastViews)}
-      on:click={() => {
-        selectSpace(space._id)
-      }}
+    {#await getSpaceName(client, space) then name}
+      <TreeItem
+        indent={'ml-4'}
+        _id={space._id}
+        title={name}
+        icon={classIcon(client, space._class)}
+        selected={currentSpace === space._id}
+        actions={() => getActions(space)}
+        bold={isChanged(space, $lastViews)}
+        on:click={() => {
+          selectSpace(space._id)
+        }}
       />
+    {/await}
   {/each}
 </TreeNode>

plugins/workbench-resources/src/utils.ts

@@ -16,13 +16,30 @@
 
 import type { Class, Client, Obj, Ref, Space } from '@anticrm/core'
 import type { Asset } from '@anticrm/platform'
+import { getResource } from '@anticrm/platform'
 import { NavigatorModel } from '@anticrm/workbench'
+import view from '@anticrm/view'
 
-export function classIcon (client: Client, _class: Ref<Class<Obj>>): Asset | undefined {
+export function classIcon(client: Client, _class: Ref<Class<Obj>>): Asset | undefined {
   return client.getHierarchy().getClass(_class).icon
 }
-export function getSpecialSpaceClass (model: NavigatorModel): Array<Ref<Class<Space>>> {
-  const spaceResult = model.spaces.map(x => x.spaceClass)
-  const result = (model.specials ?? []).map(it => it.spaceClass).filter(it => it !== undefined)
+export function getSpecialSpaceClass(model: NavigatorModel): Array<Ref<Class<Space>>> {
+  const spaceResult = model.spaces.map((x) => x.spaceClass)
+  const result = (model.specials ?? []).map((it) => it.spaceClass).filter((it) => it !== undefined)
   return spaceResult.concat(result as Array<Ref<Class<Space>>>)
 }
+
+export async function getSpaceName(client: Client, space: Space) {
+  const hierarchy = client.getHierarchy()
+  const clazz = hierarchy.getClass(space._class)
+  const nameMixin = hierarchy.as(clazz, view.mixin.SpaceName)
+
+  if (nameMixin.getName) {
+    const getSpaceName = await getResource(nameMixin.getName)
+    const name = await getSpaceName(client, space)
+
+    return name
+  }
+
+  return space.name
+}