UBER-325/349/352/342 (#3320)

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

dev/docker-compose.yaml

@@ -98,6 +98,7 @@ services:
       - MINIO_ENDPOINT=minio
       - MINIO_ACCESS_KEY=minioadmin
       - MINIO_SECRET_KEY=minioadmin
+      - TITLE=DevPlatform
     restart: unless-stopped
   # tracker-front:
   #   image: hardcoreeng/tracker-front

dev/prod/src/platform.ts

@@ -87,6 +87,7 @@ interface Config {
   REKONI_URL: string
   TELEGRAM_URL: string
   GMAIL_URL: string
+  TITLE?: string
 }
 
 const devConfig = process.env.CLIENT_TYPE === 'dev-production'
@@ -161,5 +162,5 @@ export async function configurePlatform() {
   // Disable for now, since it causes performance issues on linux/docker/kubernetes boxes for now.
   setMetadata(client.metadata.UseProtocolCompression, true)
 
-  setMetadata(workbench.metadata.PlatformTitle, 'Platform')
+  setMetadata(workbench.metadata.PlatformTitle, config.TITLE ?? 'Platform')
 }

models/setting/src/index.ts

@@ -268,34 +268,34 @@ export function createModel (builder: Builder): void {
   //   },
   //   setting.ids.Support
   // )
-  builder.createDoc(
+  // builder.createDoc(
-    setting.class.SettingsCategory,
+  //   setting.class.SettingsCategory,
-    core.space.Model,
+  //   core.space.Model,
-    {
+  //   {
-      name: 'privacy',
+  //     name: 'privacy',
-      label: setting.string.Privacy,
+  //     label: setting.string.Privacy,
-      icon: setting.icon.Privacy,
+  //     icon: setting.icon.Privacy,
-      component: setting.component.Privacy,
+  //     component: setting.component.Privacy,
-      group: 'main',
+  //     group: 'main',
-      secured: false,
+  //     secured: false,
-      order: 6000
+  //     order: 6000
-    },
+  //   },
-    setting.ids.Privacy
+  //   setting.ids.Privacy
-  )
+  // )
-  builder.createDoc(
+  // builder.createDoc(
-    setting.class.SettingsCategory,
+  //   setting.class.SettingsCategory,
-    core.space.Model,
+  //   core.space.Model,
-    {
+  //   {
-      name: 'terms',
+  //     name: 'terms',
-      label: setting.string.Terms,
+  //     label: setting.string.Terms,
-      icon: setting.icon.Terms,
+  //     icon: setting.icon.Terms,
-      component: setting.component.Terms,
+  //     component: setting.component.Terms,
-      group: 'main',
+  //     group: 'main',
-      secured: false,
+  //     secured: false,
-      order: 10000
+  //     order: 10000
-    },
+  //   },
-    setting.ids.Terms
+  //   setting.ids.Terms
-  )
+  // )
 
   builder.createDoc(
     workbench.class.Application,

packages/ui/src/colors.ts

@@ -236,52 +236,52 @@ export const CadetGreyColor = '#95A2B3'
 /**
  * @public
  */
-export function getPlatformColor (hash: number, blackTheme: boolean): string {
+export function getPlatformColor (hash: number, darkTheme: boolean): string {
-  const palette = blackTheme ? darkPalette : whitePalette
+  const palette = darkTheme ? darkPalette : whitePalette
   return (palette[Math.abs(hash) % palette.length] ?? palette[0]).color
 }
 
 /**
  * @public
  */
-export function getPlatformColorDef (hash: number, blackTheme: boolean): ColorDefinition {
+export function getPlatformColorDef (hash: number, darkTheme: boolean): ColorDefinition {
-  const palette = blackTheme ? darkPalette : whitePalette
+  const palette = darkTheme ? darkPalette : whitePalette
   return palette[Math.abs(hash) % palette.length] ?? palette[0]
 }
 
 /**
  * @public
  */
-export function getPlatformAvatarColorDef (hash: number, blackTheme: boolean): ColorDefinition {
+export function getPlatformAvatarColorDef (hash: number, darkTheme: boolean): ColorDefinition {
-  const palette = blackTheme ? avatarDarkColors : avatarWhiteColors
+  const palette = darkTheme ? avatarDarkColors : avatarWhiteColors
   return palette[Math.abs(hash) % palette.length] ?? palette[0]
 }
 
 /**
  * @public
  */
-export function getPlatformAvatarColorForTextDef (text: string, blackTheme: boolean): ColorDefinition {
+export function getPlatformAvatarColorForTextDef (text: string, darkTheme: boolean): ColorDefinition {
-  return getPlatformAvatarColorDef(hashCode(text), blackTheme)
+  return getPlatformAvatarColorDef(hashCode(text), darkTheme)
 }
 
 /**
  * @public
  */
-export function getPlatformColorForText (text: string, blackTheme: boolean): string {
+export function getPlatformColorForText (text: string, darkTheme: boolean): string {
-  return getPlatformColor(hashCode(text), blackTheme)
+  return getPlatformColor(hashCode(text), darkTheme)
 }
 /**
  * @public
  */
-export function getPlatformColorForTextDef (text: string, blackTheme: boolean): ColorDefinition {
+export function getPlatformColorForTextDef (text: string, darkTheme: boolean): ColorDefinition {
-  return getPlatformColorDef(hashCode(text), blackTheme)
+  return getPlatformColorDef(hashCode(text), darkTheme)
 }
 
 /**
  * @public
  */
-export function getPlatformColors (blackTheme: boolean): readonly ColorDefinition[] {
+export function getPlatformColors (darkTheme: boolean): readonly ColorDefinition[] {
-  return blackTheme ? darkPalette : whitePalette
+  return darkTheme ? darkPalette : whitePalette
 }
 
 function hashCode (str: string): number {

plugins/contact-resources/src/components/ChannelFilter.svelte

@@ -62,13 +62,15 @@
   }
 
   const dispatch = createEventDispatcher()
+
+  const sortedElemenets = sortFilterValues($channelProviders, (v) => isSelected(v, selected))
 </script>
 
 <div class="selectPopup" use:resizeObserver={() => dispatch('changeContent')}>
   <div class="menu-space" />
   <div class="scroll">
     <div class="box">
-      {#each sortFilterValues($channelProviders, (v) => isSelected(v, selected)) as element}
+      {#each sortedElemenets as element}
         <button
           class="menu-item no-focus flex-row-center content-pointer-events-none"
           on:click={() => {

plugins/contact-resources/src/components/EmployeeFilter.svelte

@@ -94,6 +94,7 @@
         })
       }
     }
+    values = sortFilterValues(values, (v) => isSelected(v, filter.value))
     objectsPromise = undefined
   }
 
@@ -146,7 +147,7 @@
       {#if objectsPromise}
         <Loading />
       {:else}
-        {#each sortFilterValues(values, (v) => isSelected(v, filter.value)) as value}
+        {#each values as value}
           <button
             class="menu-item no-focus flex-row-center"
             on:click={() => {

plugins/notification-resources/src/components/PeopleNotificationsView.svelte

@@ -157,11 +157,7 @@
       margin-right: 0.5rem;
       display: flex;
       flex-grow: 1;
-      padding: 0.5rem 0;
+      padding: 0.5rem 0;      
-
-      &.read {
-        opacity: 0.6;
-      }
     }
   }
 

plugins/tags-resources/src/components/TagsFilter.svelte

@@ -55,28 +55,45 @@
 
   let categories: TagCategory[] = []
   let objects: TagElement[] = []
+
+  let catsSorted = false
+
   client.findAll(tags.class.TagCategory, { targetClass: _class }).then((res) => {
     categories = res
   })
 
   let objectsPromise: Promise<FindResult<TagElement>> | undefined
+  let queryId = 0
 
   async function getValues (search: string): Promise<void> {
-    if (objectsPromise) {
+    const qid = ++queryId
-      await objectsPromise
-    }
     const resultQuery =
       search !== ''
         ? {
-            title: { $like: '%' + search + '%' },
+            title: { $like: search.replace('*', '%') + '%' },
             targetClass: _class
           }
         : { targetClass: _class }
     objectsPromise = client.findAll(tags.class.TagElement, resultQuery)
-    objects = await objectsPromise
+    const _objects = await objectsPromise
+    if (qid !== queryId) {
+      return
+    }
+    objects = _objects
     objectsPromise = undefined
   }
 
+  $: if (!catsSorted && categories.length > 0 && objects.length > 0 && selected.length > 0) {
+    categories.sort((a, b) => {
+      const alen = objects.filter((el) => el.category === a._id && isSelected(el))
+      const blen = objects.filter((el) => el.category === b._id && isSelected(el))
+      console.log(alen.length, blen.length, selected.length)
+      return blen.length - alen.length
+    })
+    categories = categories
+    catsSorted = true
+  }
+
   let search: string = ''
 
   const toggleGroup = (ev: MouseEvent): void => {
@@ -105,16 +122,16 @@
     objects = objects
     categories = categories
 
-    updateFilter(selected)
+    updateFilter(selected, level)
   }
 
-  function updateFilter (newValues: Ref<TagElement>[]) {
+  function updateFilter (newValues: Ref<TagElement>[], newLevel: number) {
     clearTimeout(filterUpdateTimeout)
 
     filterUpdateTimeout = setTimeout(() => {
       filter.value = [...newValues]
       // Replace last one with value with level
-      filter.props = { level }
+      filter.props = { level: newLevel }
       onChange(filter)
     }, FILTER_DEBOUNCE_MS)
   }
@@ -150,6 +167,7 @@
               if (Number.isFinite(res) && res >= 0 && res <= 8) {
                 if (res != null) {
                   level = res
+                  updateFilter(selected, level)
                 }
               }
             })
@@ -164,7 +182,10 @@
         <Loading />
       {:else}
         {#each categories as cat, i}
-          {@const values = objects.filter((el) => el.category === cat._id)}
+          {@const values = sortFilterValues(
+            objects.filter((el) => el.category === cat._id),
+            isSelected
+          )}
           {#if values.length > 0}
             {#if i > 0}<div class="menu-separator" />{/if}
             <div class="sticky-wrapper">
@@ -190,7 +211,7 @@
                 {/if}
               </button>
               <div class="menu-group">
-                {#each sortFilterValues(values, isSelected) as element}
+                {#each values as element}
                   {@const color = getPlatformColorDef(element.color, $themeStore.dark)}
                   <button
                     class="menu-item no-focus flex-row-center"

plugins/tracker-resources/src/components/milestones/MilestoneFilter.svelte

@@ -105,7 +105,9 @@
   }
 
   function getStatusItem (status: MilestoneStatus, docs: Milestone[]): Milestone[] {
-    return docs.filter((p) => p.status === status)
+    let vals = docs.filter((p) => p.status === status)
+    vals = sortFilterValues(vals, (v) => isSelected(v._id, selectedValues))
+    return vals
   }
 
   function getStatuses (): MilestoneStatus[] {
@@ -161,7 +163,7 @@
                 <span class="overflow-label"><Label label={status.label} /></span>
               </div>
             </div>
-            {#each sortFilterValues(items, (v) => isSelected(v._id, selectedValues)) as doc}
+            {#each items as doc}
               <button
                 class="menu-item no-focus flex-row-center"
                 on:click={() => {

plugins/view-resources/src/components/filter/ObjectFilter.svelte

@@ -125,6 +125,7 @@
         })
       }
     }
+    values = sortFilterValues(values, (v) => isSelected(v, filter.value))
     objectsPromise = undefined
   }
 
@@ -190,7 +191,7 @@
         {#if objectsPromise}
           <Loading />
         {:else}
-          {#each sortFilterValues(values, (v) => isSelected(v, filter.value)) as value}
+          {#each values as value}
             <button
               class="menu-item no-focus content-pointer-events-none"
               on:click={() => {

plugins/view-resources/src/components/filter/ValueFilter.svelte

@@ -46,6 +46,7 @@
   const promise = getPresenter(client, filter.key._class, key, key)
 
   let values = new Set<any>()
+  let sortedValues: any[] = []
   let selectedValues: Set<any> = new Set<any>(filter.value.map((p) => p[0]))
   const realValues = new Map<any, Set<any>>()
 
@@ -95,6 +96,7 @@
       values.add(object)
     }
     values = values
+    sortedValues = sortFilterValues([...values.keys()], (v) => isSelected(v, selectedValues))
     objectsPromise = undefined
   }
 
@@ -165,7 +167,7 @@
         {#if objectsPromise}
           <Loading />
         {:else}
-          {#each sortFilterValues([...values.keys()], (v) => isSelected(v, selectedValues)) as value}
+          {#each sortedValues as value}
             {@const realValue = [...(realValues.get(value) ?? [])][0]}
             <button
               class="menu-item no-focus content-pointer-events-none"

plugins/view-resources/src/filter.ts

@@ -340,7 +340,7 @@ export function getFilterKey (_class: Ref<Class<Doc>> | undefined): string {
  * @param {(value: T) => boolean} checkIsSelected
  * @returns {readonly T[]}
  */
-export function sortFilterValues<T> (values: T[], checkIsSelected: (value: T) => boolean): readonly T[] {
+export function sortFilterValues<T> (values: T[], checkIsSelected: (value: T) => boolean): T[] {
   const selectedValues: T[] = []
   const notSelectedValues: T[] = []
 

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

@@ -14,11 +14,9 @@
 -->
 <script lang="ts">
   import type { Ref } from '@hcengineering/core'
-  import { createQuery } from '@hcengineering/presentation'
   import { Scroller } from '@hcengineering/ui'
   import { NavLink } from '@hcengineering/view-resources'
   import type { Application } from '@hcengineering/workbench'
-  import workbench from '@hcengineering/workbench'
   import { hideApplication, showApplication } from '../utils'
   import App from './App.svelte'
 
@@ -27,13 +25,13 @@
   export let direction: 'vertical' | 'horizontal' = 'vertical'
   export let shown: boolean = false
 
-  let loaded: boolean = false
+  const loaded: boolean = true
-  let hiddenAppsIds: Ref<Application>[] = []
+  const hiddenAppsIds: Ref<Application>[] = []
-  const hiddenAppsIdsQuery = createQuery()
+  // const hiddenAppsIdsQuery = createQuery()
-  hiddenAppsIdsQuery.query(workbench.class.HiddenApplication, {}, (res) => {
+  // hiddenAppsIdsQuery.query(workbench.class.HiddenApplication, {}, (res) => {
-    hiddenAppsIds = res.map((r) => r.attachedTo)
+  //   hiddenAppsIds = res.map((r) => r.attachedTo)
-    loaded = true
+  //   loaded = true
-  })
+  // })
 </script>
 
 <div class="flex-{direction === 'horizontal' ? 'row-center' : 'col-center'} clear-mins apps-{direction} relative">

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

@@ -14,9 +14,10 @@
 -->
 <script lang="ts">
   export let mini: boolean = false
+  export let workspace: string
 </script>
 
-<div class="antiLogo red" class:mini>P</div>
+<div class="antiLogo red" class:mini>{workspace.toUpperCase()[0]}</div>
 
 <style lang="scss">
   .antiLogo {
@@ -30,6 +31,9 @@
     outline: none;
     cursor: pointer;
 
+    &:hover {
+      opacity: 0.8;
+    }
     &:not(.mini) {
       width: 2rem;
       height: 2rem;
@@ -39,7 +43,7 @@
       height: 1.5rem;
     }
     &.red {
-      background-color: #c93030;
+      background-color: rgb(246, 105, 77);
     }
     &.blue {
       background-color: #2b5190;

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

@@ -20,7 +20,8 @@
   import notification, { notificationId } from '@hcengineering/notification'
   import { BrowserNotificatator, NotificationClientImpl } from '@hcengineering/notification-resources'
   import { IntlString, getMetadata, getResource } from '@hcengineering/platform'
-  import { configurationStore, createQuery, getClient, ActionContext } from '@hcengineering/presentation'
+  import { ActionContext, configurationStore, createQuery, getClient } from '@hcengineering/presentation'
+  import { resolvedLocationStore } from '@hcengineering/ui'
   import {
     AnyComponent,
     CompAndProps,
@@ -49,7 +50,6 @@
     showPopup
   } from '@hcengineering/ui'
   import view from '@hcengineering/view'
-  import setting from '@hcengineering/setting'
   import {
     ActionHandler,
     ListSelectionProvider,
@@ -69,9 +69,8 @@
   import Logo from './Logo.svelte'
   import NavHeader from './NavHeader.svelte'
   import Navigator from './Navigator.svelte'
-  import SpaceView from './SpaceView.svelte'
   import SelectWorkspaceMenu from './SelectWorkspaceMenu.svelte'
-  import Settings from './icons/Settings.svelte'
+  import SpaceView from './SpaceView.svelte'
   import TopMenu from './icons/TopMenu.svelte'
 
   let contentPanel: HTMLElement
@@ -574,7 +573,7 @@
             showPopup(SelectWorkspaceMenu, {}, popupSpacePosition)
           }}
         >
-          <Logo mini={appsMini} />
+          <Logo mini={appsMini} workspace={$resolvedLocationStore.path[1]} />
         </div>
         <div class="topmenu-container clear-mins flex-no-shrink" class:mini={appsMini}>
           <AppItem
@@ -622,13 +621,13 @@
         />
       </div>
       <div class="info-box {appsDirection}" class:vertical-mobile={appsDirection === 'vertical'} class:mini={appsMini}>
-        <AppItem
+        <!-- <AppItem
           icon={Settings}
           label={setting.string.Settings}
           selected={shownMenu}
           size={appsMini ? 'small' : 'large'}
           on:click={() => (shownMenu = !shownMenu)}
-        />
+        /> -->
         <div class="flex-center" class:mt-3={appsDirection === 'vertical'} class:ml-2={appsDirection === 'horizontal'}>
           <!-- svelte-ignore a11y-click-events-have-key-events -->
           <div

server/front/src/__start.ts

@@ -107,6 +107,8 @@ if (serverSecret === undefined) {
   process.exit(1)
 }
 
+const title = process.env.TITLE
+
 setMetadata(serverToken.metadata.Secret, serverSecret)
 
 const config = {
@@ -119,7 +121,8 @@ const config = {
   collaboratorUrl,
   gmailUrl,
   telegramUrl,
-  rekoniUrl
+  rekoniUrl,
+  title
 }
 console.log('Starting Front service with', config)
 const shutdown = start(config, SERVER_PORT)

server/front/src/index.ts

@@ -140,6 +140,7 @@ export function start (
     rekoniUrl: string
     telegramUrl: string
     gmailUrl: string
+    title?: string
   },
   port: number
 ): () => void {
@@ -175,7 +176,8 @@ export function start (
       COLLABORATOR_URL: config.collaboratorUrl,
       REKONI_URL: config.rekoniUrl,
       TELEGRAM_URL: config.telegramUrl,
-      GMAIL_URL: config.gmailUrl
+      GMAIL_URL: config.gmailUrl,
+      TITLE: config.title
     })
   })