TSK-885: Fix invalid deps (#2777)

Signed-off-by: Andrey Sobolev <haiodo@gmail.com>
2024-11-22 03:14:40 +03:00 · 2023-03-22 09:48:57 +07:00 · 2023-03-22 09:48:57 +07:00 · b0abf93487
commit b0abf93487
parent 9dbef181ac
191 changed files with 673 additions and 622 deletions
--- a/dev/prod/src/platform.ts
+++ b/dev/prod/src/platform.ts
@ -15,67 +15,66 @@

 import { addLocation } from '@hcengineering/platform'

-import login, { loginId } from '@hcengineering/login'
-import workbench, { workbenchId } from '@hcengineering/workbench'
-import uiPlugin from '@hcengineering/ui'
-import { viewId } from '@hcengineering/view'
-import { taskId } from '@hcengineering/task'
-import { contactId } from '@hcengineering/contact'
-import { chunterId } from '@hcengineering/chunter'
-import { recruitId } from '@hcengineering/recruit'
 import { activityId } from '@hcengineering/activity'
-import { automationId } from '@hcengineering/automation'
-import { settingId } from '@hcengineering/setting'
-import { telegramId } from '@hcengineering/telegram'
 import { attachmentId } from '@hcengineering/attachment'
-import { leadId } from '@hcengineering/lead'
+import { automationId } from '@hcengineering/automation'
+import { boardId } from '@hcengineering/board'
+import { calendarId } from '@hcengineering/calendar'
+import { chunterId } from '@hcengineering/chunter'
 import { clientId } from '@hcengineering/client'
-import { gmailId } from '@hcengineering/gmail'
+import { contactId } from '@hcengineering/contact'
+import document, { documentId } from '@hcengineering/document'
+import gmail, { gmailId } from '@hcengineering/gmail'
+import { hrId } from '@hcengineering/hr'
 import { imageCropperId } from '@hcengineering/image-cropper'
 import { inventoryId } from '@hcengineering/inventory'
-import { templatesId } from '@hcengineering/templates'
+import { leadId } from '@hcengineering/lead'
+import login, { loginId } from '@hcengineering/login'
 import { notificationId } from '@hcengineering/notification'
-import { preferenceId } from '@hcengineering/preference'
-import { tagsId } from '@hcengineering/tags'
-import { calendarId } from '@hcengineering/calendar'
-import { trackerId } from '@hcengineering/tracker'
-import { boardId } from '@hcengineering/board'
-import { hrId } from '@hcengineering/hr'
-import { requestId } from '@hcengineering/request'
+import { recruitId } from '@hcengineering/recruit'
 import rekoni from '@hcengineering/rekoni'
-import document, { documentId } from '@hcengineering/document'
+import { requestId } from '@hcengineering/request'
+import { settingId } from '@hcengineering/setting'
+import { tagsId } from '@hcengineering/tags'
+import { taskId } from '@hcengineering/task'
+import telegram, { telegramId } from '@hcengineering/telegram'
+import { templatesId } from '@hcengineering/templates'
+import { trackerId } from '@hcengineering/tracker'
+import uiPlugin from '@hcengineering/ui'
+import { viewId } from '@hcengineering/view'
+import workbench, { workbenchId } from '@hcengineering/workbench'

-import bitrix, { bitrixId } from '@hcengineering/bitrix'
+import { bitrixId } from '@hcengineering/bitrix'

-import '@hcengineering/login-assets'
-import '@hcengineering/task-assets'
-import '@hcengineering/view-assets'
-import '@hcengineering/chunter-assets'
-import '@hcengineering/attachment-assets'
-import '@hcengineering/contact-assets'
-import '@hcengineering/recruit-assets'
 import '@hcengineering/activity-assets'
+import '@hcengineering/attachment-assets'
 import '@hcengineering/automation-assets'
-import '@hcengineering/setting-assets'
-import '@hcengineering/telegram-assets'
-import '@hcengineering/lead-assets'
-import '@hcengineering/gmail-assets'
-import '@hcengineering/workbench-assets'
-import '@hcengineering/inventory-assets'
-import '@hcengineering/templates-assets'
-import '@hcengineering/notification-assets'
-import '@hcengineering/tags-assets'
-import '@hcengineering/calendar-assets'
-import '@hcengineering/tracker-assets'
-import '@hcengineering/board-assets'
-import '@hcengineering/preference-assets'
-import '@hcengineering/hr-assets'
-import '@hcengineering/document-assets'
 import '@hcengineering/bitrix-assets'
+import '@hcengineering/board-assets'
+import '@hcengineering/calendar-assets'
+import '@hcengineering/chunter-assets'
+import '@hcengineering/contact-assets'
+import '@hcengineering/document-assets'
+import '@hcengineering/gmail-assets'
+import '@hcengineering/hr-assets'
+import '@hcengineering/inventory-assets'
+import '@hcengineering/lead-assets'
+import '@hcengineering/login-assets'
+import '@hcengineering/notification-assets'
+import '@hcengineering/preference-assets'
+import '@hcengineering/recruit-assets'
 import '@hcengineering/request-assets'
+import '@hcengineering/setting-assets'
+import '@hcengineering/tags-assets'
+import '@hcengineering/task-assets'
+import '@hcengineering/telegram-assets'
+import '@hcengineering/templates-assets'
+import '@hcengineering/tracker-assets'
+import '@hcengineering/view-assets'
+import '@hcengineering/workbench-assets'

-import presentation, { presentationId } from '@hcengineering/presentation'
 import { coreId } from '@hcengineering/core'
+import presentation, { presentationId } from '@hcengineering/presentation'
 import { textEditorId } from '@hcengineering/text-editor'

 import { setMetadata } from '@hcengineering/platform'
@ -94,7 +93,7 @@ export async function configurePlatform() {
  const config: Config = await (await fetch('/config.json')).json()
  console.log('loading configuration', config)
  setMetadata(login.metadata.AccountsUrl, config.ACCOUNTS_URL)
-  setMetadata(login.metadata.UploadUrl, config.UPLOAD_URL)
+  setMetadata(presentation.metadata.UploadURL, config.UPLOAD_URL)
  
  setMetadata(document.metadata.CollaboratorUrl, config.COLLABORATOR_URL)

@ -102,8 +101,9 @@ export async function configurePlatform() {
    console.log('Minimal Model version requirement', config.MODEL_VERSION)
    setMetadata(presentation.metadata.RequiredVersion, config.MODEL_VERSION)
  }
-  setMetadata(login.metadata.TelegramUrl, config.TELEGRAM_URL ?? 'http://localhost:8086')
-  setMetadata(login.metadata.GmailUrl, config.GMAIL_URL ?? 'http://localhost:8087')
+  setMetadata(telegram.metadata.TelegramURL, config.TELEGRAM_URL ?? 'http://localhost:8086')
+  setMetadata(gmail.metadata.GmailURL, config.GMAIL_URL ?? 'http://localhost:8087')
+  
  setMetadata(login.metadata.OverrideEndpoint, process.env.LOGIN_ENDPOINT)

  setMetadata(rekoni.metadata.RekoniUrl, config.REKONI_URL)
--- a/packages/presentation/lang/en.json
+++ b/packages/presentation/lang/en.json
@ -12,33 +12,20 @@
    "AddSocialLinks": "Add social links",
    "EditSocialLinks": "Edit social links",
    "Change": "Change",
-    "Remove": "Remove",
-    "Members": "Members",
+    "Remove": "Remove",    
    "Search": "Search...",
-    "Spaces": "Spaces",
-    "Unassigned": "Unassigned",
-    "CreateMore": "Create more",
-    "NumberMembers": "{count, plural, =0 {no members} =1 {1 member} other {# members}}",
+    "Spaces": "Spaces",    
+    "CreateMore": "Create more",    
    "NumberSpaces": "{count, plural, =0 {In} =1 {In 1 place} other {In # places}}",
    "InThis": "In this {space}",
    "NoMatchesInThis": "No matches in this {space}",
    "NoMatchesFound": "No matches found",
    "NotInThis": "Not in this {space}",
    "Add": "Add",
-    "Edit": "Edit",
-    "SelectAvatar": "Select avatar",
-    "GravatarsManaged": "Gravatars are managed through",
-    "CategoryCurrentUser": "Current user",
-    "Assigned": "Assigned",
-    "CategoryPreviousAssigned": "Previously assigned",
-    "CategoryProjectLead": "Project lead",
-    "CategoryProjectMembers": "Project members",
-    "CategoryOther": "Other",
-    "InltPropsValue": "{value}",
+    "Edit": "Edit",    
    "DocumentPreview": "Preview",
    "MakePrivate": "Make private",
    "MakePrivateDescription": "Only members can see it",
-    "AddMembersHeader": "Add members to {value}:",
    "OpenInANewTab": "Open in a new tab"
  }
 }
--- a/packages/presentation/lang/ru.json
+++ b/packages/presentation/lang/ru.json
@ -12,33 +12,20 @@
    "AddSocialLinks": "Добавить контактную информацию",
    "EditSocialLinks": "Редактировать контактную информацию",
    "Change": "Изменить",
-    "Remove": "Удалить",
-    "Members": "Участники",
+    "Remove": "Удалить",    
    "Search": "Поиск...",
-    "Spaces": "Пространства",
-    "Unassigned": "Не назначен",
-    "CreateMore": "Создать еще",
-    "NumberMembers": "{count, plural, =0 {нет участников} =1 {1 участник} =2 {2 участника} =3 {3 участника} =4 {4 участника} other {# участников}}",
+    "Spaces": "Пространства",    
+    "CreateMore": "Создать еще",    
    "NumberSpaces": "{count, plural, =0 {В} =1 {В 1 месте} other {В # местах}}",
    "InThis": "В этом {space}",
    "NoMatchesInThis": "В этом {space} совпадения не обнаружены",
    "NoMatchesFound": "Не найдено соответствий",
    "NotInThis": "Не в этом {space}",
    "Add": "Добавить",
-    "Edit": "Редактировать",
-    "SelectAvatar": "Выбрать аватар",
-    "GravatarsManaged": "Граватары управляются через",
-    "CategoryCurrentUser": "Текущий пользователь",
-    "Assigned": "Назначен",
-    "CategoryPreviousAssigned": "Ранее назначенные",
-    "CategoryProjectLead": "Руководитель проекта",
-    "CategoryProjectMembers": "Участники проекта",
-    "CategoryOther": "Прочие",
-    "InltPropsValue": "{value}",
+    "Edit": "Редактировать",    
    "DocumentPreview": "Предпросмотр",
    "MakePrivate": "Сделать личным",
    "MakePrivateDescription": "Только пользователи могут видеть это",
-    "AddMembersHeader": "Добавить пользователей в {value}:",
    "OpenInANewTab": "Открыть в новой вкладке"
  }
 }
--- a/packages/presentation/package.json
+++ b/packages/presentation/package.json
@ -32,19 +32,13 @@
    "typescript": "^4.3.5"
  },
  "dependencies": {
-    "@hcengineering/attachment": "^0.6.1",
    "@hcengineering/platform": "^0.6.8",
    "@hcengineering/core": "^0.6.21",
    "@hcengineering/query": "^0.6.1",
    "@hcengineering/ui": "^0.6.3",
    "@hcengineering/view": "^0.6.2",
    "svelte": "^3.47",
-    "@hcengineering/contact": "^0.6.11",
-    "@hcengineering/login": "^0.6.1",
-    "@hcengineering/image-cropper": "^0.6.0",
    "@hcengineering/client": "^0.6.6",
-    "@hcengineering/setting": "^0.6.2",
-    "@hcengineering/workbench": "^0.6.2",
    "fast-equals": "^2.0.3"
  }
 }
--- a/packages/presentation/src/components/IndexedDocumentContent.svelte
+++ b/packages/presentation/src/components/IndexedDocumentContent.svelte
@ -2,7 +2,7 @@
  import { AnyAttribute, DocIndexState, extractDocKey, isFullTextAttribute } from '@hcengineering/core'

  import { Label } from '@hcengineering/ui'
-  import Icon from '@hcengineering/ui/src/components/Icon.svelte'
+  import { Icon } from '@hcengineering/ui'
  import { getClient } from '../utils'

  export let indexDoc: DocIndexState
--- a/packages/presentation/src/components/NavLink.svelte
+++ b/packages/presentation/src/components/NavLink.svelte
@ -25,6 +25,8 @@
  function clickHandler (e: MouseEvent) {
    if (disableClick) return
    if (onClick) {
+      e.preventDefault()
+      e.stopPropagation()
      onClick(e)
    } else if (href !== undefined) {
      try {
--- a/packages/presentation/src/components/ObjectSearchPopup.svelte
+++ b/packages/presentation/src/components/ObjectSearchPopup.svelte
@ -37,6 +37,7 @@
  export let label: IntlString | undefined = undefined
  export let relatedDocuments: RelatedDocument[] | undefined = undefined
  export let ignore: RelatedDocument[] | undefined = undefined
+  export let allowCategory: Ref<ObjectSearchCategory>[] | undefined

  let items: ObjectSearchResult[] = []

@ -45,10 +46,15 @@
  const client = getClient()

  let category: ObjectSearchCategory | undefined
-  client.findAll(presentation.class.ObjectSearchCategory, {}).then((r) => {
-    categories = r
-    category = categories[0]
-  })
+  client
+    .findAll(
+      presentation.class.ObjectSearchCategory,
+      allowCategory !== undefined ? { _id: { $in: allowCategory } } : {}
+    )
+    .then((r) => {
+      categories = r
+      category = categories[0]
+    })

  const dispatch = createEventDispatcher()

--- a/packages/presentation/src/components/PDFViewer.svelte
+++ b/packages/presentation/src/components/PDFViewer.svelte
@ -13,9 +13,8 @@
 // limitations under the License.
 -->
 <script lang="ts">
-  import { PopupOptions } from '@hcengineering/ui'
-  import { Button, deviceOptionsStore as deviceInfo, Panel } from '@hcengineering/ui'
-  import Attachment from '@hcengineering/ui/src/components/icons/Attachment.svelte'
+  import { Doc } from '@hcengineering/core'
+  import { Button, deviceOptionsStore as deviceInfo, Panel, PopupOptions } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
  import presentation from '..'
  import { getFileUrl } from '../utils'
@ -27,7 +26,7 @@
  export let name: string
  export let contentType: string | undefined
  export let popupOptions: PopupOptions
-  export let value: Attachment
+  export let value: Doc

  const dispatch = createEventDispatcher()
  // let imgView: 'img-horizontal-fit' | 'img-vertical-fit' | 'img-original-fit' = 'img-vertical-fit'
--- a/packages/presentation/src/index.ts
+++ b/packages/presentation/src/index.ts
@ -22,12 +22,7 @@ export { default as AttributeEditor } from './components/AttributeEditor.svelte'
 export { default as InlineAttributeBarEditor } from './components/InlineAttributeBarEditor.svelte'
 export { default as InlineAttributeBar } from './components/InlineAttributeBar.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'
-export { default as Members } from './components/Members.svelte'
 export { default as MessageBox } from './components/MessageBox.svelte'
 export { default as MessageViewer } from './components/MessageViewer.svelte'
 export { default as ObjectPopup } from './components/ObjectPopup.svelte'
@ -37,21 +32,11 @@ export { default as SpaceMultiBoxList } from './components/SpaceMultiBoxList.sve
 export { default as SpaceSelect } from './components/SpaceSelect.svelte'
 export { default as SpaceSelector } from './components/SpaceSelector.svelte'
 export { default as SpacesMultiPopup } from './components/SpacesMultiPopup.svelte'
-export { default as UserBox } from './components/UserBox.svelte'
-export { default as UserBoxList } from './components/UserBoxList.svelte'
-export { default as UserInfo } from './components/UserInfo.svelte'
-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'
 export { default as IndexedDocumentCompare } from './components/IndexedDocumentCompare.svelte'
 export { default as DraggableList } from './components/DraggableList.svelte'
 export { default as NavLink } from './components/NavLink.svelte'
-export { connect, versionError } from './connect'
 export { default } from './plugin'
 export * from './types'
 export * from './utils'
--- a/packages/presentation/src/plugin.ts
+++ b/packages/presentation/src/plugin.ts
@ -15,7 +15,7 @@
 //

 import { Class, Ref } from '@hcengineering/core'
-import type { IntlString, Metadata, Plugin } from '@hcengineering/platform'
+import type { Asset, IntlString, Metadata, Plugin } from '@hcengineering/platform'
 import { plugin } from '@hcengineering/platform'
 import { ObjectSearchCategory } from './types'

@ -42,10 +42,8 @@ export default plugin(presentationId, {
    EditSocialLinks: '' as IntlString,
    Change: '' as IntlString,
    Remove: '' as IntlString,
-    Members: '' as IntlString,
    Search: '' as IntlString,
    Spaces: '' as IntlString,
-    Unassigned: '' as IntlString,
    CreateMore: '' as IntlString,
    NumberMembers: '' as IntlString,
    NumberSpaces: '' as IntlString,
@ -55,23 +53,16 @@ export default plugin(presentationId, {
    NotInThis: '' as IntlString,
    Add: '' as IntlString,
    Edit: '' as IntlString,
-    SelectAvatar: '' as IntlString,
-    GravatarsManaged: '' as IntlString,
-    CategoryCurrentUser: '' as IntlString,
-    Assigned: '' as IntlString,
-    CategoryPreviousAssigned: '' as IntlString,
-    CategoryProjectLead: '' as IntlString,
-    CategoryProjectMembers: '' as IntlString,
-    CategoryOther: '' as IntlString,
-    InltPropsValue: '' as IntlString,
    DocumentPreview: '' as IntlString,
    MakePrivate: '' as IntlString,
    MakePrivateDescription: '' as IntlString,
-    AddMembersHeader: '' as IntlString,
    OpenInANewTab: '' as IntlString
  },
  metadata: {
    RequiredVersion: '' as Metadata<string>,
-    Draft: '' as Metadata<Record<string, any>>
+    Draft: '' as Metadata<Record<string, any>>,
+    UploadURL: '' as Metadata<string>,
+    Token: '' as Metadata<string>,
+    FrontUrl: '' as Asset
  }
 })
--- a/packages/presentation/src/utils.ts
+++ b/packages/presentation/src/utils.ts
@ -36,15 +36,14 @@ import core, {
  TxResult,
  WithLookup
 } from '@hcengineering/core'
-import login from '@hcengineering/login'
-import { getMetadata, getResource, IntlString } from '@hcengineering/platform'
+import { getMetadata, getResource } from '@hcengineering/platform'
 import { LiveQuery as LQ } from '@hcengineering/query'
-import { onDestroy } from 'svelte'
-import { deepEqual } from 'fast-equals'
-import { IconSize, DropdownIntlItem, AnySvelteComponent } from '@hcengineering/ui'
+import { AnySvelteComponent, IconSize } from '@hcengineering/ui'
 import view, { AttributeEditor } from '@hcengineering/view'
-import contact, { AvatarType, AvatarProvider } from '@hcengineering/contact'
-import presentation, { KeyedAttribute } from '..'
+import { deepEqual } from 'fast-equals'
+import { onDestroy } from 'svelte'
+import { KeyedAttribute } from '..'
+import plugin from './plugin'

 let liveQuery: LQ
 let client: TxOperations
@ -183,8 +182,8 @@ export function createQuery (dontDestroy?: boolean): LiveQuery {
 * @public
 */
 export function getFileUrl (file: string, size: IconSize = 'full'): string {
-  const uploadUrl = getMetadata(login.metadata.UploadUrl)
-  const token = getMetadata(login.metadata.LoginToken)
+  const uploadUrl = getMetadata(plugin.metadata.UploadURL)
+  const token = getMetadata(plugin.metadata.Token)
  const url = `${uploadUrl as string}?file=${file}&token=${token as string}&size=${size as string}`
  return url
 }
@ -256,87 +255,6 @@ export function getAttributePresenterClass (
  return { attrClass, category }
 }

-export function getAvatarTypeDropdownItems (hasGravatar: boolean): DropdownIntlItem[] {
-  return [
-    {
-      id: AvatarType.COLOR,
-      label: contact.string.UseColor
-    },
-    {
-      id: AvatarType.IMAGE,
-      label: contact.string.UseImage
-    },
-    ...(hasGravatar
-      ? [
-          {
-            id: AvatarType.GRAVATAR,
-            label: contact.string.UseGravatar
-          }
-        ]
-      : [])
-  ]
-}
-
-export function getAvatarProviderId (avatar?: string | null): Ref<AvatarProvider> | undefined {
-  if (avatar === null || avatar === undefined || avatar === '') {
-    return
-  }
-  if (!avatar.includes('://')) {
-    return contact.avatarProvider.Image
-  }
-  const [schema] = avatar.split('://')
-
-  switch (schema) {
-    case AvatarType.GRAVATAR:
-      return contact.avatarProvider.Gravatar
-    case AvatarType.COLOR:
-      return contact.avatarProvider.Color
-  }
-}
-
-/**
- * @public
- */
-export type AssigneeCategory =
-  | 'CurrentUser'
-  | 'Assigned'
-  | 'PreviouslyAssigned'
-  | 'ProjectLead'
-  | 'ProjectMembers'
-  | 'Members'
-  | '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,
-  Members: presentation.string.Members,
-  Other: presentation.string.CategoryOther
-})
-
-/**
- * @public
- */
-export const assigneeCategoryOrder: AssigneeCategory[] = [
-  'CurrentUser',
-  'Assigned',
-  'PreviouslyAssigned',
-  'ProjectLead',
-  'ProjectMembers',
-  'Members',
-  'Other'
-]
-
-/**
- * @public
- */
-export function getCategorytitle (category: AssigneeCategory | undefined): IntlString {
-  const cat: AssigneeCategory = category ?? 'Other'
-  return assigneeCategoryTitleMap[cat]
-}
-
 function getAttributeEditorNotFoundError (
  _class: Ref<Class<Obj>>,
  key: KeyedAttribute | string,
--- a/packages/text-editor/package.json
+++ b/packages/text-editor/package.json
@ -33,7 +33,6 @@
  },
  "dependencies": {
    "@hcengineering/presentation": "^0.6.2",
-    "@hcengineering/contact": "^0.6.11",
    "@hcengineering/platform": "^0.6.8",
    "@hcengineering/core": "^0.6.21",
    "@hcengineering/ui": "^0.6.3",
--- a/packages/text-editor/src/components/CollaboratorEditor.svelte
+++ b/packages/text-editor/src/components/CollaboratorEditor.svelte
@ -26,7 +26,6 @@
  import { Plugin, PluginKey, Transaction } from 'prosemirror-state'
  import { createEventDispatcher, onDestroy, onMount } from 'svelte'

-  import { EmployeeAccount } from '@hcengineering/contact'
  import { getCurrentAccount, Markup } from '@hcengineering/core'
  import { getEventPositionElement, getPlatformColorForText, IconSize, SelectPopup, showPopup } from '@hcengineering/ui'
  import { WebsocketProvider } from 'y-websocket'
@ -42,6 +41,7 @@
  import Code from './icons/Code.svelte'
  import CodeBlock from './icons/CodeBlock.svelte'

+  import { getContext } from 'svelte'
  import { calculateDecorations } from './diff/decorations'
  import { defaultExtensions, headingLevels, mInsertTable } from './extensions'
  import Header from './icons/Header.svelte'
@ -53,15 +53,14 @@
  import Objects from './icons/Objects.svelte'
  import Quote from './icons/Quote.svelte'
  import Strikethrough from './icons/Strikethrough.svelte'
-  import LinkPopup from './LinkPopup.svelte'
-  import AddRowBefore from './icons/table/AddRowBefore.svelte'
-  import AddRowAfter from './icons/table/AddRowAfter.svelte'
-  import AddColBefore from './icons/table/AddColBefore.svelte'
  import AddColAfter from './icons/table/AddColAfter.svelte'
-  import DeleteRow from './icons/table/DeleteRow.svelte'
+  import AddColBefore from './icons/table/AddColBefore.svelte'
+  import AddRowAfter from './icons/table/AddRowAfter.svelte'
+  import AddRowBefore from './icons/table/AddRowBefore.svelte'
  import DeleteCol from './icons/table/DeleteCol.svelte'
+  import DeleteRow from './icons/table/DeleteRow.svelte'
  import DeleteTable from './icons/table/DeleteTable.svelte'
-  import { getContext } from 'svelte'
+  import LinkPopup from './LinkPopup.svelte'

  export let documentId: string
  export let readonly = false
@ -100,7 +99,7 @@
    })
  }

-  const currentUser = getCurrentAccount() as EmployeeAccount
+  const currentUser = getCurrentAccount()

  let element: HTMLElement
  let editor: Editor
@ -239,7 +238,7 @@
          CollaborationCursor.configure({
            provider: wsProvider,
            user: {
-              name: currentUser.name,
+              name: currentUser.email,
              color: getPlatformColorForText(currentUser.email)
            }
          }),
--- a/packages/ui/src/index.ts
+++ b/packages/ui/src/index.ts
@ -89,6 +89,7 @@ export { default as TimeSince } from './components/TimeSince.svelte'
 export { default as Dropdown } from './components/Dropdown.svelte'
 export { default as DropdownPopup } from './components/DropdownPopup.svelte'
 export { default as DropdownLabels } from './components/DropdownLabels.svelte'
+export { default as DropdownLabelsPopup } from './components/DropdownLabelsPopup.svelte'
 export { default as DropdownLabelsIntl } from './components/DropdownLabelsIntl.svelte'
 export { default as DropdownRecord } from './components/DropdownRecord.svelte'
 export { default as ShowMore } from './components/ShowMore.svelte'
--- a/plugins/attachment-resources/src/components/FileBrowserFilters.svelte
+++ b/plugins/attachment-resources/src/components/FileBrowserFilters.svelte
@ -15,10 +15,11 @@
 <script lang="ts">
  import { Employee } from '@hcengineering/contact'
  import { Class, Ref, Space } from '@hcengineering/core'
-  import { SpaceMultiBoxList, UserBoxList } from '@hcengineering/presentation'
-  import { DropdownLabelsIntl } from '@hcengineering/ui'
+  import { SpaceMultiBoxList } from '@hcengineering/presentation'
+  import { Component, DropdownLabelsIntl } from '@hcengineering/ui'
  import attachment from '../plugin'
  import { dateFileBrowserFilters, fileTypeFileBrowserFilters } from '..'
+  import contact from '@hcengineering/contact'

  export let requestedSpaceClasses: Ref<Class<Space>>[]
  export let spaceId: Ref<Space> | undefined
@ -30,9 +31,12 @@

 <div class="filterBlockContainer">
  <div class="simpleFilterButton">
-    <UserBoxList
-      items={selectedParticipants}
-      label={attachment.string.FileBrowserFilterFrom}
+    <Component
+      is={contact.component.UserBoxList}
+      props={{
+        items: selectedParticipants,
+        label: attachment.string.FileBrowserFilterFrom
+      }}
      on:update={(evt) => {
        selectedParticipants = evt.detail
      }}
--- a/plugins/attachment-resources/src/index.ts
+++ b/plugins/attachment-resources/src/index.ts
@ -37,6 +37,7 @@ import IconUploadDuo from './components/icons/UploadDuo.svelte'
 import IconAttachment from './components/icons/Attachment.svelte'
 import { deleteFile, uploadFile } from './utils'
 import { DisplayTx } from '@hcengineering/activity'
+import AttachmentPreview from './components/AttachmentPreview.svelte'

 export {
  AddAttachment,
@ -53,7 +54,8 @@ export {
  AttachmentStyledBox,
  AccordionEditor,
  IconUploadDuo,
-  IconAttachment
+  IconAttachment,
+  AttachmentPreview
 }

 export enum FileBrowserSortMode {
--- a/plugins/attachment-resources/src/utils.ts
+++ b/plugins/attachment-resources/src/utils.ts
@ -16,13 +16,13 @@

 import { Attachment } from '@hcengineering/attachment'
 import { Class, concatLink, Data, Doc, Ref, Space, TxOperations as Client } from '@hcengineering/core'
-import login from '@hcengineering/login'
+import presentation from '@hcengineering/presentation'
 import { getMetadata, setPlatformStatus, unknownError } from '@hcengineering/platform'

 import attachment from './plugin'

 export async function uploadFile (file: File): Promise<string> {
-  const uploadUrl = getMetadata(login.metadata.UploadUrl)
+  const uploadUrl = getMetadata(presentation.metadata.UploadURL)

  if (uploadUrl === undefined) {
    throw Error('UploadURL is not defined')
@ -34,7 +34,7 @@ export async function uploadFile (file: File): Promise<string> {
  const resp = await fetch(uploadUrl, {
    method: 'POST',
    headers: {
-      Authorization: 'Bearer ' + (getMetadata(login.metadata.LoginToken) as string)
+      Authorization: 'Bearer ' + (getMetadata(presentation.metadata.Token) as string)
    },
    body: data
  })
@ -47,13 +47,13 @@ export async function uploadFile (file: File): Promise<string> {
 }

 export async function deleteFile (id: string): Promise<void> {
-  const uploadUrl = getMetadata(login.metadata.UploadUrl) ?? ''
+  const uploadUrl = getMetadata(presentation.metadata.UploadURL) ?? ''

  const url = concatLink(uploadUrl, `?file=${id}`)
  const resp = await fetch(url, {
    method: 'DELETE',
    headers: {
-      Authorization: 'Bearer ' + (getMetadata(login.metadata.LoginToken) as string)
+      Authorization: 'Bearer ' + (getMetadata(presentation.metadata.Token) as string)
    }
  })

--- a/plugins/bitrix-resources/src/components/BitrixFieldLookup.svelte
+++ b/plugins/bitrix-resources/src/components/BitrixFieldLookup.svelte
@ -10,12 +10,12 @@
    EditBox,
    eventToHTMLElement,
    getEventPositionElement,
+    Grid,
    IconAdd,
    IconEdit,
    Menu,
    showPopup
  } from '@hcengineering/ui'
-  import Grid from '@hcengineering/ui/src/components/Grid.svelte'

  import EnumPopup from './EnumPopup.svelte'

--- a/plugins/bitrix-resources/src/components/CreateMapping.svelte
+++ b/plugins/bitrix-resources/src/components/CreateMapping.svelte
@ -3,7 +3,7 @@
  import core, { Class, ClassifierKind, Doc, Obj, Ref } from '@hcengineering/core'
  import { Card, createQuery, getClient } from '@hcengineering/presentation'
  import setting, { Integration } from '@hcengineering/setting'
-  import DropdownLabels from '@hcengineering/ui/src/components/DropdownLabels.svelte'
+  import { DropdownLabels } from '@hcengineering/ui'
  import { ObjectBox } from '@hcengineering/view-resources'
  import bitrix from '../plugin'

--- a/plugins/bitrix-resources/src/components/EntityMapping.svelte
+++ b/plugins/bitrix-resources/src/components/EntityMapping.svelte
@ -18,8 +18,7 @@
  import AttributeMapper from './AttributeMapper.svelte'
  import FieldMappingPresenter from './FieldMappingPresenter.svelte'

-  import CheckBox from '@hcengineering/ui/src/components/CheckBox.svelte'
-  import DropdownLabelsPopup from '@hcengineering/ui/src/components/DropdownLabelsPopup.svelte'
+  import { CheckBox, DropdownLabelsPopup } from '@hcengineering/ui'
  import { deepEqual } from 'fast-equals'
  import BitrixFieldLookup from './BitrixFieldLookup.svelte'
  import CreateMappingAttribute from './CreateMappingAttribute.svelte'
--- a/plugins/bitrix-resources/src/components/FieldMappingSynchronizer.svelte
+++ b/plugins/bitrix-resources/src/components/FieldMappingSynchronizer.svelte
@ -11,12 +11,11 @@
  } from '@hcengineering/bitrix'
  import contact from '@hcengineering/contact'
  import core, { Class, Doc, generateId, Ref, Space, WithLookup } from '@hcengineering/core'
-  import login from '@hcengineering/login'
  import { getEmbeddedLabel, getMetadata } from '@hcengineering/platform'
-  import { getClient, SpaceSelect } from '@hcengineering/presentation'
+  import presentation, { getClient, SpaceSelect } from '@hcengineering/presentation'
  import { Button, Expandable, Icon, IconAdd, IconClose, Label } from '@hcengineering/ui'
-  import DropdownLabels from '@hcengineering/ui/src/components/DropdownLabels.svelte'
-  import EditBox from '@hcengineering/ui/src/components/EditBox.svelte'
+  import { DropdownLabels } from '@hcengineering/ui'
+  import { EditBox } from '@hcengineering/ui'
  import { NumberEditor } from '@hcengineering/view-resources'
  import bitrix from '../plugin'
  import FieldMappingPresenter from './FieldMappingPresenter.svelte'
@ -44,8 +43,8 @@

  async function doSync (): Promise<void> {
    loading = true
-    const uploadUrl = (window.location.origin + getMetadata(login.metadata.UploadUrl)) as string
-    const token = (getMetadata(login.metadata.LoginToken) as string) ?? ''
+    const uploadUrl = (window.location.origin + getMetadata(presentation.metadata.UploadURL)) as string
+    const token = (getMetadata(presentation.metadata.Token) as string) ?? ''

    const mappedFilter: Record<string, any> = {}
    for (const f of filterFields) {
--- a/plugins/bitrix-resources/src/components/mappings/CopyMapping.svelte
+++ b/plugins/bitrix-resources/src/components/mappings/CopyMapping.svelte
@ -9,9 +9,7 @@
  } from '@hcengineering/bitrix'
  import core, { AnyAttribute } from '@hcengineering/core'
  import { getClient } from '@hcengineering/presentation'
-  import { Button, IconActivity, IconAdd, IconClose, IconDelete } from '@hcengineering/ui'
-  import DropdownLabels from '@hcengineering/ui/src/components/DropdownLabels.svelte'
-  import EditBox from '@hcengineering/ui/src/components/EditBox.svelte'
+  import { Button, DropdownLabels, EditBox, IconActivity, IconAdd, IconClose, IconDelete } from '@hcengineering/ui'
  import bitrix from '../../plugin'

  export let mapping: BitrixEntityMapping
--- a/plugins/bitrix-resources/src/components/mappings/CreateChannelMapping.svelte
+++ b/plugins/bitrix-resources/src/components/mappings/CreateChannelMapping.svelte
@ -3,17 +3,16 @@
    BitrixEntityMapping,
    BitrixFieldMapping,
    ChannelFieldMapping,
+    CreateChannelOperation,
    Fields,
-    MappingOperation,
-    CreateChannelOperation
+    MappingOperation
  } from '@hcengineering/bitrix'
  import { AnyAttribute } from '@hcengineering/core'
  import { getEmbeddedLabel } from '@hcengineering/platform'
  import { getClient } from '@hcengineering/presentation'

  import contact, { ChannelProvider } from '@hcengineering/contact'
-  import { Button, DropdownLabelsIntl, EditBox, IconAdd, IconDelete } from '@hcengineering/ui'
-  import DropdownLabels from '@hcengineering/ui/src/components/DropdownLabels.svelte'
+  import { Button, DropdownLabels, DropdownLabelsIntl, EditBox, IconAdd, IconDelete } from '@hcengineering/ui'
  import bitrix from '../../plugin'

  export let mapping: BitrixEntityMapping
--- a/plugins/bitrix-resources/src/components/mappings/CreateTagMapping.svelte
+++ b/plugins/bitrix-resources/src/components/mappings/CreateTagMapping.svelte
@ -14,14 +14,14 @@
  import { WeightPopup } from '@hcengineering/tags-resources'
  import {
    Button,
+    DropdownLabels,
    DropdownTextItem,
+    EditBox,
    getEventPopupPositionElement,
    IconAdd,
    IconDelete,
    showPopup
  } from '@hcengineering/ui'
-  import DropdownLabels from '@hcengineering/ui/src/components/DropdownLabels.svelte'
-  import EditBox from '@hcengineering/ui/src/components/EditBox.svelte'
  import bitrix from '../../plugin'

  export let mapping: BitrixEntityMapping
--- a/plugins/bitrix-resources/src/components/mappings/DownloadAttachmentMapping.svelte
+++ b/plugins/bitrix-resources/src/components/mappings/DownloadAttachmentMapping.svelte
@ -9,7 +9,7 @@
  import { AnyAttribute } from '@hcengineering/core'
  import { getClient } from '@hcengineering/presentation'
  import { Button, DropdownTextItem, IconAdd, IconDelete } from '@hcengineering/ui'
-  import DropdownLabels from '@hcengineering/ui/src/components/DropdownLabels.svelte'
+  import { DropdownLabels } from '@hcengineering/ui'
  import bitrix from '../../plugin'

  export let mapping: BitrixEntityMapping
--- a/plugins/bitrix-resources/src/components/mappings/FindReferenceMapping.svelte
+++ b/plugins/bitrix-resources/src/components/mappings/FindReferenceMapping.svelte
@ -10,8 +10,7 @@
  } from '@hcengineering/bitrix'
  import core, { AnyAttribute } from '@hcengineering/core'
  import { getClient } from '@hcengineering/presentation'
-  import { DropdownTextItem } from '@hcengineering/ui'
-  import DropdownLabels from '@hcengineering/ui/src/components/DropdownLabels.svelte'
+  import { DropdownLabels, DropdownTextItem } from '@hcengineering/ui'
  import bitrix from '../../plugin'

  export let mapping: BitrixEntityMapping
--- a/plugins/board-resources/src/components/Archive.svelte
+++ b/plugins/board-resources/src/components/Archive.svelte
@ -1,10 +1,9 @@
 <script lang="ts">
  import { Ref, Space } from '@hcengineering/core'
-  import { Button } from '@hcengineering/ui'
+  import { Button, TextArea } from '@hcengineering/ui'
  import board from '../plugin'
  import CardsArchive from './CardArchive.svelte'
  import ListArchive from './ListArchive.svelte'
-  import TextArea from '@hcengineering/ui/src/components/TextArea.svelte'

  export let space: Ref<Space>

--- a/plugins/board-resources/src/components/BoardMenu.svelte
+++ b/plugins/board-resources/src/components/BoardMenu.svelte
@ -1,6 +1,6 @@
 <script lang="ts">
  import { Ref, Space } from '@hcengineering/core'
-  import Label from '@hcengineering/ui/src/components/Label.svelte'
+  import { Label } from '@hcengineering/ui'
  import board from '../plugin'
  import { createQuery } from '@hcengineering/presentation'
  import { MenuPage } from '@hcengineering/board'
--- a/plugins/board-resources/src/components/CreateCard.svelte
+++ b/plugins/board-resources/src/components/CreateCard.svelte
@ -17,8 +17,7 @@
  import type { Card as BoardCard } from '@hcengineering/board'
  import { AttachedData, generateId, Ref, SortingOrder, Space } from '@hcengineering/core'
  import { OK, Status } from '@hcengineering/platform'
-  import { Card, getClient } from '@hcengineering/presentation'
-  import SpaceSelector from '@hcengineering/presentation/src/components/SpaceSelector.svelte'
+  import { Card, getClient, SpaceSelector } from '@hcengineering/presentation'
  import task, { calcRank } from '@hcengineering/task'
  import { EditBox, Grid, Status as StatusControl } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
--- a/plugins/board-resources/src/components/KanbanCard.svelte
+++ b/plugins/board-resources/src/components/KanbanCard.svelte
@ -22,7 +22,8 @@
  import notification from '@hcengineering/notification'
  import view from '@hcengineering/view'
  import tags from '@hcengineering/tags'
-  import { getClient, UserBoxList } from '@hcengineering/presentation'
+  import { getClient } from '@hcengineering/presentation'
+  import contact from '@hcengineering/contact'
  import {
    Button,
    Component,
@ -215,7 +216,11 @@
      </div>
      {#if (object.members?.length ?? 0) > 0}
        <div class="flex justify-end mt-1 mb-2" style:pointer-events={dragoverAttachment ? 'none' : 'all'}>
-          <UserBoxList items={object.members} label={board.string.Members} on:update={updateMembers} />
+          <Component
+            is={contact.component.UserBoxList}
+            props={{ items: object.members, label: board.string.Members }}
+            on:update={updateMembers}
+          />
        </div>
      {/if}
    </div>
--- a/plugins/board-resources/src/components/UserBoxList.svelte
+++ b/plugins/board-resources/src/components/UserBoxList.svelte
@ -2,11 +2,16 @@
  import { Employee } from '@hcengineering/contact'
  import { Ref } from '@hcengineering/core'

-  import { UserBoxList } from '@hcengineering/presentation'
+  import contact from '@hcengineering/contact'
  import board from '../plugin'
+  import { Component } from '@hcengineering/ui'

  export let value: Ref<Employee>[]
  export let readonly = false
 </script>

-<UserBoxList items={value} label={board.string.Members} on:update {readonly} />
+<Component
+  is={contact.component.UserBoxList}
+  props={{ items: value, label: board.string.Members, readonly }}
+  on:update
+/>
--- a/plugins/board-resources/src/components/editor/CardChecklist.svelte
+++ b/plugins/board-resources/src/components/editor/CardChecklist.svelte
@ -13,24 +13,25 @@
 // limitations under the License.
 -->
 <script lang="ts">
+  import { Employee } from '@hcengineering/contact'
+  import { EmployeeBox } from '@hcengineering/contact-resources'
  import { Ref } from '@hcengineering/core'
-  import { createQuery, getClient, EmployeeBox, MessageBox } from '@hcengineering/presentation'
+  import { createQuery, getClient, MessageBox } from '@hcengineering/presentation'
  import type { TodoItem } from '@hcengineering/task'
  import task, { calcRank } from '@hcengineering/task'
  import {
    Button,
    CheckBox,
-    TextAreaEditor,
+    DateRangePresenter,
    getEventPopupPositionElement,
    IconAdd,
    IconDelete,
    IconMoreH,
    Progress,
    showPopup,
-    DateRangePresenter
+    TextAreaEditor
  } from '@hcengineering/ui'
  import { ContextMenu, HTMLPresenter } from '@hcengineering/view-resources'
-  import { Employee } from '@hcengineering/contact'

  import board from '../../plugin'
  import { getDateIcon } from '../../utils/BoardUtils'
--- a/plugins/board-resources/src/components/selectors/RankSelect.svelte
+++ b/plugins/board-resources/src/components/selectors/RankSelect.svelte
@ -1,11 +1,10 @@
 <script lang="ts">
+  import { Card } from '@hcengineering/board'
+  import { Ref, SortingOrder } from '@hcengineering/core'
  import { IntlString, translate } from '@hcengineering/platform'
  import { createQuery } from '@hcengineering/presentation'
-  import { DropdownLabels } from '@hcengineering/ui'
-  import { Ref, SortingOrder } from '@hcengineering/core'
-  import { DropdownTextItem } from '@hcengineering/ui/src/types'
  import { calcRank, State } from '@hcengineering/task'
-  import { Card } from '@hcengineering/board'
+  import { DropdownLabels, DropdownTextItem } from '@hcengineering/ui'
  import board from '../../plugin'

  export let object: Card
--- a/plugins/board-resources/src/components/selectors/SpaceSelect.svelte
+++ b/plugins/board-resources/src/components/selectors/SpaceSelect.svelte
@ -1,10 +1,9 @@
 <script lang="ts">
+  import { Board, Card } from '@hcengineering/board'
+  import { Ref } from '@hcengineering/core'
  import { IntlString, translate } from '@hcengineering/platform'
  import { createQuery } from '@hcengineering/presentation'
-  import { DropdownLabels } from '@hcengineering/ui'
-  import { Ref } from '@hcengineering/core'
-  import { DropdownTextItem } from '@hcengineering/ui/src/types'
-  import { Board, Card } from '@hcengineering/board'
+  import { DropdownLabels, DropdownTextItem } from '@hcengineering/ui'
  import board from '../../plugin'

  export let object: Card
--- a/plugins/board-resources/src/components/selectors/StateSelect.svelte
+++ b/plugins/board-resources/src/components/selectors/StateSelect.svelte
@ -1,11 +1,10 @@
 <script lang="ts">
+  import { Card } from '@hcengineering/board'
+  import { Ref, SortingOrder, Space } from '@hcengineering/core'
  import { IntlString, translate } from '@hcengineering/platform'
  import { createQuery } from '@hcengineering/presentation'
-  import { DropdownLabels } from '@hcengineering/ui'
-  import { Ref, SortingOrder, Space } from '@hcengineering/core'
-  import { DropdownTextItem } from '@hcengineering/ui/src/types'
  import task, { State } from '@hcengineering/task'
-  import { Card } from '@hcengineering/board'
+  import { DropdownLabels, DropdownTextItem } from '@hcengineering/ui'
  import board from '../../plugin'

  export let object: Card
--- a/plugins/calendar-resources/src/components/CalendarView.svelte
+++ b/plugins/calendar-resources/src/components/CalendarView.svelte
@ -23,11 +23,11 @@
    IconBack,
    IconForward,
    MonthCalendar,
+    Scroller,
    showPopup,
    WeekCalendar,
    YearCalendar
  } from '@hcengineering/ui'
-  import Scroller from '@hcengineering/ui/src/components/Scroller.svelte'
  import { BuildModelKey } from '@hcengineering/view'
  import { CalendarMode } from '../index'
  import calendar from '../plugin'
--- a/plugins/calendar-resources/src/components/CreateEvent.svelte
+++ b/plugins/calendar-resources/src/components/CreateEvent.svelte
@ -15,7 +15,8 @@
 <script lang="ts">
  import { Employee, EmployeeAccount } from '@hcengineering/contact'
  import { Class, DateRangeMode, Doc, getCurrentAccount, Ref } from '@hcengineering/core'
-  import { Card, getClient, UserBoxList } from '@hcengineering/presentation'
+  import { Card, getClient } from '@hcengineering/presentation'
+  import { UserBoxList } from '@hcengineering/contact-resources'
  import ui, { EditBox, DateRangePresenter } from '@hcengineering/ui'
  import { tick } from 'svelte'
  import { createEventDispatcher } from 'svelte'
--- a/plugins/calendar-resources/src/components/CreateReminder.svelte
+++ b/plugins/calendar-resources/src/components/CreateReminder.svelte
@ -15,7 +15,8 @@
 <script lang="ts">
  import { Employee, EmployeeAccount } from '@hcengineering/contact'
  import { Class, DateRangeMode, Doc, getCurrentAccount, Ref } from '@hcengineering/core'
-  import { Card, getClient, UserBoxList } from '@hcengineering/presentation'
+  import { Card, getClient } from '@hcengineering/presentation'
+  import { UserBoxList } from '@hcengineering/contact-resources'
  import ui, { EditBox, DateRangePresenter } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
  import calendar from '../plugin'
--- a/plugins/calendar-resources/src/components/EditEvent.svelte
+++ b/plugins/calendar-resources/src/components/EditEvent.svelte
@ -18,8 +18,7 @@
  import { createQuery, getClient } from '@hcengineering/presentation'
  import { StyledTextBox } from '@hcengineering/text-editor'
  import { AnyComponent, Component, Label, StylishEdit } from '@hcengineering/ui'
-  import ObjectPresenter from '@hcengineering/view-resources/src/components/ObjectPresenter.svelte'
-  import { getObjectPreview } from '@hcengineering/view-resources/src/utils'
+  import { getObjectPreview, ObjectPresenter } from '@hcengineering/view-resources'
  import { createEventDispatcher, onMount } from 'svelte'
  import calendar from '../plugin'

--- a/plugins/calendar-resources/src/components/Hour.svelte
+++ b/plugins/calendar-resources/src/components/Hour.svelte
@ -15,8 +15,7 @@
 <script lang="ts">
  import { Event } from '@hcengineering/calendar'
  import { Ref } from '@hcengineering/core'
-  import { getPlatformColorForText, showPanel, tooltip } from '@hcengineering/ui'
-  import { areDatesEqual } from '@hcengineering/ui/src/components/calendar/internal/DateUtils'
+  import { areDatesEqual, getPlatformColorForText, showPanel, tooltip } from '@hcengineering/ui'
  import view from '@hcengineering/view'
  import { createEventDispatcher } from 'svelte'
  import EventPresenter from './EventPresenter.svelte'
--- a/plugins/calendar-resources/src/components/PersonsPresenter.svelte
+++ b/plugins/calendar-resources/src/components/PersonsPresenter.svelte
@ -16,7 +16,7 @@
 <script lang="ts">
  import { getName, Person } from '@hcengineering/contact'
  import { Hierarchy } from '@hcengineering/core'
-  import { Avatar } from '@hcengineering/presentation'
+  import { Avatar } from '@hcengineering/contact-resources'
  import calendar from '../plugin'
  import { showPanel, tooltip } from '@hcengineering/ui'
  import view from '@hcengineering/view'
--- a/plugins/chunter-resources/src/components/Comment.svelte
+++ b/plugins/chunter-resources/src/components/Comment.svelte
@ -14,7 +14,7 @@
 -->
 <script lang="ts">
  import { getName, Person } from '@hcengineering/contact'
-  import { Avatar } from '@hcengineering/presentation'
+  import { Avatar } from '@hcengineering/contact-resources'

  interface IMessage {
    text: string
--- a/plugins/chunter-resources/src/components/CommentPresenter.svelte
+++ b/plugins/chunter-resources/src/components/CommentPresenter.svelte
@ -20,7 +20,8 @@
  import contact, { Employee, EmployeeAccount, getName } from '@hcengineering/contact'
  import { employeeByIdStore } from '@hcengineering/contact-resources'
  import { Ref } from '@hcengineering/core'
-  import { Avatar, getClient, MessageViewer } from '@hcengineering/presentation'
+  import { getClient, MessageViewer } from '@hcengineering/presentation'
+  import { Avatar } from '@hcengineering/contact-resources'
  import { Icon, ShowMore, TimeSince } from '@hcengineering/ui'

  export let value: Comment
--- a/plugins/chunter-resources/src/components/CreateDirectMessage.svelte
+++ b/plugins/chunter-resources/src/components/CreateDirectMessage.svelte
@ -18,11 +18,12 @@

  import contact, { Employee } from '@hcengineering/contact'
  import core, { getCurrentAccount, Ref } from '@hcengineering/core'
-  import { getClient, SpaceCreateCard, UserBoxList } from '@hcengineering/presentation'
+  import { getClient, SpaceCreateCard } from '@hcengineering/presentation'
  import workbench from '@hcengineering/workbench'
  import { getResource } from '@hcengineering/platform'

  import chunter from '../plugin'
+  import { UserBoxList } from '@hcengineering/contact-resources'

  const dispatch = createEventDispatcher()
  const client = getClient()
--- a/plugins/chunter-resources/src/components/DmHeader.svelte
+++ b/plugins/chunter-resources/src/components/DmHeader.svelte
@ -16,7 +16,8 @@
  import { DirectMessage } from '@hcengineering/chunter'
  import type { Ref } from '@hcengineering/core'
  import { getCurrentAccount } from '@hcengineering/core'
-  import { createQuery, getClient, CombineAvatars } from '@hcengineering/presentation'
+  import { createQuery, getClient } from '@hcengineering/presentation'
+  import { CombineAvatars } from '@hcengineering/contact-resources'
  import contact, { EmployeeAccount } from '@hcengineering/contact'
  import { SearchEdit, showPanel } from '@hcengineering/ui'
  import chunter from '../plugin'
--- a/plugins/chunter-resources/src/components/EditChannel.svelte
+++ b/plugins/chunter-resources/src/components/EditChannel.svelte
@ -16,7 +16,8 @@
 <script lang="ts">
  import { ChunterSpace } from '@hcengineering/chunter'
  import type { Class, Ref } from '@hcengineering/core'
-  import { createQuery, getClient, Members } from '@hcengineering/presentation'
+  import { createQuery, getClient } from '@hcengineering/presentation'
+  import { SpaceMembers } from '@hcengineering/contact-resources'
  import { Icon, Label, Panel, Scroller } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'

@ -91,7 +92,7 @@
          <span class="fs-title text-xl overflow-label mb-2 flex-no-shrink">
            <Label label={chunter.string.Members} />
          </span>
-          <Members space={channel} withAddButton={true} withInviteWorkspaceButton={true} />
+          <SpaceMembers space={channel} withAddButton={true} />
        </div>
      {/if}
    </div>
--- a/plugins/chunter-resources/src/components/Message.svelte
+++ b/plugins/chunter-resources/src/components/Message.svelte
@ -21,7 +21,8 @@
  import { getCurrentAccount, Ref, WithLookup } from '@hcengineering/core'
  import { NotificationClientImpl } from '@hcengineering/notification-resources'
  import { getResource } from '@hcengineering/platform'
-  import { Avatar, getClient, MessageViewer } from '@hcengineering/presentation'
+  import { getClient, MessageViewer } from '@hcengineering/presentation'
+  import { Avatar } from '@hcengineering/contact-resources'
  import { EmojiPopup } from '@hcengineering/text-editor'
  import ui, { ActionIcon, Button, IconMoreH, Label, showPopup, tooltip } from '@hcengineering/ui'
  import { Action } from '@hcengineering/view'
--- a/plugins/chunter-resources/src/components/PinnedMessagesPopup.svelte
+++ b/plugins/chunter-resources/src/components/PinnedMessagesPopup.svelte
@ -3,7 +3,8 @@
  import contact, { Employee, EmployeeAccount, getName } from '@hcengineering/contact'
  import { employeeByIdStore } from '@hcengineering/contact-resources'
  import { IdMap, Ref, Space, toIdMap } from '@hcengineering/core'
-  import { Avatar, createQuery, MessageViewer } from '@hcengineering/presentation'
+  import { createQuery, MessageViewer } from '@hcengineering/presentation'
+  import { Avatar } from '@hcengineering/contact-resources'
  import { IconClose } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
  import { UnpinMessage } from '../index'
--- a/plugins/chunter-resources/src/components/Replies.svelte
+++ b/plugins/chunter-resources/src/components/Replies.svelte
@ -17,7 +17,7 @@
  import { Employee } from '@hcengineering/contact'
  import { employeeByIdStore } from '@hcengineering/contact-resources'
  import { IdMap, Ref } from '@hcengineering/core'
-  import { Avatar } from '@hcengineering/presentation'
+  import { Avatar } from '@hcengineering/contact-resources'
  import { Label, TimeSince } from '@hcengineering/ui'
  import chunter from '../plugin'

--- a/plugins/chunter-resources/src/components/SavedMessages.svelte
+++ b/plugins/chunter-resources/src/components/SavedMessages.svelte
@ -1,6 +1,6 @@
 <script lang="ts">
  import attachment, { Attachment } from '@hcengineering/attachment'
-  import AttachmentPreview from '@hcengineering/attachment-resources/src/components/AttachmentPreview.svelte'
+  import { AttachmentPreview } from '@hcengineering/attachment-resources'
  import { ChunterMessage } from '@hcengineering/chunter'
  import contact, { EmployeeAccount, getName as getContactName } from '@hcengineering/contact'
  import { employeeByIdStore } from '@hcengineering/contact-resources'
--- a/plugins/contact-assets/lang/en.json
+++ b/plugins/contact-assets/lang/en.json
@ -77,6 +77,17 @@
    "ProfilePlaceholder": "Profile...",
    "CurrentEmployee": "Current employee",
    "MergeEmployee": "Merge employee",
-    "DisplayName": "Display name"
+    "DisplayName": "Display name",
+    "SelectAvatar": "Select avatar",
+    "GravatarsManaged": "Gravatars are managed through",
+    "CategoryProjectMembers": "Project members",
+    "AddMembersHeader": "Add members to {value}:",
+    "Assigned": "Assigned",
+    "Unassigned": "Unassigned",
+    "CategoryPreviousAssigned": "Previously assigned",
+    "CategoryProjectLead": "Project lead",
+    "CategoryCurrentUser": "Current user",    
+    "CategoryOther": "Other",
+    "NumberMembers": "{count, plural, =0 {no members} =1 {1 member} other {# members}}"
  }
 }
--- a/plugins/contact-assets/lang/ru.json
+++ b/plugins/contact-assets/lang/ru.json
@ -57,7 +57,7 @@
    "Copied": "Скопировано",
    "ViewFullProfile": "Посмотреть профиль",
    "Member": "Сотрудник компании",
-    "Members": "Сотрудники",
+    "Members": "Участники",
    "NoMembers": "Нет добавленных сотрудников",
    "AddMember": "Добавить сотрудника",
    "KickEmployee": "Исключить сотрудника",
@ -77,6 +77,17 @@
    "ProfilePlaceholder": "Профиль...",
    "CurrentEmployee": "Текущий сотрудник",
    "MergeEmployee": "Объеденить сотрудника",
-    "DisplayName": "Отображаемое имя"
+    "DisplayName": "Отображаемое имя",
+    "SelectAvatar": "Выбрать аватар",
+    "GravatarsManaged": "Граватары управляются через",
+    "AddMembersHeader": "Добавить пользователей в {value}:",
+    "NumberMembers": "{count, plural, =0 {нет участников} =1 {1 участник} =2 {2 участника} =3 {3 участника} =4 {4 участника} other {# участников}}",
+    "Assigned": "Назначен",
+    "Unassigned": "Не назначен",
+    "CategoryCurrentUser": "Текущий пользователь",
+    "CategoryPreviousAssigned": "Ранее назначенные",
+    "CategoryProjectLead": "Руководитель проекта",
+    "CategoryProjectMembers": "Участники проекта",
+    "CategoryOther": "Прочие"
  }
 }
--- a/plugins/contact-resources/package.json
+++ b/plugins/contact-resources/package.json
@ -46,6 +46,7 @@
    "@hcengineering/view-resources": "^0.6.0",
    "@hcengineering/attachment": "^0.6.1",
    "@hcengineering/login-resources": "^0.6.2",
-    "@hcengineering/templates": "^0.6.0"
+    "@hcengineering/templates": "^0.6.0",
+    "@hcengineering/image-cropper": "^0.6.0"
  }
 }
--- a/plugins/contact-resources/src/assignee.ts
+++ b/plugins/contact-resources/src/assignee.ts
@ -0,0 +1,45 @@
+import { IntlString } from '@hcengineering/platform'
+import contact from './plugin'
+
+/**
+ * @public
+ */
+export type AssigneeCategory =
+  | 'CurrentUser'
+  | 'Assigned'
+  | 'PreviouslyAssigned'
+  | 'ProjectLead'
+  | 'ProjectMembers'
+  | 'Members'
+  | 'Other'
+
+const assigneeCategoryTitleMap: Record<AssigneeCategory, IntlString> = Object.freeze({
+  CurrentUser: contact.string.CategoryCurrentUser,
+  Assigned: contact.string.Assigned,
+  PreviouslyAssigned: contact.string.CategoryPreviousAssigned,
+  ProjectLead: contact.string.CategoryProjectLead,
+  ProjectMembers: contact.string.CategoryProjectMembers,
+  Members: contact.string.Members,
+  Other: contact.string.CategoryOther
+})
+
+/**
+ * @public
+ */
+export const assigneeCategoryOrder: AssigneeCategory[] = [
+  'CurrentUser',
+  'Assigned',
+  'PreviouslyAssigned',
+  'ProjectLead',
+  'ProjectMembers',
+  'Members',
+  'Other'
+]
+
+/**
+ * @public
+ */
+export function getCategoryTitle (category: AssigneeCategory | undefined): IntlString {
+  const cat: AssigneeCategory = category ?? 'Other'
+  return assigneeCategoryTitleMap[cat]
+}
--- a/plugins/contact-resources/src/components/AccountArrayEditor.svelte
+++ b/plugins/contact-resources/src/components/AccountArrayEditor.svelte
@ -16,8 +16,9 @@
  import contact, { Employee, EmployeeAccount } from '@hcengineering/contact'
  import core, { Account, Ref } from '@hcengineering/core'
  import { IntlString } from '@hcengineering/platform'
-  import { createQuery, getClient, UserBoxList } from '@hcengineering/presentation'
+  import { createQuery, getClient } from '@hcengineering/presentation'
  import { ButtonKind } from '@hcengineering/ui'
+  import UserBoxList from './UserBoxList.svelte'

  export let label: IntlString
  export let value: Ref<Account>[]
--- a/plugins/contact-resources/src/components/AccountBox.svelte
+++ b/plugins/contact-resources/src/components/AccountBox.svelte
@ -16,10 +16,11 @@
  import { Employee, EmployeeAccount } from '@hcengineering/contact'
  import { Account, DocumentQuery, Ref } from '@hcengineering/core'
  import { IntlString } from '@hcengineering/platform'
-  import { createQuery, UserBox } from '@hcengineering/presentation'
+  import { createQuery } from '@hcengineering/presentation'
  import { ButtonKind, ButtonSize } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
  import contact from '../plugin'
+  import UserBox from './UserBox.svelte'

  export let label: IntlString = contact.string.Employee
  export let value: Ref<Account> | null | undefined
--- a/plugins/contact-resources/src/components/AddMembersPopup.svelte
+++ b/plugins/contact-resources/src/components/AddMembersPopup.svelte
@ -1,10 +1,10 @@
 <script lang="ts">
-  import contact, { Employee, EmployeeAccount, getName } from '@hcengineering/contact'
+  import { Employee, EmployeeAccount, getName } from '@hcengineering/contact'
  import core, { IdMap, Ref, Space } from '@hcengineering/core'
+  import presentation, { getClient } from '@hcengineering/presentation'
  import { ActionIcon, Button, IconClose, Label } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
-  import presentation from '../plugin'
-  import { getClient } from '../utils'
+  import contact from '../plugin'
  import UsersPopup from './UsersPopup.svelte'

  export let value: Space
@ -41,7 +41,7 @@
 <div class="antiPopup antiPopup-withHeader">
  <div class="ap-header flex-between header">
    <div class="ap-caption">
-      <Label label={presentation.string.AddMembersHeader} params={{ value: value.name }} />
+      <Label label={contact.string.AddMembersHeader} params={{ value: value.name }} />
    </div>
    <div class="tool">
      <ActionIcon
--- a/plugins/contact-resources/src/components/AssigneeBox.svelte
+++ b/plugins/contact-resources/src/components/AssigneeBox.svelte
@ -33,8 +33,10 @@
  } from '@hcengineering/ui'
  import view from '@hcengineering/view'
  import { createEventDispatcher } from 'svelte'
-  import presentation, { getClient, IconPerson, UserInfo } from '..'
+  import presentation, { getClient } from '@hcengineering/presentation'
  import AssigneePopup from './AssigneePopup.svelte'
+  import IconPerson from './icons/Person.svelte'
+  import UserInfo from './UserInfo.svelte'

  export let _class: Ref<Class<Employee>> = contact.class.Employee
  export let excluded: Ref<Contact>[] | undefined = undefined
--- a/plugins/contact-resources/src/components/AssigneePopup.svelte
+++ b/plugins/contact-resources/src/components/AssigneePopup.svelte
@ -28,15 +28,10 @@
    Label,
    tooltip
  } from '@hcengineering/ui'
-  import presentation, {
-    AssigneeCategory,
-    UserInfo,
-    assigneeCategoryOrder,
-    createQuery,
-    getCategorytitle,
-    getClient
-  } from '..'
+  import presentation, { createQuery, getClient } from '@hcengineering/presentation'
  import { createEventDispatcher } from 'svelte'
+  import { AssigneeCategory, assigneeCategoryOrder, getCategoryTitle } from '../assignee'
+  import UserInfo from './UserInfo.svelte'

  export let options: FindOptions<Contact> | undefined = undefined
  export let selected: Ref<Person> | undefined
@ -221,7 +216,7 @@
                      <Icon icon={cl.icon} size={'small'} />
                    {/if}
                    <div class="ml-1">
-                      <Label label={getCategorytitle(category)} />
+                      <Label label={getCategoryTitle(category)} />
                    </div>
                  </span>
                </div>
--- a/plugins/contact-resources/src/components/Avatar.svelte
+++ b/plugins/contact-resources/src/components/Avatar.svelte
@ -30,8 +30,9 @@
  import contact, { AvatarProvider, AvatarType } from '@hcengineering/contact'
  import { Client, Ref } from '@hcengineering/core'
  import { Asset, getResource } from '@hcengineering/platform'
+  import { getBlobURL, getClient } from '@hcengineering/presentation'
  import { AnySvelteComponent, Icon, IconSize } from '@hcengineering/ui'
-  import { getAvatarProviderId, getBlobURL, getClient } from '../utils'
+  import { getAvatarProviderId } from '../utils'
  import AvatarIcon from './icons/Avatar.svelte'

  export let avatar: string | null | undefined = undefined
--- a/plugins/contact-resources/src/components/CombineAvatars.svelte
+++ b/plugins/contact-resources/src/components/CombineAvatars.svelte
@ -14,10 +14,10 @@
 -->
 <script lang="ts">
  import type { Class, Doc, Ref } from '@hcengineering/core'
-  import { createQuery } from '../utils'
  import { Person as Contact } from '@hcengineering/contact'
  import Avatar from './Avatar.svelte'
  import { IconSize } from '@hcengineering/ui'
+  import { createQuery } from '@hcengineering/presentation'

  export let _class: Ref<Class<Doc>>
  export let items: Ref<Contact>[] = []
--- a/plugins/contact-resources/src/components/ContactList.svelte
+++ b/plugins/contact-resources/src/components/ContactList.svelte
@ -16,11 +16,14 @@
  import { Contact } from '@hcengineering/contact'
  import type { Class, DocumentQuery, Ref } from '@hcengineering/core'
  import type { IntlString } from '@hcengineering/platform'
-  import presentation, { CombineAvatars, createQuery, IconMembers, UsersPopup } from '@hcengineering/presentation'
+  import { createQuery } from '@hcengineering/presentation'
  import { Button, ButtonKind, ButtonSize, Label, showPopup, TooltipAlignment } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
  import { ContactPresenter } from '..'
  import contact from '../plugin'
+  import CombineAvatars from './CombineAvatars.svelte'
+  import IconMembers from './icons/Members.svelte'
+  import UsersPopup from './UsersPopup.svelte'

  export let items: Ref<Contact>[] = []
  export let _class: Ref<Class<Contact>> = contact.class.Contact
@ -90,7 +93,7 @@
        {:else}
          <CombineAvatars {_class} bind:items size={'inline'} />
          <span class="overflow-label ml-1-5">
-            <Label label={presentation.string.NumberMembers} params={{ count: contacts.length }} />
+            <Label label={contact.string.NumberMembers} params={{ count: contacts.length }} />
          </span>
        {/if}
      </div>
--- a/plugins/contact-resources/src/components/CreateEmployee.svelte
+++ b/plugins/contact-resources/src/components/CreateEmployee.svelte
@ -15,11 +15,12 @@
 <script lang="ts">
  import { Channel, combineName, Employee, findPerson, Person } from '@hcengineering/contact'
  import core, { AccountRole, AttachedData, Data, generateId, Ref } from '@hcengineering/core'
-  import { Card, EditableAvatar, getClient } from '@hcengineering/presentation'
+  import { Card, getClient } from '@hcengineering/presentation'
  import { EditBox, IconInfo, Label, createFocusManager, FocusHandler } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
  import { ChannelsDropdown } from '..'
  import contact from '../plugin'
+  import EditableAvatar from './EditableAvatar.svelte'
  import PersonPresenter from './PersonPresenter.svelte'

  export let canSave: boolean = true
--- a/plugins/contact-resources/src/components/CreateMember.svelte
+++ b/plugins/contact-resources/src/components/CreateMember.svelte
@ -15,10 +15,11 @@
 <script lang="ts">
  import { Organization, Person } from '@hcengineering/contact'
  import { Class, Ref, Space } from '@hcengineering/core'
-  import { Card, getClient, UserBox } from '@hcengineering/presentation'
+  import { Card, getClient } from '@hcengineering/presentation'
  import { createFocusManager, FocusHandler } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
  import contact from '../plugin'
+  import UserBox from './UserBox.svelte'

  export let organization: Ref<Organization>
  export let _class: Ref<Class<Organization>>
--- a/plugins/contact-resources/src/components/CreatePerson.svelte
+++ b/plugins/contact-resources/src/components/CreatePerson.svelte
@ -15,11 +15,12 @@
 <script lang="ts">
  import { Channel, combineName, findPerson, Person } from '@hcengineering/contact'
  import { AttachedData, Data, generateId } from '@hcengineering/core'
-  import { Card, EditableAvatar, getClient } from '@hcengineering/presentation'
+  import { Card, getClient } from '@hcengineering/presentation'
  import { EditBox, IconInfo, Label, createFocusManager, FocusHandler } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
  import { ChannelsDropdown } from '..'
  import contact from '../plugin'
+  import EditableAvatar from './EditableAvatar.svelte'
  import PersonPresenter from './PersonPresenter.svelte'

  let avatarEditor: EditableAvatar
--- a/plugins/contact-resources/src/components/EditAvatarPopup.svelte
+++ b/plugins/contact-resources/src/components/EditAvatarPopup.svelte
@ -17,7 +17,7 @@
  import { getResource } from '@hcengineering/platform'
  import { Button } from '@hcengineering/ui'
  import imageCropper from '@hcengineering/image-cropper'
-  import plugin from '../plugin'
+  import presentation from '@hcengineering/presentation'

  export let file: Blob
  let inputRef: HTMLInputElement
@ -67,13 +67,13 @@
    </div>
    <div class="footer">
      <div>
-        <Button label={plugin.string.Save} kind={'primary'} on:click={onCrop} />
+        <Button label={presentation.string.Save} kind={'primary'} on:click={onCrop} />
      </div>
      <div class="ml-4 mr-4">
-        <Button label={plugin.string.Change} on:click={selectAnother} />
+        <Button label={presentation.string.Change} on:click={selectAnother} />
      </div>
      <div>
-        <Button label={plugin.string.Remove} on:click={remove} />
+        <Button label={presentation.string.Remove} on:click={remove} />
      </div>
    </div>
  {/await}
--- a/plugins/contact-resources/src/components/EditEmployee.svelte
+++ b/plugins/contact-resources/src/components/EditEmployee.svelte
@ -17,12 +17,14 @@
  import { Employee, EmployeeAccount, getFirstName, getLastName, Person } from '@hcengineering/contact'
  import { AccountRole, getCurrentAccount, Ref, Space } from '@hcengineering/core'
  import { changeName } from '@hcengineering/login-resources'
-  import { AttributeEditor, Avatar, createQuery, EditableAvatar, getClient } from '@hcengineering/presentation'
+  import { AttributeEditor, createQuery, getClient } from '@hcengineering/presentation'
  import setting, { IntegrationType } from '@hcengineering/setting'
  import { createFocusManager, EditBox, FocusHandler } from '@hcengineering/ui'
  import { createEventDispatcher, onMount } from 'svelte'
  import contact from '../plugin'
+  import Avatar from './Avatar.svelte'
  import ChannelsEditor from './ChannelsEditor.svelte'
+  import EditableAvatar from './EditableAvatar.svelte'

  export let object: Employee
  const client = getClient()
--- a/plugins/contact-resources/src/components/EditPerson.svelte
+++ b/plugins/contact-resources/src/components/EditPerson.svelte
@ -16,12 +16,13 @@
 <script lang="ts">
  import { combineName, EmployeeAccount, getFirstName, getLastName, Person } from '@hcengineering/contact'
  import { getCurrentAccount, Ref, Space } from '@hcengineering/core'
-  import { AttributeEditor, createQuery, EditableAvatar, getClient } from '@hcengineering/presentation'
+  import { AttributeEditor, createQuery, getClient } from '@hcengineering/presentation'
  import setting, { IntegrationType } from '@hcengineering/setting'
  import { createFocusManager, EditBox, FocusHandler } from '@hcengineering/ui'
  import { createEventDispatcher, onMount } from 'svelte'
  import contact from '../plugin'
  import ChannelsEditor from './ChannelsEditor.svelte'
+  import EditableAvatar from './EditableAvatar.svelte'

  export let object: Person
  const client = getClient()
--- a/plugins/contact-resources/src/components/EditableAvatar.svelte
+++ b/plugins/contact-resources/src/components/EditableAvatar.svelte
@ -69,6 +69,7 @@
  }
 </script>

+<!-- svelte-ignore a11y-click-events-have-key-events -->
 <div class="cursor-pointer" on:click|self={showSelectionPopup}>
  <AvatarComponent
    avatar={selectedAvatarType === AvatarType.IMAGE ? selectedAvatar : `${selectedAvatarType}://${selectedAvatar}`}
--- a/plugins/contact-resources/src/components/EmployeeAccountPresenter.svelte
+++ b/plugins/contact-resources/src/components/EmployeeAccountPresenter.svelte
@ -17,11 +17,11 @@
  import { EmployeeAccount, getName } from '@hcengineering/contact'
  import { Account } from '@hcengineering/core'
  import { getEmbeddedLabel } from '@hcengineering/platform'
-  import { Avatar } from '@hcengineering/presentation'
  import { showPopup, tooltip } from '@hcengineering/ui'
  import { EditDoc } from '@hcengineering/view-resources'
  import DocNavLink from '@hcengineering/view-resources/src/components/DocNavLink.svelte'
  import { employeeByIdStore } from '../utils'
+  import Avatar from './Avatar.svelte'

  export let value: Account
  export let disabled = false
--- a/plugins/contact-resources/src/components/EmployeeArrayEditor.svelte
+++ b/plugins/contact-resources/src/components/EmployeeArrayEditor.svelte
@ -2,7 +2,7 @@
  import { Employee } from '@hcengineering/contact'
  import { Ref } from '@hcengineering/core'
  import { IntlString } from '@hcengineering/platform'
-  import { UserBoxList } from '@hcengineering/presentation'
+  import UserBoxList from './UserBoxList.svelte'

  export let label: IntlString
  export let value: Ref<Employee>[]
--- a/plugins/contact-resources/src/components/EmployeeBox.svelte
+++ b/plugins/contact-resources/src/components/EmployeeBox.svelte
@ -18,7 +18,7 @@
  import type { Class, DocumentQuery, FindOptions, Ref } from '@hcengineering/core'
  import type { IntlString } from '@hcengineering/platform'
  import { ButtonKind, ButtonSize, LabelAndProps } from '@hcengineering/ui'
-  import presentation from '..'
+  import presentation from '@hcengineering/presentation'
  import IconPerson from './icons/Person.svelte'
  import UserBox from './UserBox.svelte'

--- a/plugins/contact-resources/src/components/EmployeeEditor.svelte
+++ b/plugins/contact-resources/src/components/EmployeeEditor.svelte
@ -16,9 +16,9 @@
  import { Employee } from '@hcengineering/contact'
  import { DocumentQuery, Ref, RefTo } from '@hcengineering/core'
  import { IntlString } from '@hcengineering/platform'
-  import { EmployeeBox } from '@hcengineering/presentation'
  import contact from '../plugin'
  import { ButtonKind, ButtonSize } from '@hcengineering/ui'
+  import EmployeeBox from './EmployeeBox.svelte'

  export let value: Ref<Employee> | undefined
  export let label: IntlString = contact.string.Employee
--- a/plugins/contact-resources/src/components/EmployeePreviewPopup.svelte
+++ b/plugins/contact-resources/src/components/EmployeePreviewPopup.svelte
@ -1,7 +1,8 @@
 <script lang="ts">
  import { Employee, EmployeeAccount, getName, Status } from '@hcengineering/contact'
  import { getCurrentAccount, Ref } from '@hcengineering/core'
-  import { Avatar, createQuery, getClient } from '@hcengineering/presentation'
+  import { createQuery, getClient } from '@hcengineering/presentation'
+  import Avatar from './Avatar.svelte'
  import { Button, Label, resizeObserver, showPopup } from '@hcengineering/ui'
  import { DocNavLink } from '@hcengineering/view-resources'
  import { createEventDispatcher } from 'svelte'
--- a/plugins/contact-resources/src/components/EmployeeRefPresenter.svelte
+++ b/plugins/contact-resources/src/components/EmployeeRefPresenter.svelte
@ -1,11 +1,11 @@
 <script lang="ts">
  import { Employee } from '@hcengineering/contact'
  import { Ref } from '@hcengineering/core'
-  import { AssigneeBox } from '@hcengineering/presentation'
  import { ButtonKind } from '@hcengineering/ui'
  import { PersonLabelTooltip } from '..'
  import contact from '../plugin'
  import { employeeByIdStore } from '../utils'
+  import AssigneeBox from './AssigneeBox.svelte'
  import EmployeePresenter from './EmployeePresenter.svelte'

  export let value: Ref<Employee> | null | undefined
--- a/plugins/contact-resources/src/components/Members.svelte
+++ b/plugins/contact-resources/src/components/Members.svelte
@ -15,9 +15,10 @@
 <script lang="ts">
  import { Member } from '@hcengineering/contact'
  import type { Class, Doc, Ref, Space } from '@hcengineering/core'
-  import { createQuery, getClient, UsersPopup, IconMembersOutline } from '@hcengineering/presentation'
+  import { createQuery, getClient } from '@hcengineering/presentation'
  import { Button, IconAdd, Label, showPopup, Icon } from '@hcengineering/ui'
  import view, { Viewlet, ViewletPreference } from '@hcengineering/view'
+  import IconMembersOutline from './icons/MembersOutline.svelte'
  import {
    getViewOptions,
    setActiveViewletId,
@ -26,6 +27,7 @@
    viewOptionStore
  } from '@hcengineering/view-resources'
  import contact from '../plugin'
+  import UsersPopup from './UsersPopup.svelte'

  export let objectId: Ref<Doc>
  export let space: Ref<Space>
--- a/plugins/contact-resources/src/components/MembersBox.svelte
+++ b/plugins/contact-resources/src/components/MembersBox.svelte
@ -16,7 +16,9 @@
  import type { Space } from '@hcengineering/core'
  import type { IntlString } from '@hcengineering/platform'
  import { Icon, Label } from '@hcengineering/ui'
-  import plugin, { Members, IconMembersOutline } from '..'
+  import plugin from '../plugin'
+  import IconMembersOutline from './icons/MembersOutline.svelte'
+  import SpaceMembers from './SpaceMembers.svelte'

  export let label: IntlString = plugin.string.Members
  export let space: Space
@ -31,5 +33,5 @@
      <Label {label} />
    </span>
  </div>
-  <Members {space} />
+  <SpaceMembers {space} />
 </div>
--- a/plugins/contact-resources/src/components/MembersPresenter.svelte
+++ b/plugins/contact-resources/src/components/MembersPresenter.svelte
@ -17,9 +17,10 @@
  import { Button, showPopup, eventToHTMLElement } from '@hcengineering/ui'
  import type { ButtonKind, ButtonSize } from '@hcengineering/ui'
  import contact, { Employee } from '@hcengineering/contact'
-  import { getClient, UsersPopup } from '@hcengineering/presentation'
+  import { getClient } from '@hcengineering/presentation'
  import { IntlString, translate } from '@hcengineering/platform'
  import tracker from '../../../tracker-resources/src/plugin'
+  import UsersPopup from './UsersPopup.svelte'

  export let value: Doc
  export let kind: ButtonKind = 'no-border'
--- a/plugins/contact-resources/src/components/MergeEmployee.svelte
+++ b/plugins/contact-resources/src/components/MergeEmployee.svelte
@ -16,13 +16,15 @@
  import { Channel, ChannelProvider, Employee, getName } from '@hcengineering/contact'
  import core, { Doc, DocumentUpdate, Mixin, Ref, TxProcessor } from '@hcengineering/core'
  import { leaveWorkspace } from '@hcengineering/login-resources'
-  import { Avatar, Card, createQuery, EmployeeBox, getClient } from '@hcengineering/presentation'
+  import { Card, createQuery, getClient } from '@hcengineering/presentation'
  import { DatePresenter, Grid, Toggle } from '@hcengineering/ui'
  import { isCollectionAttr, StringEditor } from '@hcengineering/view-resources'
  import { createEventDispatcher } from 'svelte'
  import contact from '../plugin'
+  import Avatar from './Avatar.svelte'
  import ChannelPresenter from './ChannelPresenter.svelte'
  import ChannelsDropdown from './ChannelsDropdown.svelte'
+  import EmployeeBox from './EmployeeBox.svelte'
  import MergeAttributeComparer from './MergeAttributeComparer.svelte'
  import MergeComparer from './MergeComparer.svelte'

--- a/plugins/contact-resources/src/components/OrganizationCard.svelte
+++ b/plugins/contact-resources/src/components/OrganizationCard.svelte
@ -15,7 +15,8 @@
 <script lang="ts">
  import attachment from '@hcengineering/attachment'
  import { Channel, Organization } from '@hcengineering/contact'
-  import { Avatar, createQuery } from '@hcengineering/presentation'
+  import { createQuery } from '@hcengineering/presentation'
+  import Avatar from './Avatar.svelte'
  import { Component, Label } from '@hcengineering/ui'
  import { DocNavLink } from '@hcengineering/view-resources'
  import contact from '../plugin'
--- a/plugins/contact-resources/src/components/OrganizationEditor.svelte
+++ b/plugins/contact-resources/src/components/OrganizationEditor.svelte
@ -16,7 +16,7 @@
  import { Organization } from '@hcengineering/contact'
  import { Ref } from '@hcengineering/core'
  import { IntlString } from '@hcengineering/platform'
-  import { UserBox } from '@hcengineering/presentation'
+  import UserBox from './UserBox.svelte'
  import type { ButtonKind, ButtonSize } from '@hcengineering/ui'
  import contact from '../plugin'

--- a/plugins/contact-resources/src/components/PersonCard.svelte
+++ b/plugins/contact-resources/src/components/PersonCard.svelte
@ -15,7 +15,8 @@
 <script lang="ts">
  import attachment from '@hcengineering/attachment'
  import contact, { Channel, Contact, getName } from '@hcengineering/contact'
-  import { Avatar, createQuery } from '@hcengineering/presentation'
+  import { createQuery } from '@hcengineering/presentation'
+  import Avatar from './Avatar.svelte'
  import { Component, Label } from '@hcengineering/ui'
  import { DocNavLink } from '@hcengineering/view-resources'
  import ChannelsEditor from './ChannelsEditor.svelte'
--- a/plugins/contact-resources/src/components/PersonContent.svelte
+++ b/plugins/contact-resources/src/components/PersonContent.svelte
@ -15,9 +15,9 @@
 <script lang="ts">
  import { Employee, getName, Person } from '@hcengineering/contact'
  import { IntlString } from '@hcengineering/platform'
-  import { Avatar } from '@hcengineering/presentation'
  import { Label, LabelAndProps, tooltip } from '@hcengineering/ui'
  import { DocNavLink } from '@hcengineering/view-resources'
+  import Avatar from './Avatar.svelte'

  export let value: Person | Employee | undefined | null
  export let inline: boolean = false
--- a/plugins/contact-resources/src/components/PersonEditor.svelte
+++ b/plugins/contact-resources/src/components/PersonEditor.svelte
@ -16,9 +16,9 @@
  import { Person } from '@hcengineering/contact'
  import { Ref, RefTo } from '@hcengineering/core'
  import { IntlString } from '@hcengineering/platform'
-  import { UserBox } from '@hcengineering/presentation'
  import contact from '../plugin'
  import { ButtonKind, ButtonSize } from '@hcengineering/ui'
+  import UserBox from './UserBox.svelte'

  export let value: Ref<Person> | undefined
  export let label: IntlString = contact.string.Person
--- a/plugins/contact-resources/src/components/PersonPresenter.svelte
+++ b/plugins/contact-resources/src/components/PersonPresenter.svelte
@ -14,8 +14,7 @@
 -->
 <script lang="ts">
  import { getName, Person } from '@hcengineering/contact'
-  import { IntlString } from '@hcengineering/platform'
-  import presentation from '@hcengineering/presentation'
+  import { getEmbeddedLabel, IntlString } from '@hcengineering/platform'
  import { LabelAndProps } from '@hcengineering/ui'
  import { PersonLabelTooltip } from '..'
  import PersonContent from './PersonContent.svelte'
@ -42,17 +41,16 @@
      return !value
        ? undefined
        : {
-            label: presentation.string.InltPropsValue,
-            props: { value: getName(value) }
+            label: getEmbeddedLabel(getName(value))
          }
    }
    const component = value ? tooltipLabels.component : undefined
    const label = value
      ? tooltipLabels.personLabel
        ? tooltipLabels.personLabel
-        : presentation.string.InltPropsValue
+        : getEmbeddedLabel(getName(value))
      : undefined
-    const props = tooltipLabels.props ? tooltipLabels.props : value ? { value: getName(value) } : undefined
+    const props = tooltipLabels.props ? tooltipLabels.props : undefined
    return {
      component,
      label,
--- a/plugins/contact-resources/src/components/SelectAvatarPopup.svelte
+++ b/plugins/contact-resources/src/components/SelectAvatarPopup.svelte
@ -19,11 +19,11 @@
  import { Asset } from '@hcengineering/platform'
  import { AnySvelteComponent, DropdownLabelsIntl, Label, showPopup } from '@hcengineering/ui'

-  import presentation from '..'
-  import { getAvatarTypeDropdownItems, getFileUrl } from '../utils'
+  import contact from '../plugin'
  import AvatarComponent from './Avatar.svelte'
-  import Card from './Card.svelte'
  import EditAvatarPopup from './EditAvatarPopup.svelte'
+  import { getAvatarTypeDropdownItems } from '../utils'
+  import presentation, { Card, getFileUrl } from '@hcengineering/presentation'

  export let avatar: string | undefined
  export let email: string | undefined
@ -149,7 +149,7 @@
 </script>

 <Card
-  label={presentation.string.SelectAvatar}
+  label={contact.string.SelectAvatar}
  okLabel={presentation.string.Save}
  canSave={selectedAvatarType !== initialSelectedType ||
    selectedAvatar !== initialSelectedAvatar ||
@ -162,11 +162,12 @@
 >
  <DropdownLabelsIntl
    items={getAvatarTypeDropdownItems(hasGravatar)}
-    label={presentation.string.SelectAvatar}
+    label={contact.string.SelectAvatar}
    bind:selected={selectedAvatarType}
    on:selected={handleDropdownSelection}
  />
  {#if selectedAvatarType === AvatarType.IMAGE}
+    <!-- svelte-ignore a11y-click-events-have-key-events -->
    <div class="cursor-pointer" on:click|self={handleImageAvatarClick}>
      <AvatarComponent avatar={selectedAvatar} direct={selectedFile} size={'x-large'} {icon} />
    </div>
@ -175,7 +176,7 @@
  {/if}
  {#if selectedAvatarType === AvatarType.GRAVATAR}
    <span>
-      <Label label={presentation.string.GravatarsManaged} />
+      <Label label={contact.string.GravatarsManaged} />
      <a target="”_blank”" href="//gravatar.com">Gravatar.com</a>
    </span>
  {/if}
--- a/plugins/contact-resources/src/components/SpaceMembers.svelte
+++ b/plugins/contact-resources/src/components/SpaceMembers.svelte
@ -15,18 +15,15 @@
 <script lang="ts">
  import contact, { Employee, EmployeeAccount } from '@hcengineering/contact'
  import { Account, AccountRole, DocumentQuery, getCurrentAccount, Ref, SortingOrder, Space } from '@hcengineering/core'
-  import login from '@hcengineering/login'
  import { translate } from '@hcengineering/platform'
-  import setting from '@hcengineering/setting'
+  import { getClient } from '@hcengineering/presentation'
  import { ActionIcon, IconAdd, IconClose, Label, SearchEdit, showPopup } from '@hcengineering/ui'
-  import presentation from '../plugin'
-  import { getClient } from '../utils'
+  import presentation from '@hcengineering/presentation'
  import AddMembersPopup from './AddMembersPopup.svelte'
  import UserInfo from './UserInfo.svelte'

  export let space: Space
  export let withAddButton: boolean = false
-  export let withInviteWorkspaceButton: boolean = false

  const client = getClient()
  const hierarchy = client.getHierarchy()
@ -69,10 +66,6 @@
    await client.update(space, { $pull: { members: account._id } })
  }

-  function inviteWorkspace (): void {
-    showPopup(login.component.InviteLink, {})
-  }
-
  function openAddMembersPopup () {
    showPopup(AddMembersPopup, { value: space }, undefined, async (membersIds: Ref<EmployeeAccount>[]) => {
      if (membersIds) {
@ -145,13 +138,6 @@
    {/if}
  {/if}
 {/await}
-{#if withInviteWorkspaceButton}
-  <div class="item fs-title mb-4 mt-2">
-    <div class="flex-row-center p-1" on:click={inviteWorkspace}>
-      <Label label={setting.string.InviteWorkspace} />
-    </div>
-  </div>
-{/if}

 <style lang="scss">
  .notIn {
--- a/plugins/contact-resources/src/components/UserBox.svelte
+++ b/plugins/contact-resources/src/components/UserBox.svelte
@ -17,6 +17,7 @@
  import { Contact, getName } from '@hcengineering/contact'
  import { Class, DocumentQuery, FindOptions, Hierarchy, Ref } from '@hcengineering/core'
  import { Asset, getEmbeddedLabel, IntlString } from '@hcengineering/platform'
+  import { getClient, ObjectCreate } from '@hcengineering/presentation'
  import {
    ActionIcon,
    AnySvelteComponent,
@ -35,9 +36,7 @@
  } from '@hcengineering/ui'
  import view from '@hcengineering/view'
  import { createEventDispatcher } from 'svelte'
-  import presentation from '..'
-  import { ObjectCreate } from '../types'
-  import { getClient } from '../utils'
+  import presentation from '@hcengineering/presentation'
  import IconPerson from './icons/Person.svelte'
  import UserInfo from './UserInfo.svelte'
  import UsersPopup from './UsersPopup.svelte'
--- a/plugins/contact-resources/src/components/UserBoxList.svelte
+++ b/plugins/contact-resources/src/components/UserBoxList.svelte
@ -18,9 +18,12 @@
  import type { IntlString } from '@hcengineering/platform'
  import { Button, ButtonKind, ButtonSize, Label, showPopup, TooltipAlignment } from '@hcengineering/ui'
  import { createEventDispatcher } from 'svelte'
-  import presentation, { CombineAvatars, UserInfo, UsersPopup } from '..'
-  import { createQuery } from '../utils'
+  import { createQuery } from '@hcengineering/presentation'
  import Members from './icons/Members.svelte'
+  import UsersPopup from './UsersPopup.svelte'
+  import UserInfo from './UserInfo.svelte'
+  import CombineAvatars from './CombineAvatars.svelte'
+  import plugin from '../plugin'

  export let items: Ref<Employee>[] = []
  export let _class: Ref<Class<Employee>> = contact.class.Employee
@ -34,7 +37,7 @@
  export let justify: 'left' | 'center' = 'center'
  export let width: string | undefined = undefined
  export let labelDirection: TooltipAlignment | undefined = undefined
-  export let emptyLabel = presentation.string.Members
+  export let emptyLabel = plugin.string.Members
  export let readonly: boolean = false

  let persons: Employee[] = []
@ -90,7 +93,7 @@
        {:else}
          <CombineAvatars {_class} bind:items size={'inline'} />
          <span class="overflow-label ml-1-5">
-            <Label label={presentation.string.NumberMembers} params={{ count: persons.length }} />
+            <Label label={plugin.string.NumberMembers} params={{ count: persons.length }} />
          </span>
        {/if}
      </div>
--- a/plugins/contact-resources/src/components/UserInfo.svelte
+++ b/plugins/contact-resources/src/components/UserInfo.svelte
--- a/plugins/contact-resources/src/components/UsersPopup.svelte
+++ b/plugins/contact-resources/src/components/UsersPopup.svelte
@ -16,12 +16,9 @@
  import { Contact, getFirstName, Person } from '@hcengineering/contact'
  import type { Class, Doc, DocumentQuery, FindOptions, Ref } from '@hcengineering/core'
  import type { Asset, IntlString } from '@hcengineering/platform'
+  import presentation, { getClient, ObjectCreate, ObjectPopup } from '@hcengineering/presentation'
  import { AnySvelteComponent, Icon, Label } from '@hcengineering/ui'
-  import presentation from '..'
-  import { getClient } from '../utils'
-  import ObjectPopup from './ObjectPopup.svelte'
  import UserInfo from './UserInfo.svelte'
-  import { ObjectCreate } from '../types'

  export let _class: Ref<Class<Contact>>
  export let options: FindOptions<Contact> | undefined = undefined
--- a/plugins/contact-resources/src/components/icons/Avatar.svelte
+++ b/plugins/contact-resources/src/components/icons/Avatar.svelte
--- a/plugins/contact-resources/src/components/icons/Members.svelte
+++ b/plugins/contact-resources/src/components/icons/Members.svelte
--- a/plugins/contact-resources/src/components/icons/MembersOutline.svelte
+++ b/plugins/contact-resources/src/components/icons/MembersOutline.svelte
--- a/plugins/contact-resources/src/components/icons/Person.svelte
+++ b/plugins/contact-resources/src/components/icons/Person.svelte
--- a/plugins/contact-resources/src/index.ts
+++ b/plugins/contact-resources/src/index.ts
@ -18,10 +18,11 @@ import { Channel, Contact, Employee, getGravatarUrl, getName } from '@hcengineer
 import { Class, Client, DocumentQuery, Ref, RelatedDocument, WithLookup } from '@hcengineering/core'
 import { leaveWorkspace } from '@hcengineering/login-resources'
 import { IntlString, Resources } from '@hcengineering/platform'
-import { Avatar, getClient, getFileUrl, MessageBox, ObjectSearchResult, UserInfo } from '@hcengineering/presentation'
+import { getClient, getFileUrl, MessageBox, ObjectSearchResult } from '@hcengineering/presentation'
 import { AnyComponent, AnySvelteComponent, showPopup } from '@hcengineering/ui'
 import AccountArrayEditor from './components/AccountArrayEditor.svelte'
 import AccountBox from './components/AccountBox.svelte'
+import Avatar from './components/Avatar.svelte'
 import ChannelFilter from './components/ChannelFilter.svelte'
 import Channels from './components/Channels.svelte'
 import ChannelsDropdown from './components/ChannelsDropdown.svelte'
@ -36,6 +37,7 @@ import ContactsTabs from './components/ContactsTabs.svelte'
 import CreateEmployee from './components/CreateEmployee.svelte'
 import CreateOrganization from './components/CreateOrganization.svelte'
 import CreatePerson from './components/CreatePerson.svelte'
+import EditableAvatar from './components/EditableAvatar.svelte'
 import EditEmployee from './components/EditEmployee.svelte'
 import EditMember from './components/EditMember.svelte'
 import EditOrganization from './components/EditOrganization.svelte'
@ -47,6 +49,7 @@ import EmployeeBrowser from './components/EmployeeBrowser.svelte'
 import EmployeeEditor from './components/EmployeeEditor.svelte'
 import EmployeePresenter from './components/EmployeePresenter.svelte'
 import EmployeeRefPresenter from './components/EmployeeRefPresenter.svelte'
+import ExpandRightDouble from './components/icons/ExpandRightDouble.svelte'
 import MemberPresenter from './components/MemberPresenter.svelte'
 import Members from './components/Members.svelte'
 import MembersPresenter from './components/MembersPresenter.svelte'
@ -57,7 +60,15 @@ import PersonEditor from './components/PersonEditor.svelte'
 import PersonPresenter from './components/PersonPresenter.svelte'
 import PersonRefPresenter from './components/PersonRefPresenter.svelte'
 import SocialEditor from './components/SocialEditor.svelte'
-import ExpandRightDouble from './components/icons/ExpandRightDouble.svelte'
+import UserInfo from './components/UserInfo.svelte'
+import UserBox from './components/UserBox.svelte'
+import AssigneeBox from './components/AssigneeBox.svelte'
+import UsersPopup from './components/UsersPopup.svelte'
+import EmployeeBox from './components/EmployeeBox.svelte'
+import UserBoxList from './components/UserBoxList.svelte'
+import SpaceMembers from './components/SpaceMembers.svelte'
+import CombineAvatars from './components/CombineAvatars.svelte'
+
 import contact from './plugin'
 import {
  employeeSort,
@ -90,7 +101,17 @@ export {
  AccountArrayEditor,
  AccountBox,
  CreateOrganization,
-  ExpandRightDouble
+  ExpandRightDouble,
+  EditableAvatar,
+  UserBox,
+  AssigneeBox,
+  Avatar,
+  UsersPopup,
+  EmployeeBox,
+  UserBoxList,
+  Members,
+  SpaceMembers,
+  CombineAvatars
 }

 const toObjectSearchResult = (e: WithLookup<Contact>): ObjectSearchResult => ({
@ -227,7 +248,9 @@ export default async (): Promise<Resources> => ({
    CreateEmployee,
    AccountArrayEditor,
    ChannelFilter,
-    MergeEmployee
+    MergeEmployee,
+    Avatar,
+    UserBoxList
  },
  completion: {
    EmployeeQuery: async (
--- a/plugins/contact-resources/src/plugin.ts
+++ b/plugins/contact-resources/src/plugin.ts
@ -55,6 +55,7 @@ export default mergeIds(contactId, contact, {
    ViewFullProfile: '' as IntlString,
    Member: '' as IntlString,
    Members: '' as IntlString,
+    NumberMembers: '' as IntlString,
    NoMembers: '' as IntlString,
    AddMember: '' as IntlString,
    KickEmployee: '' as IntlString,
@ -64,7 +65,18 @@ export default mergeIds(contactId, contact, {
    Inactive: '' as IntlString,
    NotSpecified: '' as IntlString,
    MergeEmployee: '' as IntlString,
-    DisplayName: '' as IntlString
+    DisplayName: '' as IntlString,
+    SelectAvatar: '' as IntlString,
+    GravatarsManaged: '' as IntlString,
+
+    CategoryProjectMembers: '' as IntlString,
+    AddMembersHeader: '' as IntlString,
+    Assigned: '' as IntlString,
+    Unassigned: '' as IntlString,
+    CategoryCurrentUser: '' as IntlString,
+    CategoryPreviousAssigned: '' as IntlString,
+    CategoryProjectLead: '' as IntlString,
+    CategoryOther: '' as IntlString
  },
  function: {
    GetContactLink: '' as Resource<(doc: Doc, props: Record<string, any>) => Promise<Location>>,
--- a/plugins/contact-resources/src/utils.ts
+++ b/plugins/contact-resources/src/utils.ts
@ -15,6 +15,8 @@
 //

 import {
+  AvatarProvider,
+  AvatarType,
  ChannelProvider,
  Contact,
  contactId,
@ -26,17 +28,16 @@ import {
 import { Doc, getCurrentAccount, IdMap, ObjQueryType, Ref, Timestamp, toIdMap } from '@hcengineering/core'
 import { createQuery, getClient } from '@hcengineering/presentation'
 import { TemplateDataProvider } from '@hcengineering/templates'
-import { getCurrentLocation, getPanelURI, Location, ResolvedLocation } from '@hcengineering/ui'
+import { DropdownIntlItem, getCurrentLocation, getPanelURI, Location, ResolvedLocation } from '@hcengineering/ui'
 import view, { Filter } from '@hcengineering/view'
 import { FilterQuery } from '@hcengineering/view-resources'
 import { get, writable } from 'svelte/store'
 import contact from './plugin'

 const client = getClient()
-const channelProviders = client.findAll(contact.class.ChannelProvider, {})

 export async function getChannelProviders (): Promise<Map<Ref<ChannelProvider>, ChannelProvider>> {
-  const cp = await channelProviders
+  const cp = await client.findAll(contact.class.ChannelProvider, {})
  const map = new Map<Ref<ChannelProvider>, ChannelProvider>()
  for (const provider of cp) {
    map.set(provider._id, provider)
@ -191,3 +192,41 @@ query.query(contact.class.Employee, {}, (res) => {
  employeesStore.set(res)
  employeeByIdStore.set(toIdMap(res))
 })
+
+export function getAvatarTypeDropdownItems (hasGravatar: boolean): DropdownIntlItem[] {
+  return [
+    {
+      id: AvatarType.COLOR,
+      label: contact.string.UseColor
+    },
+    {
+      id: AvatarType.IMAGE,
+      label: contact.string.UseImage
+    },
+    ...(hasGravatar
+      ? [
+          {
+            id: AvatarType.GRAVATAR,
+            label: contact.string.UseGravatar
+          }
+        ]
+      : [])
+  ]
+}
+
+export function getAvatarProviderId (avatar?: string | null): Ref<AvatarProvider> | undefined {
+  if (avatar === null || avatar === undefined || avatar === '') {
+    return
+  }
+  if (!avatar.includes('://')) {
+    return contact.avatarProvider.Image
+  }
+  const [schema] = avatar.split('://')
+
+  switch (schema) {
+    case AvatarType.GRAVATAR:
+      return contact.avatarProvider.Gravatar
+    case AvatarType.COLOR:
+      return contact.avatarProvider.Color
+  }
+}
--- a/plugins/contact/src/index.ts
+++ b/plugins/contact/src/index.ts
@ -179,7 +179,9 @@ export const contactPlugin = plugin(contactId, {
    CreateOrganization: '' as AnyComponent,
    CreatePerson: '' as AnyComponent,
    ChannelsPresenter: '' as AnyComponent,
-    MembersPresenter: '' as AnyComponent
+    MembersPresenter: '' as AnyComponent,
+    Avatar: '' as AnyComponent,
+    UserBoxList: '' as AnyComponent
  },
  channelProvider: {
    Email: '' as Ref<ChannelProvider>,
--- a/plugins/document-resources/package.json
+++ b/plugins/document-resources/package.json
@ -49,6 +49,7 @@
    "@hcengineering/login": "^0.6.1",
    "@hcengineering/contact": "^0.6.11",
    "@hcengineering/tags": "^0.6.3",
-    "@hcengineering/text-editor": "^0.6.0"
+    "@hcengineering/text-editor": "^0.6.0",
+    "@hcengineering/contact-resources": "^0.6.0"
  }
 }
--- a/Show More
+++ b/Show More