Workbench fixes

Workbench fixes

Signed-off-by: Andrey Sobolev <haiodo@gmail.com>

common/config/rush/pnpm-lock.yaml

@@ -83,6 +83,7 @@ specifiers:
   '@rush-temp/view-assets': file:./projects/view-assets.tgz
   '@rush-temp/view-resources': file:./projects/view-resources.tgz
   '@rush-temp/workbench': file:./projects/workbench.tgz
+  '@rush-temp/workbench-assets': file:./projects/workbench-assets.tgz
   '@rush-temp/workbench-resources': file:./projects/workbench-resources.tgz
   '@rush-temp/workspace': file:./projects/workspace.tgz
   '@rushstack/heft': ^0.41.1
@@ -231,6 +232,7 @@ dependencies:
   '@rush-temp/view-assets': file:projects/view-assets.tgz
   '@rush-temp/view-resources': file:projects/view-resources.tgz_e1367da94684b005adf08f025c517b1a
   '@rush-temp/workbench': file:projects/workbench.tgz_typescript@4.4.3
+  '@rush-temp/workbench-assets': file:projects/workbench-assets.tgz
   '@rush-temp/workbench-resources': file:projects/workbench-resources.tgz_e1367da94684b005adf08f025c517b1a
   '@rush-temp/workspace': file:projects/workspace.tgz_typescript@4.4.3
   '@rushstack/heft': 0.41.1
@@ -10409,7 +10411,7 @@ packages:
     dev: false
 
   file:projects/presentation.tgz_e1367da94684b005adf08f025c517b1a:
-    resolution: {integrity: sha512-1einnqLkZQVaVUNlm/JU8G7micSM3DR/4em+rasS0Pt9FHyehFspVTvowM4757t7HAbIFYxx/m5MQ2AiGjGiwQ==, tarball: file:projects/presentation.tgz}
+    resolution: {integrity: sha512-2IXWVC0yNL631Gw6X7QwqjGN1+9Ooqswvx9OJchqJ9knRKWZ0RwjgQjHI5QGxs85aUTAB0F5WUe1NMdmfERY3Q==, tarball: file:projects/presentation.tgz}
     id: file:projects/presentation.tgz
     name: '@rush-temp/presentation'
     version: 0.0.0
@@ -11079,6 +11081,12 @@ packages:
       - typescript
     dev: false
 
+  file:projects/workbench-assets.tgz:
+    resolution: {integrity: sha512-DCD9OfS0mb4mHt9QEJA9kFvaLl7Lcw3fNmNUtDDVFaN0W7xpELihKhKEMn4wt+FvwwTww5D/jykdb0sQh7K6Fw==, tarball: file:projects/workbench-assets.tgz}
+    name: '@rush-temp/workbench-assets'
+    version: 0.0.0
+    dev: false
+
   file:projects/workbench-resources.tgz_e1367da94684b005adf08f025c517b1a:
     resolution: {integrity: sha512-y7W8oQuhPXIzrM/erW/ajFnF4iO8f2FHXHNZ+jM2XSLqnhXeXZQlIzYMOq4lVWWl+RfYoZNxLeeia76z5qAHdQ==, tarball: file:projects/workbench-resources.tgz}
     id: file:projects/workbench-resources.tgz

dev/prod/package.json

@@ -77,6 +77,7 @@
     "@anticrm/activity-assets": "~0.6.0",
     "@anticrm/activity-resources": "~0.6.0",
     "@anticrm/telegram": "~0.6.0",
-    "@anticrm/telegram-resources": "~0.6.0"
+    "@anticrm/telegram-resources": "~0.6.0",
+    "@anticrm/workbench-assets": "~0.6.0"
   }
 }

dev/prod/src/platform.ts

@@ -35,6 +35,7 @@ import '@anticrm/contact-assets'
 import '@anticrm/recruit-assets'
 import '@anticrm/activity-assets'
 import '@anticrm/setting-assets'
+import '@anticrm/workbench-assets'
 
 import { setMetadata } from '@anticrm/platform'
 export function configurePlatform() {  

plugins/task-assets/lang/en.json

@@ -0,0 +1,7 @@
+{
+  "string": {
+    "ApplicationLabelTask": "Tasks",
+    "Projects": "Projects",
+    "CreateProject": "New Project"
+  }
+}

plugins/workbench-assets/assets/icons.svg

@@ -0,0 +1,2 @@
+<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
+</svg>

plugins/workbench-assets/lang/en.json

@@ -0,0 +1,7 @@
+{
+  "string": {
+    "More": "More...",
+    "Delete": "Delete",
+    "Create": "Create"
+  }
+}

plugins/workbench-assets/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "@anticrm/workbench-assets",
+  "version": "0.6.0",
+  "main": "src/index.ts",
+  "author": "Anticrm Platform Contributors",
+  "license": "EPL-2.0",
+  "scripts": {
+    "build": "",
+    "lint": "",
+    "lint:fix": "",
+    "format": ""
+  },
+  "devDependencies": {
+  },
+  "dependencies": {
+    "@anticrm/platform":"~0.6.5",
+    "@anticrm/workbench":"~0.6.0"
+  }
+}

plugins/workbench-assets/src/index.ts

@@ -0,0 +1,19 @@
+//
+// Copyright © 2020 Anticrm Platform Contributors.
+// 
+// Licensed under the Eclipse Public License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License. You may
+// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
+// 
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// 
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import { addStringsLoader } from '@anticrm/platform'
+import { workbenchId } from '@anticrm/workbench'
+
+addStringsLoader(workbenchId, async (lang: string) => await import(`../lang/${lang}.json`))

plugins/workbench-assets/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "moduleResolution": "node",
+    "target": "esnext",
+    "module": "esnext",
+    "declaration": true,
+    "outDir": "./lib",
+    "strict": true,
+    "esModuleInterop": true,
+    "lib": [
+      "esnext",
+      "dom"
+    ]
+  }
+}

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

@@ -15,20 +15,13 @@
 
 <script lang="ts">
 
-  import type { Ref } from '@anticrm/core'
+  import type { Ref } from '@anticrm/core';
-  import type { Application } from '@anticrm/workbench'
+  import { getCurrentLocation,navigate } from '@anticrm/ui';
-  import { getCurrentLocation, navigate } from '@anticrm/ui'
+  import type { Application } from '@anticrm/workbench';
-  import { createQuery } from '@anticrm/presentation'
+  import AppItem from './AppItem.svelte';
-  import workbench from '@anticrm/workbench'
-
-  import AppItem from './AppItem.svelte'
 
   export let active: Ref<Application> | undefined
-
+  export let apps: Application[] = []
-  let apps: Application[] = []
-
-  const query = createQuery()
-  $: query.query(workbench.class.Application, { hidden: false }, result => { apps = result })
 
   function navigateApp(app: Ref<Application>) {
     const loc = getCurrentLocation()

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

@@ -15,7 +15,7 @@
 
 <script lang="ts">
   import type { IntlString, Asset } from '@anticrm/platform'
-  import { Icon } from '@anticrm/ui'
+  import { Icon, Label } from '@anticrm/ui'
 
   export let icon: Asset | undefined
   export let label: IntlString
@@ -25,7 +25,7 @@
 <div class="header-container">
   <div class="flex-row-center">
     {#if icon }<span class="icon"><Icon {icon} size={'small'}/></span>{/if}
-    <span class="label">{label}</span>
+    <span class="label"><Label {label}/></span>
   </div>
   {#if description }<div class="description">{description}</div>{/if}
 </div>

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

@@ -15,15 +15,16 @@
 
 <script lang="ts">
   import type { IntlString } from '@anticrm/platform'
-  import { ActionIcon, IconMoreH } from '@anticrm/ui'
+  import { ActionIcon, IconMoreH, Label } from '@anticrm/ui'
+  import workbench from '../plugin'
 
   export let label: IntlString
-  export let action: () => Promise<void>
+  export let action: () => Promise<void> | void
 </script>
 
 <div class="container">
-  <span class="overflow-label label">{label}</span>
+  <span class="overflow-label label"><Label {label}></Label></span>
-  <ActionIcon label={'More...'} icon={IconMoreH} size={'small'} {action}/>
+  <ActionIcon label={workbench.string.More} icon={IconMoreH} size={'small'} {action}/>
 </div>
 
 <style lang="scss">

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

@@ -24,6 +24,7 @@
   import { showPopup } from '@anticrm/ui'
   import { classIcon } from '../utils'
   import core from '@anticrm/core'
+  import workbench from '../plugin'
 
   export let space: Ref<Space> | undefined
   export let createItemDialog: AnyComponent | undefined
@@ -44,11 +45,11 @@
   {#if data}
     <Header icon={classIcon(client, data._class)} label={data.name} description={data.description} />
     {#if createItemDialog}
-      <Button label="Create" primary={true} size={'small'} on:click={(ev) => showCreateDialog(ev)}/>
+      <Button label={workbench.string.Create} primary={true} size={'small'} on:click={(ev) => showCreateDialog(ev)}/>
     {/if}
-    <ActionIcon label={'Favorite'} icon={Star} size={'small'}/>
+    <!-- <ActionIcon label={'Favorite'} icon={Star} size={'small'}/>
     <ActionIcon label={'Create'} icon={IconAdd} size={'small'}/>
-    <ActionIcon label={'More...'} icon={IconMoreH} size={'small'}/>
+    <ActionIcon label={'More...'} icon={IconMoreH} size={'small'}/> -->
   {/if}
 </div>
 

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

@@ -16,13 +16,12 @@
 
 <script lang="ts">
 
-import type { Ref, Class ,Doc, FindOptions, Space, WithLookup, Obj } from '@anticrm/core'
+import type { Ref, Class ,Doc, FindOptions, Space, WithLookup, Obj, Client } from '@anticrm/core'
-import type { Connection } from '@anticrm/client'
 import type { Viewlet } from '@anticrm/view'
 
 import { getClient } from '@anticrm/presentation'
 
-import { Icon, Component, EditWithIcon, IconSearch } from '@anticrm/ui'
+import { Icon, Component, EditWithIcon, IconSearch, Tooltip } from '@anticrm/ui'
 
 import view from '@anticrm/view'
 import core from '@anticrm/core'
@@ -34,7 +33,7 @@ const client = getClient()
 
 type ViewletConfig = WithLookup<Viewlet>
 
-async function getViewlets(client: Connection, _class: Ref<Class<Obj>>): Promise<ViewletConfig[]> {
+async function getViewlets(client: Client, _class: Ref<Class<Obj>>): Promise<ViewletConfig[]> {
   return await client.findAll(view.class.Viewlet, { attachTo: _class }, { lookup: { 
     descriptor: core.class.Class
   }})
@@ -67,7 +66,11 @@ function onSearch(ev: Event) {
       <div class="flex">
         {#each viewlets as viewlet, i}
           <div class="btn" class:selected={selected === i} on:click={()=>{ selected = i }}>
-            <div class="icon"><Icon icon={viewlet.$lookup?.descriptor?.icon} size={'small'}/></div>
+            <div class="icon">
+              <Tooltip label={viewlet.$lookup?.descriptor?.label} direction={'top'}>
+                <Icon icon={viewlet.$lookup?.descriptor?.icon} size={'small'}/>
+              </Tooltip>
+            </div>
           </div>
         {/each}
       </div>

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

@@ -22,7 +22,7 @@
   import type { Kanban } from '@anticrm/view'
   import Delete from './icons/Delete.svelte'
 
-  import workbench from '@anticrm/workbench'
+  import workbench from '../plugin'
   import view from '@anticrm/view'
 
   export let kanban: Kanban
@@ -64,7 +64,7 @@
     <div class="icon">
       <Delete size={'medium'} />
     </div>
-    <div class="flex-grow"><Label label={'Delete'} /></div>
+    <div class="flex-grow"><Label label={workbench.string.Delete} /></div>
   </div>
 </div>
 

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

@@ -22,7 +22,7 @@
   
   import type { Ref, Space, Client } from '@anticrm/core'
   import type { Application, NavigatorModel, ViewConfiguration } from '@anticrm/workbench'
-  import { setClient, Avatar } from '@anticrm/presentation'
+  import { setClient, Avatar, createQuery } from '@anticrm/presentation'
   import workbench from '@anticrm/workbench'
 
   import Navigator from './Navigator.svelte'
@@ -38,6 +38,7 @@
   setClient(client)
 
   let currentApp: Ref<Application> | undefined
+  let currentApplication: Application | undefined
   let currentSpace: Ref<Space> | undefined
   let specialComponent: AnyComponent | undefined
   let currentView: ViewConfiguration | undefined
@@ -46,7 +47,8 @@
 
   onDestroy(location.subscribe(async (loc) => {
     currentApp = loc.path[1] as Ref<Application>
-    navigatorModel = (await client.findAll(workbench.class.Application, { _id: currentApp }))[0]?.navigatorModel
+    currentApplication = (await client.findAll(workbench.class.Application, { _id: currentApp }))[0]
+    navigatorModel = currentApplication?.navigatorModel
     let currentFolder = loc.path[2] as Ref<Space>
     specialComponent = getSpecialComponent(currentFolder)
     if (!specialComponent) {
@@ -68,6 +70,11 @@
     let special = navigatorModel?.specials?.find((x) => x.id === id)
     return special?.component
   }
+
+  let apps: Application[] = []
+
+  const query = createQuery()
+  $: query.query(workbench.class.Application, { hidden: false }, result => { apps = result })
 </script>
 
 {#if client}
@@ -82,7 +89,7 @@
   <div class="container">
     <div class="panel-app">
       <ActivityStatus status="active"/>
-      <Applications active={currentApp}/>
+      <Applications {apps} active={currentApp}/>
       <div class="flex-center" style="min-height: 6.25rem;">
         <div class="cursor-pointer" on:click={(el) => { showPopup(AccountPopup, { }, 'account') }}>
           <Avatar size={'medium'} />
@@ -91,7 +98,9 @@
     </div>
     {#if navigator}
     <div class="panel-navigator">
-      <NavHeader label={'Chat'} action={() => {}} />
+      {#if currentApplication}
+        <NavHeader label={currentApplication.label} action={() => {}} />
+      {/if}
       <Navigator model={navigatorModel} />
     </div>
     {/if}

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

@@ -56,9 +56,9 @@
     <div class="flex-grow fs-title ml-2"><Label label={clazz.label} /></div>
     <div class="tool" on:click={() => { dispatch('close') }}><IconClose size={'small'} /></div>
   </div>
-  <div class="flex-row-center subtitle">
+  <!-- <div class="flex-row-center subtitle">
     Subtitle
-  </div>
+  </div> -->
   <div class="flex-stretch tab-container">
     {#each tabs as tab, i}
       <div class="flex-row-center tab" class:selected={i === selected}
@@ -118,12 +118,12 @@
       }
     }
 
-    .subtitle {
+    // .subtitle {
-      flex-shrink: 0;
+    //   flex-shrink: 0;
-      padding: 0 2.5rem;
+    //   padding: 0 2.5rem;
-      height: 3.5rem;
+    //   height: 3.5rem;
-      border-bottom: 1px solid var(--theme-dialog-divider);
+    //   border-bottom: 1px solid var(--theme-dialog-divider);
-    }
+    // }
   }
 
   .tab-container {

plugins/workbench-resources/src/plugin.ts

@@ -16,6 +16,12 @@
 import { mergeIds } from '@anticrm/platform'
 
 import workbench, { workbenchId } from '@anticrm/workbench'
+import { IntlString } from '@anticrm/platform'
 
 export default mergeIds(workbenchId, workbench, {
+  string: {
+    More: '' as IntlString,
+    Delete: '' as IntlString,
+    Create: '' as IntlString
+  }
 })

rush.json

@@ -521,6 +521,11 @@
       "projectFolder": "plugins/workbench",
       "shouldPublish": true
     },
+    {
+      "packageName": "@anticrm/workbench-assets",
+      "projectFolder": "plugins/workbench-assets",
+      "shouldPublish": true
+    },
     {
       "packageName": "@anticrm/workbench-resources",
       "projectFolder": "plugins/workbench-resources",