Tracker: Issue List – Assignee presenter (#1384)

Signed-off-by: Artyom Grigorovich <grigorovichartyom@gmail.com>

plugins/tracker-resources/src/components/issues/AssigneePresenter.svelte

@@ -0,0 +1,70 @@
+<!--
+// Copyright © 2022 Hardcore Engineering Inc.
+// 
+// Licensed under the Eclipse Public License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License. You may
+// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
+// 
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// 
+// See the License for the specific language governing permissions and
+// limitations under the License.
+-->
+<script lang="ts">
+  import contact, { Employee, formatName } from '@anticrm/contact'
+  import { Ref, WithLookup } from '@anticrm/core'
+  import { Issue, Team } from '@anticrm/tracker'
+  import { Avatar, UsersPopup, getClient } from '@anticrm/presentation'
+  import { showPopup, Tooltip } from '@anticrm/ui'
+
+  import tracker from '../../plugin'
+
+  export let value: WithLookup<Issue>
+  export let currentSpace: Ref<Team> | undefined = undefined
+
+  $: employee = value?.$lookup?.assignee as Employee | undefined
+  $: avatar = employee?.avatar
+  $: formattedName = employee?.name ? formatName(employee.name) : ''
+
+  const client = getClient()
+
+  const handleAssigneeChanged = async (result: Employee | null | undefined) => {
+    if (result === undefined) {
+      return
+    }
+
+    const currentIssue = await client.findOne(tracker.class.Issue, { space: currentSpace, _id: value._id })
+
+    if (currentIssue === undefined) {
+      return
+    }
+
+    const newAssignee = result === null ? null : result._id
+
+    await client.update(currentIssue, { assignee: newAssignee })
+  }
+
+  const handleAssigneeEditorOpened = async (event: Event) => {
+    showPopup(
+      UsersPopup,
+      {
+        _class: contact.class.Employee,
+        selected: employee?._id,
+        allowDeselect: true,
+        placeholder: tracker.string.AssignTo
+      },
+      event.target,
+      handleAssigneeChanged
+    )
+  }
+</script>
+
+<Tooltip label={employee ? tracker.string.AssignedTo : tracker.string.AssignTo} props={{ value: formattedName }}>
+  <div class="flex-presenter" on:click={handleAssigneeEditorOpened}>
+    <div class="icon">
+      <Avatar size={'x-small'} {avatar} />
+    </div>
+  </div>
+</Tooltip>

plugins/tracker-resources/src/components/issues/CategoryPresenter.svelte

@@ -55,14 +55,7 @@
         { key: '', presenter: tracker.component.StatusPresenter, props: { currentSpace } },
         { key: '', presenter: tracker.component.TitlePresenter },
         { key: 'modifiedOn', presenter: tracker.component.ModificationDatePresenter },
-        {
+        { key: '', presenter: tracker.component.AssigneePresenter, props: { currentSpace } }
-          key: '$lookup.assignee',
-          props: {
-            shouldShowName: false,
-            shouldShowPlaceholder: true,
-            tooltipLabels: { personLabel: tracker.string.AssignedTo, placeholderLabel: tracker.string.AssignTo }
-          }
-        }
       ]}
       {options}
       query={{ ...query, status: category }}

plugins/tracker-resources/src/index.ts

@@ -29,6 +29,7 @@ import IssuePresenter from './components/issues/IssuePresenter.svelte'
 import TitlePresenter from './components/issues/TitlePresenter.svelte'
 import PriorityPresenter from './components/issues/PriorityPresenter.svelte'
 import StatusPresenter from './components/issues/StatusPresenter.svelte'
+import AssigneePresenter from './components/issues/AssigneePresenter.svelte'
 
 import ModificationDatePresenter from './components/issues/ModificationDatePresenter.svelte'
 import EditIssue from './components/issues/EditIssue.svelte'
@@ -50,6 +51,7 @@ export default async (): Promise<Resources> => ({
     ModificationDatePresenter,
     PriorityPresenter,
     StatusPresenter,
+    AssigneePresenter,
     EditIssue,
     NewIssueHeader
   }

plugins/tracker-resources/src/plugin.ts

@@ -98,6 +98,7 @@ export default mergeIds(trackerId, tracker, {
     ModificationDatePresenter: '' as AnyComponent,
     PriorityPresenter: '' as AnyComponent,
     StatusPresenter: '' as AnyComponent,
+    AssigneePresenter: '' as AnyComponent,
     EditIssue: '' as AnyComponent,
     CreateTeam: '' as AnyComponent,
     NewIssueHeader: '' as AnyComponent