From c2c99079613df4153c323baba2e0afda0dd37892 Mon Sep 17 00:00:00 2001
From: Denis Maslennikov <denis.maslennikov@gmail.com>
Date: Mon, 16 Jan 2023 10:49:10 +0700
Subject: [PATCH 1/6] Add new assignee popup with categories

Signed-off-by: Denis Maslennikov <denis.maslennikov@gmail.com>
---
 packages/presentation/lang/en.json            |   8 +-
 packages/presentation/lang/ru.json            |  10 +-
 packages/presentation/package.json            |   1 +
 .../src/components/AssigneeBox.svelte         | 177 ++++++++++
 .../src/components/AssigneePopup.svelte       | 320 ++++++++++++++++++
 packages/presentation/src/index.ts            |   1 +
 packages/presentation/src/plugin.ts           |   8 +-
 packages/presentation/src/utils.ts            |  43 ++-
 .../components/issues/AssigneeEditor.svelte   |   6 +-
 .../timereport/EstimationSubIssueList.svelte  |   5 +-
 10 files changed, 569 insertions(+), 10 deletions(-)
 create mode 100644 packages/presentation/src/components/AssigneeBox.svelte
 create mode 100644 packages/presentation/src/components/AssigneePopup.svelte

diff --git a/packages/presentation/lang/en.json b/packages/presentation/lang/en.json
index e9909711813..95f11ca0a39 100644
--- a/packages/presentation/lang/en.json
+++ b/packages/presentation/lang/en.json
@@ -27,6 +27,12 @@
     "Add": "Add",
     "Edit": "Edit",
     "SelectAvatar": "Select avatar",
-    "GravatarsManaged": "Gravatars are managed through"
+    "GravatarsManaged": "Gravatars are managed through",
+    "CategoryCurrentUser": "Current user",
+    "Assigned": "Assigned",
+    "CategoryPreviousAssigned": "Previously assigned",
+    "CategoryProjectLead": "Project lead",
+    "CategoryProjectMembers": "Project members",
+    "CategoryOther": "Other"
   }
 }
diff --git a/packages/presentation/lang/ru.json b/packages/presentation/lang/ru.json
index 080f5102d24..de3e58261e3 100644
--- a/packages/presentation/lang/ru.json
+++ b/packages/presentation/lang/ru.json
@@ -22,11 +22,17 @@
     "NumberSpaces": "{count, plural, =0 {В} =1 {В 1 месте} other {В # местах}}",
     "InThis": "В этом {space}",
     "NoMatchesInThis": "В этом {space} совпадения не обнаружены",
-    "NoMatchesFound": "Не найдено соответсвий",
+    "NoMatchesFound": "Не найдено соответствий",
     "NotInThis": "Не в этом {space}",
     "Add": "Добавить",
     "Edit": "Редактировать",
     "SelectAvatar": "Выбрать аватар",
-    "GravatarsManaged": "Граватары управляются через"
+    "GravatarsManaged": "Граватары управляются через",
+    "CategoryCurrentUser": "Текущий пользователь",
+    "Assigned": "Назначен",
+    "CategoryPreviousAssigned": "Ранее назначенные",
+    "CategoryProjectLead": "Руководитель проекта",
+    "CategoryProjectMembers": "Участники проекта",
+    "CategoryOther": "Прочие"
   }
 }
diff --git a/packages/presentation/package.json b/packages/presentation/package.json
index 7324880e6f1..28ebabfcc5a 100644
--- a/packages/presentation/package.json
+++ b/packages/presentation/package.json
@@ -42,6 +42,7 @@
     "@hcengineering/login": "~0.6.1",
     "@hcengineering/image-cropper": "~0.6.0",
     "@hcengineering/client": "^0.6.6",
+    "@hcengineering/tracker": "^0.6.1",
     "@hcengineering/setting": "~0.6.1",
     "fast-equals": "^2.0.3"
   }
diff --git a/packages/presentation/src/components/AssigneeBox.svelte b/packages/presentation/src/components/AssigneeBox.svelte
new file mode 100644
index 00000000000..a40dc5ad4f5
--- /dev/null
+++ b/packages/presentation/src/components/AssigneeBox.svelte
@@ -0,0 +1,177 @@
+<!--
+// Copyright © 2022 Hardcore Engineering Inc.
+//
+// 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.
+-->
+<script lang="ts">
+  import contact, { Contact, Employee, formatName } from '@hcengineering/contact'
+  import { AttachedData, Class, DocumentQuery, FindOptions, Ref } from '@hcengineering/core'
+  import { getEmbeddedLabel, IntlString } from '@hcengineering/platform'
+  import { Issue, IssueTemplateData } from '@hcengineering/tracker'
+  import {
+    ActionIcon,
+    Button,
+    ButtonKind,
+    ButtonSize,
+    getEventPositionElement,
+    getFocusManager,
+    Icon,
+    IconOpen,
+    Label,
+    LabelAndProps,
+    showPanel,
+    showPopup,
+    tooltip
+  } from '@hcengineering/ui'
+  import view from '@hcengineering/view'
+  import { createEventDispatcher } from 'svelte'
+  import presentation, { getClient } from '..'
+  import IconPerson from './icons/Person.svelte'
+  import UserInfo from './UserInfo.svelte'
+  import AssigneePopup from './AssigneePopup.svelte'
+
+  export let _class: Ref<Class<Employee>> = contact.class.Employee
+  export let excluded: Ref<Contact>[] | undefined = undefined
+  export let options: FindOptions<Employee> | undefined = undefined
+  export let docQuery: DocumentQuery<Employee> | undefined = {
+    active: true
+  }
+  export let label: IntlString
+  export let placeholder: IntlString = presentation.string.Search
+  export let value: Ref<Employee> | null | undefined
+  export let titleDeselect: IntlString | undefined = undefined
+
+  export let assignedTo: Issue | AttachedData<Issue> | IssueTemplateData
+  export let readonly = false
+  export let kind: ButtonKind = 'no-border'
+  export let size: ButtonSize = 'small'
+  export let justify: 'left' | 'center' = 'center'
+  export let width: string | undefined = undefined
+  export let focusIndex = -1
+  export let showTooltip: LabelAndProps | undefined = undefined
+  export let showNavigate = true
+  export let id: string | undefined = undefined
+
+  const icon = IconPerson
+
+  const dispatch = createEventDispatcher()
+
+  let selected: Employee | undefined
+  let container: HTMLElement
+
+  const client = getClient()
+
+  async function updateSelected (value: Ref<Employee> | null | undefined) {
+    selected = value ? await client.findOne(_class, { _id: value }) : undefined
+  }
+
+  $: updateSelected(value)
+
+  function getName (obj: Contact): string {
+    const isPerson = client.getHierarchy().isDerived(obj._class, contact.class.Person)
+    return isPerson ? formatName(obj.name) : obj.name
+  }
+  const mgr = getFocusManager()
+
+  const _click = (ev: MouseEvent): void => {
+    if (!readonly) {
+      showPopup(
+        AssigneePopup,
+        {
+          _class,
+          options,
+          docQuery,
+          assignedTo,
+          ignoreUsers: excluded ?? [],
+          icon,
+          selected: value,
+          placeholder,
+          titleDeselect
+        },
+        !$$slots.content ? container : getEventPositionElement(ev),
+        (result) => {
+          if (result === null) {
+            value = null
+            selected = undefined
+            dispatch('change', null)
+          } else if (result !== undefined && result._id !== value) {
+            value = result._id
+            dispatch('change', value)
+          }
+          mgr?.setFocusPos(focusIndex)
+        }
+      )
+    }
+  }
+
+  $: hideIcon = size === 'x-large' || (size === 'large' && kind !== 'link')
+</script>
+
+<!-- svelte-ignore a11y-click-events-have-key-events -->
+<div {id} bind:this={container} class="min-w-0" class:w-full={width === '100%'} class:h-full={$$slots.content}>
+  {#if $$slots.content}
+    <div
+      class="w-full h-full flex-streatch"
+      on:click={_click}
+      use:tooltip={selected !== undefined ? { label: getEmbeddedLabel(getName(selected)) } : undefined}
+    >
+      <slot name="content" />
+    </div>
+  {:else}
+    <Button {focusIndex} width={width ?? 'min-content'} {size} {kind} {justify} {showTooltip} on:click={_click}>
+      <span
+        slot="content"
+        class="overflow-label flex-grow"
+        class:flex-between={showNavigate && selected}
+        class:dark-color={value == null}
+      >
+        <div
+          class="disabled"
+          style:width={showNavigate && selected
+            ? `calc(${width ?? 'min-content'} - 1.5rem)`
+            : `${width ?? 'min-content'}`}
+          use:tooltip={selected !== undefined ? { label: getEmbeddedLabel(getName(selected)) } : undefined}
+        >
+          {#if selected}
+            {#if hideIcon || selected}
+              <UserInfo value={selected} size={kind === 'link' ? 'x-small' : 'tiny'} {icon} />
+            {:else}
+              {getName(selected)}
+            {/if}
+          {:else}
+            <div class="flex-presenter">
+              {#if icon}
+                <div class="icon" class:small-gap={size === 'inline' || size === 'small'}>
+                  <Icon {icon} size={kind === 'link' ? 'small' : size} />
+                </div>
+              {/if}
+              <div class="label no-underline">
+                <Label {label} />
+              </div>
+            </div>
+          {/if}
+        </div>
+        {#if selected && showNavigate}
+          <ActionIcon
+            icon={IconOpen}
+            size={'small'}
+            action={() => {
+              if (selected) {
+                showPanel(view.component.EditDoc, selected._id, selected._class, 'content')
+              }
+            }}
+          />
+        {/if}
+      </span>
+    </Button>
+  {/if}
+</div>
diff --git a/packages/presentation/src/components/AssigneePopup.svelte b/packages/presentation/src/components/AssigneePopup.svelte
new file mode 100644
index 00000000000..979a36c403f
--- /dev/null
+++ b/packages/presentation/src/components/AssigneePopup.svelte
@@ -0,0 +1,320 @@
+<!--
+// Copyright © 2022 Hardcore Engineering Inc.
+// 
+// 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.
+-->
+<script lang="ts">
+  import contact, { Contact, EmployeeAccount, Person } from '@hcengineering/contact'
+  import core, {
+    AttachedData,
+    Doc,
+    DocumentQuery,
+    FindOptions,
+    getCurrentAccount,
+    Ref,
+    TxUpdateDoc
+  } from '@hcengineering/core'
+  import type { Asset, IntlString } from '@hcengineering/platform'
+  import tracker, { Issue, IssueTemplateData } from '@hcengineering/tracker'
+  import {
+    createFocusManager,
+    EditBox,
+    FocusHandler,
+    Icon,
+    IconCheck,
+    ListView,
+    resizeObserver,
+    AnySvelteComponent,
+    Label,
+    tooltip
+  } from '@hcengineering/ui'
+  import presentation from '..'
+  import { AssigneeCategory, assigneeCategoryOrder, createQuery, getCategorytitle, getClient } from '../utils'
+  import UserInfo from './UserInfo.svelte'
+  import { createEventDispatcher } from 'svelte'
+
+  export let options: FindOptions<Contact> | undefined = undefined
+  export let selected: Ref<Person> | undefined
+  export let docQuery: DocumentQuery<Contact> | undefined = undefined
+  export let assignedTo: Issue | AttachedData<Issue> | IssueTemplateData
+  export let titleDeselect: IntlString | undefined
+  export let placeholder: IntlString = presentation.string.Search
+  export let ignoreUsers: Ref<Person>[] = []
+  export let shadows: boolean = true
+  export let width: 'medium' | 'large' | 'full' = 'medium'
+  export let size: 'small' | 'medium' | 'large' = 'small'
+  export let searchField: string = 'name'
+  export let showCategories: boolean = true
+  export let icon: Asset | AnySvelteComponent | undefined = undefined
+
+  const client = getClient()
+  const hierarchy = client.getHierarchy()
+  const currentEmployee = (getCurrentAccount() as EmployeeAccount).employee
+
+  let search: string = ''
+  let objects: Contact[] = []
+  let contacts: Contact[] = []
+
+  let categorizedPersons: Map<Ref<Person>, AssigneeCategory>
+
+  let prevAssigned: Ref<Person>[] = []
+  let projectLead: Ref<Person> | undefined = undefined
+  let projectMembers: Ref<Person>[] = []
+
+  const dispatch = createEventDispatcher()
+  const query = createQuery()
+  const txQuery = createQuery()
+
+  $: query.query<Contact>(
+    contact.class.Employee,
+    {
+      ...(docQuery ?? {}),
+      [searchField]: { $like: '%' + search + '%' },
+      _id: { $nin: ignoreUsers }
+    },
+    (result) => {
+      objects = result
+    },
+    { ...(options ?? {}), limit: 200, sort: { name: 1 } }
+  )
+
+  $: updateCategories(objects, currentEmployee, prevAssigned, projectLead, projectMembers)
+
+  function updateCategories (
+    objects: Contact[],
+    currentEmployee: Ref<Person>,
+    prevAssigned: Ref<Person>[],
+    projectLead: Ref<Person> | undefined,
+    projectMembers: Ref<Person>[]
+  ) {
+    const persons = new Map<Ref<Person>, AssigneeCategory>(objects.map((t) => [t._id, 'Other']))
+    if (projectLead) {
+      persons.set(projectLead, 'ProjectLead')
+    }
+    projectMembers.forEach((p) => persons.set(p, 'ProjectMembers'))
+    prevAssigned.forEach((p) => persons.set(p, 'PreviouslyAssigned'))
+    if (assignedTo.assignee) {
+      persons.set(assignedTo.assignee, 'Assigned')
+    }
+    persons.set(currentEmployee, 'CurrentUser')
+
+    categorizedPersons = new Map<Ref<Person>, AssigneeCategory>(
+      [...persons].sort((a, b) => assigneeCategoryOrder.indexOf(a[1]) - assigneeCategoryOrder.indexOf(b[1]))
+    )
+    contacts = []
+    categorizedPersons.forEach((p, k) => {
+      const c = objects.find((e) => e._id === k)
+      if (c) {
+        contacts.push(c)
+      }
+    })
+  }
+
+  async function updatePrevAssigned (issue: Issue | AttachedData<Issue> | IssueTemplateData) {
+    if ((issue as Issue) === undefined) {
+      prevAssigned = []
+      return
+    }
+    txQuery.query(
+      core.class.Tx,
+      {
+        'tx.objectId': (issue as Issue)._id,
+        'tx.operations.assignee': { $exists: true }
+      },
+      (res) => {
+        prevAssigned = res.map((t) => (t as TxUpdateDoc<Doc>).tx.operations.assignee)
+      },
+      { sort: { name: 1 } }
+    )
+    if (issue.project) {
+      const project = await client.findOne(tracker.class.Project, { _id: issue.project })
+      projectLead = project?.lead || undefined
+      projectMembers = project?.members || []
+    } else {
+      projectLead = undefined
+      projectMembers = []
+    }
+  }
+
+  $: updatePrevAssigned(assignedTo)
+
+  let selection = 0
+  let list: ListView
+
+  async function handleSelection (evt: Event | undefined, selection: number): Promise<void> {
+    const person = contacts[selection]
+    selected = person._id === selected ? undefined : person._id
+    dispatch('close', selected !== undefined ? person : undefined)
+  }
+
+  function onKeydown (key: KeyboardEvent): void {
+    if (key.code === 'ArrowUp') {
+      key.stopPropagation()
+      key.preventDefault()
+      list.select(selection - 1)
+    }
+    if (key.code === 'ArrowDown') {
+      key.stopPropagation()
+      key.preventDefault()
+      list.select(selection + 1)
+    }
+    if (key.code === 'Enter') {
+      key.preventDefault()
+      key.stopPropagation()
+      handleSelection(key, selection)
+    }
+    if (key.code === 'Escape') {
+      key.preventDefault()
+      key.stopPropagation()
+      dispatch('close')
+    }
+  }
+  const manager = createFocusManager()
+
+  function toAny (obj: any): any {
+    return obj
+  }
+
+  let selectedDiv: HTMLElement | undefined
+  let scrollDiv: HTMLElement | undefined
+  let cHeight = 0
+
+  const updateLocation = (scrollDiv?: HTMLElement, selectedDiv?: HTMLElement, objects?: Doc[], selected?: Ref<Doc>) => {
+    const objIt = objects?.find((it) => it._id === selected)
+    if (objIt === undefined) {
+      cHeight = 0
+      return
+    }
+    if (scrollDiv && selectedDiv) {
+      const r = selectedDiv.getBoundingClientRect()
+      const r2 = scrollDiv.getBoundingClientRect()
+
+      if (r && r2) {
+        if (r.top > r2.top && r.bottom < r2.bottom) {
+          cHeight = 0
+        } else {
+          if (r.bottom < r2.bottom) {
+            cHeight = 1
+          } else {
+            cHeight = -1
+          }
+        }
+      }
+    }
+  }
+
+  $: updateLocation(scrollDiv, selectedDiv, contacts, selected)
+</script>
+
+<FocusHandler {manager} />
+
+<div
+  class="selectPopup"
+  class:full-width={width === 'full'}
+  class:plainContainer={!shadows}
+  class:width-40={width === 'large'}
+  on:keydown={onKeydown}
+  use:resizeObserver={() => {
+    dispatch('changeContent')
+  }}
+>
+  <div class="header flex-between">
+    <EditBox kind={'search-style'} focusIndex={1} focus bind:value={search} {placeholder} />
+  </div>
+  {#if cHeight === 1}
+    <div class="background-theme-content-accent" style:height={'1px'} />
+  {/if}
+  <div
+    class="scroll"
+    on:scroll={() => updateLocation(scrollDiv, selectedDiv, contacts, selected)}
+    bind:this={scrollDiv}
+  >
+    <div class="box">
+      <ListView bind:this={list} count={contacts.length} bind:selection>
+        <svelte:fragment slot="category" let:item>
+          {#if showCategories}
+            {@const obj = toAny(contacts[item])}
+            {@const category = categorizedPersons.get(obj._id)}
+            {@const cl = hierarchy.getClass(contacts[item]._class)}
+            {#if item === 0 || (item > 0 && categorizedPersons.get(toAny(contacts[item - 1])._id) !== categorizedPersons.get(obj._id))}
+              <!--Category for first item-->
+              <div class="category-box">
+                <div class="flex flex-grow overflow-label">
+                  <span class="fs-medium flex-center gap-2 mt-2 mb-2 ml-2">
+                    {#if cl.icon}
+                      <Icon icon={cl.icon} size={'small'} />
+                    {/if}
+                    <Label label={getCategorytitle(category)} />
+                  </span>
+                </div>
+              </div>
+            {/if}
+          {/if}
+        </svelte:fragment>
+        <svelte:fragment slot="item" let:item>
+          {@const obj = contacts[item]}
+          <button
+            class="menu-item w-full"
+            class:background-bg-focused={obj._id === selected}
+            class:border-radius-1={obj._id === selected}
+            on:click={() => {
+              handleSelection(undefined, item)
+            }}
+          >
+            {#if selected}
+              <div class="icon">
+                {#if obj._id === selected}
+                  <div bind:this={selectedDiv}>
+                    {#if titleDeselect}
+                      <div class="clear-mins" use:tooltip={{ label: titleDeselect }}>
+                        <Icon icon={IconCheck} {size} />
+                      </div>
+                    {:else}
+                      <Icon icon={IconCheck} {size} />
+                    {/if}
+                  </div>
+                {/if}
+              </div>
+            {/if}
+
+            <span class="label">
+              {#if obj._id === selected}
+                <div bind:this={selectedDiv}>
+                  <div class="flex flex-grow overflow-label">
+                    <UserInfo size={'x-small'} value={obj} {icon} />
+                  </div>
+                </div>
+              {:else}
+                <div class="flex flex-grow overflow-label">
+                  <UserInfo size={'x-small'} value={obj} {icon} />
+                </div>
+              {/if}
+            </span>
+          </button>
+        </svelte:fragment>
+      </ListView>
+    </div>
+  </div>
+  {#if cHeight === -1}
+    <div class="background-theme-content-accent" style:height={'3px'} />
+  {/if}
+</div>
+
+<style lang="scss">
+  .plainContainer {
+    color: var(--caption-color);
+    background-color: var(--body-color);
+    border: 1px solid var(--button-border-color);
+    border-radius: 0.25rem;
+    box-shadow: none;
+  }
+</style>
diff --git a/packages/presentation/src/index.ts b/packages/presentation/src/index.ts
index 5145137ad48..6c2aaf6fbdf 100644
--- a/packages/presentation/src/index.ts
+++ b/packages/presentation/src/index.ts
@@ -17,6 +17,7 @@
 import { addStringsLoader } from '@hcengineering/platform'
 import { presentationId } from './plugin'
 export * from './attributes'
+export { default as AssigneeBox } from './components/AssigneeBox.svelte'
 export { default as AttributeBarEditor } from './components/AttributeBarEditor.svelte'
 export { default as AttributeEditor } from './components/AttributeEditor.svelte'
 export { default as AttributesBar } from './components/AttributesBar.svelte'
diff --git a/packages/presentation/src/plugin.ts b/packages/presentation/src/plugin.ts
index e802faf584e..5c4c78cad1b 100644
--- a/packages/presentation/src/plugin.ts
+++ b/packages/presentation/src/plugin.ts
@@ -56,7 +56,13 @@ export default plugin(presentationId, {
     Add: '' as IntlString,
     Edit: '' as IntlString,
     SelectAvatar: '' as IntlString,
-    GravatarsManaged: '' as IntlString
+    GravatarsManaged: '' as IntlString,
+    CategoryCurrentUser: '' as IntlString,
+    Assigned: '' as IntlString,
+    CategoryPreviousAssigned: '' as IntlString,
+    CategoryProjectLead: '' as IntlString,
+    CategoryProjectMembers: '' as IntlString,
+    CategoryOther: '' as IntlString
   },
   metadata: {
     RequiredVersion: '' as Metadata<string>,
diff --git a/packages/presentation/src/utils.ts b/packages/presentation/src/utils.ts
index 05a6874051d..fdef280d810 100644
--- a/packages/presentation/src/utils.ts
+++ b/packages/presentation/src/utils.ts
@@ -34,12 +34,13 @@ import core, {
   TxResult
 } from '@hcengineering/core'
 import login from '@hcengineering/login'
-import { getMetadata } from '@hcengineering/platform'
+import { getMetadata, IntlString } from '@hcengineering/platform'
 import { LiveQuery as LQ } from '@hcengineering/query'
 import { onDestroy } from 'svelte'
 import { deepEqual } from 'fast-equals'
 import { IconSize, DropdownIntlItem } from '@hcengineering/ui'
 import contact, { AvatarType, AvatarProvider } from '@hcengineering/contact'
+import presentation from '..'
 
 let liveQuery: LQ
 let client: TxOperations
@@ -272,3 +273,43 @@ export function getAvatarProviderId (avatar?: string | null): Ref<AvatarProvider
       return contact.avatarProvider.Color
   }
 }
+
+/**
+ * @public
+ */
+export type AssigneeCategory =
+  | 'CurrentUser'
+  | 'Assigned'
+  | 'PreviouslyAssigned'
+  | 'ProjectLead'
+  | 'ProjectMembers'
+  | 'Other'
+
+const assigneeCategoryTitleMap: Record<AssigneeCategory, IntlString> = Object.freeze({
+  CurrentUser: presentation.string.CategoryCurrentUser,
+  Assigned: presentation.string.Assigned,
+  PreviouslyAssigned: presentation.string.CategoryPreviousAssigned,
+  ProjectLead: presentation.string.CategoryProjectLead,
+  ProjectMembers: presentation.string.CategoryProjectMembers,
+  Other: presentation.string.CategoryOther
+})
+
+/**
+ * @public
+ */
+export const assigneeCategoryOrder: AssigneeCategory[] = [
+  'CurrentUser',
+  'Assigned',
+  'PreviouslyAssigned',
+  'ProjectLead',
+  'ProjectMembers',
+  'Other'
+]
+
+/**
+ * @public
+ */
+export function getCategorytitle (category: AssigneeCategory | undefined): IntlString {
+  const cat: AssigneeCategory = category ?? 'Other'
+  return assigneeCategoryTitleMap[cat]
+}
diff --git a/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte b/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte
index d0006397790..6795469cdce 100644
--- a/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte
+++ b/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte
@@ -15,7 +15,7 @@
 <script lang="ts">
   import { Employee } from '@hcengineering/contact'
   import { AttachedData, Ref } from '@hcengineering/core'
-  import { EmployeeBox, getClient } from '@hcengineering/presentation'
+  import { AssigneeBox, getClient } from '@hcengineering/presentation'
   import { Issue, IssueTemplateData } from '@hcengineering/tracker'
   import { ButtonKind, ButtonSize, TooltipAlignment } from '@hcengineering/ui'
   import { createEventDispatcher } from 'svelte'
@@ -44,11 +44,11 @@
 </script>
 
 {#if value}
-  <EmployeeBox
+  <AssigneeBox
     label={tracker.string.Assignee}
     placeholder={tracker.string.Assignee}
     value={value.assignee}
-    allowDeselect
+    assignedTo={value}
     titleDeselect={tracker.string.Unassigned}
     {size}
     {kind}
diff --git a/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte b/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte
index 1c278f16fe4..ff2e75fe6f1 100644
--- a/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte
+++ b/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte
@@ -15,7 +15,7 @@
 <script lang="ts">
   import contact from '@hcengineering/contact'
   import { Doc, Ref } from '@hcengineering/core'
-  import { UserBox } from '@hcengineering/presentation'
+  import { AssigneeBox } from '@hcengineering/presentation'
   import { Issue, Team } from '@hcengineering/tracker'
   import { getEventPositionElement, ListView, showPopup } from '@hcengineering/ui'
   import { ContextMenu, FixedColumn, ListSelectionProvider, SelectDirection } from '@hcengineering/view-resources'
@@ -77,10 +77,11 @@
         </span>
       </div>
       <div class="flex-center flex-no-shrink gap-2">
-        <UserBox
+        <AssigneeBox
           label={tracker.string.Assignee}
           _class={contact.class.Employee}
           value={issue.assignee}
+          assignedTo={issue}
           readonly
           showNavigate={false}
         />

From 40a8022fbcf4d6f952a0eb46519fc60e102b610f Mon Sep 17 00:00:00 2001
From: Denis Maslennikov <denis.maslennikov@gmail.com>
Date: Mon, 16 Jan 2023 11:49:39 +0700
Subject: [PATCH 2/6] Fix dependencies

Signed-off-by: Denis Maslennikov <denis.maslennikov@gmail.com>
---
 packages/presentation/package.json | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/packages/presentation/package.json b/packages/presentation/package.json
index 31afa515f3f..67ff4bfc11e 100644
--- a/packages/presentation/package.json
+++ b/packages/presentation/package.json
@@ -16,7 +16,7 @@
     "svelte-loader": "^3.1.3",
     "sass": "^1.53.0",
     "svelte-preprocess": "^4.10.7",
-    "@hcengineering/platform-rig": "~0.6.0",
+    "@hcengineering/platform-rig": "^0.6.0",
     "@typescript-eslint/eslint-plugin": "^5.41.0",
     "@typescript-eslint/parser": "^5.41.0",
     "eslint-config-standard-with-typescript": "^23.0.0",
@@ -31,16 +31,16 @@
     "typescript": "^4.3.5"
   },
   "dependencies": {
-    "@hcengineering/attachment": "~0.6.1",
+    "@hcengineering/attachment": "^0.6.1",
     "@hcengineering/platform": "^0.6.8",
-    "@hcengineering/core": "^0.6.19",
-    "@hcengineering/query": "~0.6.1",
-    "@hcengineering/ui": "^0.6.2",
-    "@hcengineering/view": "^0.6.1",
+    "@hcengineering/core": "^0.6.20",
+    "@hcengineering/query": "^0.6.1",
+    "@hcengineering/ui": "^0.6.3",
+    "@hcengineering/view": "^0.6.2",
     "svelte": "^3.47",
-    "@hcengineering/contact": "~0.6.8",
-    "@hcengineering/login": "~0.6.1",
-    "@hcengineering/image-cropper": "~0.6.0",
+    "@hcengineering/contact": "^0.6.9",
+    "@hcengineering/login": "^0.6.1",
+    "@hcengineering/image-cropper": "^0.6.0",
     "@hcengineering/client": "^0.6.6",
     "@hcengineering/tracker": "^0.6.1",
     "@hcengineering/setting": "^0.6.2",

From c4ccaa26f8b2950e7064762b8f4dc9df4f5b1bd4 Mon Sep 17 00:00:00 2001
From: Denis Maslennikov <denis.maslennikov@gmail.com>
Date: Mon, 16 Jan 2023 19:13:20 +0700
Subject: [PATCH 3/6] Fix svelte-check

Signed-off-by: Denis Maslennikov <denis.maslennikov@gmail.com>
---
 .../presentation/src/components/AssigneePopup.svelte   | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/packages/presentation/src/components/AssigneePopup.svelte b/packages/presentation/src/components/AssigneePopup.svelte
index 979a36c403f..6aee719fd0e 100644
--- a/packages/presentation/src/components/AssigneePopup.svelte
+++ b/packages/presentation/src/components/AssigneePopup.svelte
@@ -21,6 +21,7 @@
     FindOptions,
     getCurrentAccount,
     Ref,
+    TxCollectionCUD,
     TxUpdateDoc
   } from '@hcengineering/core'
   import type { Asset, IntlString } from '@hcengineering/platform'
@@ -131,10 +132,13 @@
         'tx.operations.assignee': { $exists: true }
       },
       (res) => {
-        prevAssigned = res.map((t) => (t as TxUpdateDoc<Doc>).tx.operations.assignee)
-      },
-      { sort: { name: 1 } }
+        prevAssigned = res
+          .map((t) => ((t as TxCollectionCUD<Doc, Issue>).tx as TxUpdateDoc<Issue>).operations.assignee)
+          .filter((p) => !!p)
+          .filter((p) => !!p) as Ref<Person>[]
+      }
     )
+
     if (issue.project) {
       const project = await client.findOne(tracker.class.Project, { _id: issue.project })
       projectLead = project?.lead || undefined

From b4c35ed0718b790b85ffb76361bb5bf24ee18e01 Mon Sep 17 00:00:00 2001
From: Denis Maslennikov <denis.maslennikov@gmail.com>
Date: Tue, 17 Jan 2023 23:44:29 +0700
Subject: [PATCH 4/6] Move component to tracker-resource

Signed-off-by: Denis Maslennikov <denis.maslennikov@gmail.com>
---
 packages/presentation/package.json                    |  1 -
 packages/presentation/src/index.ts                    |  2 +-
 .../src/components/issues}/AssigneeBox.svelte         |  4 +---
 .../src/components/issues/AssigneeEditor.svelte       |  3 ++-
 .../src/components/issues}/AssigneePopup.svelte       | 11 ++++++++---
 5 files changed, 12 insertions(+), 9 deletions(-)
 rename {packages/presentation/src/components => plugins/tracker-resources/src/components/issues}/AssigneeBox.svelte (97%)
 rename {packages/presentation/src/components => plugins/tracker-resources/src/components/issues}/AssigneePopup.svelte (98%)

diff --git a/packages/presentation/package.json b/packages/presentation/package.json
index 67ff4bfc11e..8432b9986bf 100644
--- a/packages/presentation/package.json
+++ b/packages/presentation/package.json
@@ -42,7 +42,6 @@
     "@hcengineering/login": "^0.6.1",
     "@hcengineering/image-cropper": "^0.6.0",
     "@hcengineering/client": "^0.6.6",
-    "@hcengineering/tracker": "^0.6.1",
     "@hcengineering/setting": "^0.6.2",
     "fast-equals": "^2.0.3"
   }
diff --git a/packages/presentation/src/index.ts b/packages/presentation/src/index.ts
index 56cca404ef7..1d9f7f24b6d 100644
--- a/packages/presentation/src/index.ts
+++ b/packages/presentation/src/index.ts
@@ -17,7 +17,6 @@
 import { addStringsLoader } from '@hcengineering/platform'
 import { presentationId } from './plugin'
 export * from './attributes'
-export { default as AssigneeBox } from './components/AssigneeBox.svelte'
 export { default as AttributeBarEditor } from './components/AttributeBarEditor.svelte'
 export { default as AttributeEditor } from './components/AttributeEditor.svelte'
 export { default as AttributesBar } from './components/AttributesBar.svelte'
@@ -42,6 +41,7 @@ export { default as EmployeeBox } from './components/EmployeeBox.svelte'
 export { default as UsersPopup } from './components/UsersPopup.svelte'
 export { default as MembersBox } from './components/MembersBox.svelte'
 export { default as IconMembers } from './components/icons/Members.svelte'
+export { default as IconPerson } from './components/icons/Person.svelte'
 export { default as IconMembersOutline } from './components/icons/MembersOutline.svelte'
 export { default as ObjectSearchPopup } from './components/ObjectSearchPopup.svelte'
 export { default as IndexedDocumentPreview } from './components/IndexedDocumentPreview.svelte'
diff --git a/packages/presentation/src/components/AssigneeBox.svelte b/plugins/tracker-resources/src/components/issues/AssigneeBox.svelte
similarity index 97%
rename from packages/presentation/src/components/AssigneeBox.svelte
rename to plugins/tracker-resources/src/components/issues/AssigneeBox.svelte
index a40dc5ad4f5..40a2dfb450d 100644
--- a/packages/presentation/src/components/AssigneeBox.svelte
+++ b/plugins/tracker-resources/src/components/issues/AssigneeBox.svelte
@@ -34,9 +34,7 @@
   } from '@hcengineering/ui'
   import view from '@hcengineering/view'
   import { createEventDispatcher } from 'svelte'
-  import presentation, { getClient } from '..'
-  import IconPerson from './icons/Person.svelte'
-  import UserInfo from './UserInfo.svelte'
+  import presentation, { IconPerson, UserInfo, getClient } from '@hcengineering/presentation'
   import AssigneePopup from './AssigneePopup.svelte'
 
   export let _class: Ref<Class<Employee>> = contact.class.Employee
diff --git a/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte b/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte
index 6795469cdce..6cd22ed03d8 100644
--- a/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte
+++ b/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte
@@ -15,11 +15,12 @@
 <script lang="ts">
   import { Employee } from '@hcengineering/contact'
   import { AttachedData, Ref } from '@hcengineering/core'
-  import { AssigneeBox, getClient } from '@hcengineering/presentation'
+  import { getClient } from '@hcengineering/presentation'
   import { Issue, IssueTemplateData } from '@hcengineering/tracker'
   import { ButtonKind, ButtonSize, TooltipAlignment } from '@hcengineering/ui'
   import { createEventDispatcher } from 'svelte'
   import tracker from '../../plugin'
+  import AssigneeBox from './AssigneeBox.svelte'
 
   export let value: Issue | AttachedData<Issue> | IssueTemplateData
   export let size: ButtonSize = 'large'
diff --git a/packages/presentation/src/components/AssigneePopup.svelte b/plugins/tracker-resources/src/components/issues/AssigneePopup.svelte
similarity index 98%
rename from packages/presentation/src/components/AssigneePopup.svelte
rename to plugins/tracker-resources/src/components/issues/AssigneePopup.svelte
index 6aee719fd0e..d41a532c59d 100644
--- a/packages/presentation/src/components/AssigneePopup.svelte
+++ b/plugins/tracker-resources/src/components/issues/AssigneePopup.svelte
@@ -38,9 +38,14 @@
     Label,
     tooltip
   } from '@hcengineering/ui'
-  import presentation from '..'
-  import { AssigneeCategory, assigneeCategoryOrder, createQuery, getCategorytitle, getClient } from '../utils'
-  import UserInfo from './UserInfo.svelte'
+  import presentation, {
+    AssigneeCategory,
+    UserInfo,
+    assigneeCategoryOrder,
+    createQuery,
+    getCategorytitle,
+    getClient
+  } from '@hcengineering/presentation'
   import { createEventDispatcher } from 'svelte'
 
   export let options: FindOptions<Contact> | undefined = undefined

From cf882b3fdb214967baf1eeaa913548bfec670fbc Mon Sep 17 00:00:00 2001
From: Denis Maslennikov <denis.maslennikov@gmail.com>
Date: Wed, 18 Jan 2023 00:09:18 +0700
Subject: [PATCH 5/6] Fix usage

Signed-off-by: Denis Maslennikov <denis.maslennikov@gmail.com>
---
 .../components/issues/timereport/EstimationSubIssueList.svelte | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte b/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte
index 1a92a2bde06..8b7613c7f95 100644
--- a/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte
+++ b/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte
@@ -15,13 +15,13 @@
 <script lang="ts">
   import contact from '@hcengineering/contact'
   import { Doc, Ref } from '@hcengineering/core'
-  import { AssigneeBox } from '@hcengineering/presentation'
   import { Issue, Team } from '@hcengineering/tracker'
   import { getEventPositionElement, ListView, showPopup, deviceOptionsStore as deviceInfo } from '@hcengineering/ui'
   import { ContextMenu, FixedColumn, ListSelectionProvider, SelectDirection } from '@hcengineering/view-resources'
   import { getIssueId } from '../../../issues'
   import tracker from '../../../plugin'
   import EstimationEditor from './EstimationEditor.svelte'
+  import AssigneeBox from '../AssigneeBox.svelte'
 
   export let issues: Issue[]
 
@@ -66,6 +66,7 @@
           label={tracker.string.Assignee}
           _class={contact.class.Employee}
           value={issue.assignee}
+          assignedTo={issue}
           readonly
           showNavigate={false}
         />

From 8b92ca2dc23fafc9104726e7c72eab3a894399be Mon Sep 17 00:00:00 2001
From: Denis Maslennikov <denis.maslennikov@gmail.com>
Date: Wed, 18 Jan 2023 13:16:18 +0700
Subject: [PATCH 6/6] Refactor component

Signed-off-by: Denis Maslennikov <denis.maslennikov@gmail.com>
---
 .../src/components}/AssigneeBox.svelte        | 14 ++--
 .../src/components}/AssigneePopup.svelte      | 68 ++++---------------
 packages/presentation/src/index.ts            |  1 +
 .../components/issues/AssigneeEditor.svelte   | 29 +++++++-
 .../timereport/EstimationSubIssueList.svelte  |  3 +-
 plugins/tracker-resources/src/utils.ts        | 36 +++++++++-
 6 files changed, 83 insertions(+), 68 deletions(-)
 rename {plugins/tracker-resources/src/components/issues => packages/presentation/src/components}/AssigneeBox.svelte (94%)
 rename {plugins/tracker-resources/src/components/issues => packages/presentation/src/components}/AssigneePopup.svelte (82%)

diff --git a/plugins/tracker-resources/src/components/issues/AssigneeBox.svelte b/packages/presentation/src/components/AssigneeBox.svelte
similarity index 94%
rename from plugins/tracker-resources/src/components/issues/AssigneeBox.svelte
rename to packages/presentation/src/components/AssigneeBox.svelte
index 40a2dfb450d..d4462e97b8a 100644
--- a/plugins/tracker-resources/src/components/issues/AssigneeBox.svelte
+++ b/packages/presentation/src/components/AssigneeBox.svelte
@@ -14,9 +14,8 @@
 -->
 <script lang="ts">
   import contact, { Contact, Employee, formatName } from '@hcengineering/contact'
-  import { AttachedData, Class, DocumentQuery, FindOptions, Ref } from '@hcengineering/core'
+  import { Class, DocumentQuery, FindOptions, Ref } from '@hcengineering/core'
   import { getEmbeddedLabel, IntlString } from '@hcengineering/platform'
-  import { Issue, IssueTemplateData } from '@hcengineering/tracker'
   import {
     ActionIcon,
     Button,
@@ -34,7 +33,7 @@
   } from '@hcengineering/ui'
   import view from '@hcengineering/view'
   import { createEventDispatcher } from 'svelte'
-  import presentation, { IconPerson, UserInfo, getClient } from '@hcengineering/presentation'
+  import presentation, { IconPerson, UserInfo, getClient } from '..'
   import AssigneePopup from './AssigneePopup.svelte'
 
   export let _class: Ref<Class<Employee>> = contact.class.Employee
@@ -46,9 +45,10 @@
   export let label: IntlString
   export let placeholder: IntlString = presentation.string.Search
   export let value: Ref<Employee> | null | undefined
+  export let prevAssigned: Ref<Employee>[] | undefined = []
+  export let projectLead: Ref<Employee> | undefined = undefined
+  export let projectMembers: Ref<Employee>[] | undefined = []
   export let titleDeselect: IntlString | undefined = undefined
-
-  export let assignedTo: Issue | AttachedData<Issue> | IssueTemplateData
   export let readonly = false
   export let kind: ButtonKind = 'no-border'
   export let size: ButtonSize = 'small'
@@ -88,7 +88,9 @@
           _class,
           options,
           docQuery,
-          assignedTo,
+          prevAssigned,
+          projectLead,
+          projectMembers,
           ignoreUsers: excluded ?? [],
           icon,
           selected: value,
diff --git a/plugins/tracker-resources/src/components/issues/AssigneePopup.svelte b/packages/presentation/src/components/AssigneePopup.svelte
similarity index 82%
rename from plugins/tracker-resources/src/components/issues/AssigneePopup.svelte
rename to packages/presentation/src/components/AssigneePopup.svelte
index d41a532c59d..12954fd4219 100644
--- a/plugins/tracker-resources/src/components/issues/AssigneePopup.svelte
+++ b/packages/presentation/src/components/AssigneePopup.svelte
@@ -13,19 +13,9 @@
 // limitations under the License.
 -->
 <script lang="ts">
-  import contact, { Contact, EmployeeAccount, Person } from '@hcengineering/contact'
-  import core, {
-    AttachedData,
-    Doc,
-    DocumentQuery,
-    FindOptions,
-    getCurrentAccount,
-    Ref,
-    TxCollectionCUD,
-    TxUpdateDoc
-  } from '@hcengineering/core'
+  import contact, { Contact, Employee, EmployeeAccount, Person } from '@hcengineering/contact'
+  import { Doc, DocumentQuery, FindOptions, getCurrentAccount, Ref } from '@hcengineering/core'
   import type { Asset, IntlString } from '@hcengineering/platform'
-  import tracker, { Issue, IssueTemplateData } from '@hcengineering/tracker'
   import {
     createFocusManager,
     EditBox,
@@ -45,13 +35,15 @@
     createQuery,
     getCategorytitle,
     getClient
-  } from '@hcengineering/presentation'
+  } from '..'
   import { createEventDispatcher } from 'svelte'
 
   export let options: FindOptions<Contact> | undefined = undefined
   export let selected: Ref<Person> | undefined
   export let docQuery: DocumentQuery<Contact> | undefined = undefined
-  export let assignedTo: Issue | AttachedData<Issue> | IssueTemplateData
+  export let prevAssigned: Ref<Employee>[] | undefined = []
+  export let projectLead: Ref<Employee> | undefined = undefined
+  export let projectMembers: Ref<Employee>[] | undefined = []
   export let titleDeselect: IntlString | undefined
   export let placeholder: IntlString = presentation.string.Search
   export let ignoreUsers: Ref<Person>[] = []
@@ -72,13 +64,8 @@
 
   let categorizedPersons: Map<Ref<Person>, AssigneeCategory>
 
-  let prevAssigned: Ref<Person>[] = []
-  let projectLead: Ref<Person> | undefined = undefined
-  let projectMembers: Ref<Person>[] = []
-
   const dispatch = createEventDispatcher()
   const query = createQuery()
-  const txQuery = createQuery()
 
   $: query.query<Contact>(
     contact.class.Employee,
@@ -98,18 +85,18 @@
   function updateCategories (
     objects: Contact[],
     currentEmployee: Ref<Person>,
-    prevAssigned: Ref<Person>[],
+    prevAssigned: Ref<Person>[] | undefined,
     projectLead: Ref<Person> | undefined,
-    projectMembers: Ref<Person>[]
+    projectMembers: Ref<Person>[] | undefined
   ) {
     const persons = new Map<Ref<Person>, AssigneeCategory>(objects.map((t) => [t._id, 'Other']))
     if (projectLead) {
       persons.set(projectLead, 'ProjectLead')
     }
-    projectMembers.forEach((p) => persons.set(p, 'ProjectMembers'))
-    prevAssigned.forEach((p) => persons.set(p, 'PreviouslyAssigned'))
-    if (assignedTo.assignee) {
-      persons.set(assignedTo.assignee, 'Assigned')
+    projectMembers?.forEach((p) => persons.set(p, 'ProjectMembers'))
+    prevAssigned?.forEach((p) => persons.set(p, 'PreviouslyAssigned'))
+    if (selected) {
+      persons.set(selected, 'Assigned')
     }
     persons.set(currentEmployee, 'CurrentUser')
 
@@ -125,37 +112,6 @@
     })
   }
 
-  async function updatePrevAssigned (issue: Issue | AttachedData<Issue> | IssueTemplateData) {
-    if ((issue as Issue) === undefined) {
-      prevAssigned = []
-      return
-    }
-    txQuery.query(
-      core.class.Tx,
-      {
-        'tx.objectId': (issue as Issue)._id,
-        'tx.operations.assignee': { $exists: true }
-      },
-      (res) => {
-        prevAssigned = res
-          .map((t) => ((t as TxCollectionCUD<Doc, Issue>).tx as TxUpdateDoc<Issue>).operations.assignee)
-          .filter((p) => !!p)
-          .filter((p) => !!p) as Ref<Person>[]
-      }
-    )
-
-    if (issue.project) {
-      const project = await client.findOne(tracker.class.Project, { _id: issue.project })
-      projectLead = project?.lead || undefined
-      projectMembers = project?.members || []
-    } else {
-      projectLead = undefined
-      projectMembers = []
-    }
-  }
-
-  $: updatePrevAssigned(assignedTo)
-
   let selection = 0
   let list: ListView
 
diff --git a/packages/presentation/src/index.ts b/packages/presentation/src/index.ts
index 1d9f7f24b6d..20b8116fab4 100644
--- a/packages/presentation/src/index.ts
+++ b/packages/presentation/src/index.ts
@@ -21,6 +21,7 @@ export { default as AttributeBarEditor } from './components/AttributeBarEditor.s
 export { default as AttributeEditor } from './components/AttributeEditor.svelte'
 export { default as AttributesBar } from './components/AttributesBar.svelte'
 export { default as Avatar } from './components/Avatar.svelte'
+export { default as AssigneeBox } from './components/AssigneeBox.svelte'
 export { default as Card } from './components/Card.svelte'
 export { default as CombineAvatars } from './components/CombineAvatars.svelte'
 export { default as EditableAvatar } from './components/EditableAvatar.svelte'
diff --git a/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte b/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte
index 6cd22ed03d8..6b8bbe71f51 100644
--- a/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte
+++ b/plugins/tracker-resources/src/components/issues/AssigneeEditor.svelte
@@ -15,12 +15,12 @@
 <script lang="ts">
   import { Employee } from '@hcengineering/contact'
   import { AttachedData, Ref } from '@hcengineering/core'
-  import { getClient } from '@hcengineering/presentation'
+  import { AssigneeBox, getClient } from '@hcengineering/presentation'
   import { Issue, IssueTemplateData } from '@hcengineering/tracker'
   import { ButtonKind, ButtonSize, TooltipAlignment } from '@hcengineering/ui'
   import { createEventDispatcher } from 'svelte'
   import tracker from '../../plugin'
-  import AssigneeBox from './AssigneeBox.svelte'
+  import { getPreviousAssignees } from '../../utils'
 
   export let value: Issue | AttachedData<Issue> | IssueTemplateData
   export let size: ButtonSize = 'large'
@@ -31,6 +31,27 @@
   const client = getClient()
   const dispatch = createEventDispatcher()
 
+  let prevAssigned: Ref<Employee>[] = []
+  let projectLead: Ref<Employee> | undefined = undefined
+  let projectMembers: Ref<Employee>[] = []
+
+  $: getPreviousAssignees(value).then((res) => {
+    prevAssigned = res
+  })
+
+  async function updateProjectMembers (issue: Issue | AttachedData<Issue> | IssueTemplateData) {
+    if (issue.project) {
+      const project = await client.findOne(tracker.class.Project, { _id: issue.project })
+      projectLead = project?.lead || undefined
+      projectMembers = project?.members || []
+    } else {
+      projectLead = undefined
+      projectMembers = []
+    }
+  }
+
+  $: updateProjectMembers(value)
+
   const handleAssigneeChanged = async (newAssignee: Ref<Employee> | undefined) => {
     if (newAssignee === undefined || value.assignee === newAssignee) {
       return
@@ -49,7 +70,9 @@
     label={tracker.string.Assignee}
     placeholder={tracker.string.Assignee}
     value={value.assignee}
-    assignedTo={value}
+    {prevAssigned}
+    {projectLead}
+    {projectMembers}
     titleDeselect={tracker.string.Unassigned}
     {size}
     {kind}
diff --git a/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte b/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte
index 8b7613c7f95..1a92a2bde06 100644
--- a/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte
+++ b/plugins/tracker-resources/src/components/issues/timereport/EstimationSubIssueList.svelte
@@ -15,13 +15,13 @@
 <script lang="ts">
   import contact from '@hcengineering/contact'
   import { Doc, Ref } from '@hcengineering/core'
+  import { AssigneeBox } from '@hcengineering/presentation'
   import { Issue, Team } from '@hcengineering/tracker'
   import { getEventPositionElement, ListView, showPopup, deviceOptionsStore as deviceInfo } from '@hcengineering/ui'
   import { ContextMenu, FixedColumn, ListSelectionProvider, SelectDirection } from '@hcengineering/view-resources'
   import { getIssueId } from '../../../issues'
   import tracker from '../../../plugin'
   import EstimationEditor from './EstimationEditor.svelte'
-  import AssigneeBox from '../AssigneeBox.svelte'
 
   export let issues: Issue[]
 
@@ -66,7 +66,6 @@
           label={tracker.string.Assignee}
           _class={contact.class.Employee}
           value={issue.assignee}
-          assignedTo={issue}
           readonly
           showNavigate={false}
         />
diff --git a/plugins/tracker-resources/src/utils.ts b/plugins/tracker-resources/src/utils.ts
index 68d4e6426f7..0078c671d7b 100644
--- a/plugins/tracker-resources/src/utils.ts
+++ b/plugins/tracker-resources/src/utils.ts
@@ -13,7 +13,18 @@
 // limitations under the License.
 //
 
-import { Doc, DocumentQuery, Ref, SortingOrder, TxOperations, WithLookup } from '@hcengineering/core'
+import { Employee } from '@hcengineering/contact'
+import core, {
+  AttachedData,
+  Doc,
+  DocumentQuery,
+  Ref,
+  SortingOrder,
+  TxCollectionCUD,
+  TxOperations,
+  TxUpdateDoc,
+  WithLookup
+} from '@hcengineering/core'
 import { TypeState } from '@hcengineering/kanban'
 import { Asset, IntlString, translate } from '@hcengineering/platform'
 import { createQuery } from '@hcengineering/presentation'
@@ -24,6 +35,7 @@ import {
   IssuesGrouping,
   IssuesOrdering,
   IssueStatus,
+  IssueTemplateData,
   ProjectStatus,
   Sprint,
   SprintStatus,
@@ -592,3 +604,25 @@ export function subIssueListProvider (subIssues: Issue[], target: Ref<Issue>): v
     listProvider.updateFocus(selectedIssue)
   }
 }
+
+export async function getPreviousAssignees (
+  issue: Issue | AttachedData<Issue> | IssueTemplateData
+): Promise<Array<Ref<Employee>>> {
+  return await new Promise((resolve) => {
+    const query = createQuery(true)
+    query.query(
+      core.class.Tx,
+      {
+        'tx.objectId': (issue as Issue)._id,
+        'tx.operations.assignee': { $exists: true }
+      },
+      (res) => {
+        const prevAssignee = res
+          .map((t) => ((t as TxCollectionCUD<Doc, Issue>).tx as TxUpdateDoc<Issue>).operations.assignee)
+          .filter((p) => !(p == null)) as Array<Ref<Employee>>
+        resolve(prevAssignee)
+        query.unsubscribe()
+      }
+    )
+  })
+}