UBERF-6464: update activity mentions display (#5339)

plugins/activity-resources/src/activityMessagesUtils.ts

@@ -562,19 +562,6 @@ export async function getLinkData (
   }
 }
 
-export async function getMessageFragment (doc: Doc): Promise<string> {
-  const client = getClient()
-  const hierarchy = client.getHierarchy()
-  let clazz = hierarchy.getClass(doc._class)
-  let label = clazz.shortLabel
-  while (label === undefined && clazz.extends !== undefined) {
-    clazz = hierarchy.getClass(clazz.extends)
-    label = clazz.shortLabel
-  }
-  label = label ?? doc._class
-  return `${label}-${doc._id}`
-}
-
 function isDocUpdateMessage (message?: ActivityMessage): message is DocUpdateMessage {
   if (message === undefined) {
     return false
@@ -583,6 +570,14 @@ function isDocUpdateMessage (message?: ActivityMessage): message is DocUpdateMes
   return message._class === activity.class.DocUpdateMessage
 }
 
+export function isActivityMessage (message?: Doc): message is ActivityMessage {
+  if (message === undefined) {
+    return false
+  }
+
+  return getClient().getHierarchy().isDerived(message._class, activity.class.ActivityMessage)
+}
+
 export function isReactionMessage (message?: ActivityMessage): boolean {
   if (message === undefined) {
     return false

plugins/activity-resources/src/components/activity-reference/ActivityReferencePresenter.svelte

@@ -110,6 +110,7 @@
   {skipLabel}
   {hoverable}
   {hoverStyles}
+  showDatePreposition
   {onClick}
   {onReply}
 >
@@ -131,13 +132,8 @@
       {/if}
       {#if srcDoc}
         <span class="text-sm lower"><Label label={activity.string.In} /></span>
-        <DocNavLink object={srcDoc} component={srcDocPanel?.component ?? view.component.EditDoc} shrink={0}>
-          <span class="text-sm">
-            <ReferenceSrcPresenter
-              {value}
-              inline={hierarchy.isDerived(srcDoc._class, activity.class.ActivityMessage)}
-            />
-          </span>
+        <DocNavLink object={srcDoc} component={srcDocPanel?.component ?? view.component.EditDoc} shrink={0} noUnderline>
+          <ReferenceSrcPresenter value={srcDoc} />
         </DocNavLink>
       {/if}
     </span>
@@ -151,6 +147,8 @@
 
 <style lang="scss">
   .header {
-    gap: var(--global-spacing-1);
+    display: flex;
+    align-items: center;
+    gap: var(--spacing-0_5);
   }
 </style>

plugins/activity-resources/src/components/activity-reference/ReferenceSrcPresenter.svelte

@@ -14,33 +14,36 @@
 -->
 <script lang="ts">
   import type { Doc } from '@hcengineering/core'
-  import { createQuery, getClient } from '@hcengineering/presentation'
-  import { AttributeModel } from '@hcengineering/view'
-  import { getObjectPresenter } from '@hcengineering/view-resources'
-  import { ActivityReference } from '@hcengineering/activity'
+  import { getClient } from '@hcengineering/presentation'
+  import { DocReferencePresenter } from '@hcengineering/view-resources'
+  import activity from '../../plugin'
 
-  export let value: ActivityReference
-  export let inline = true
+  import { isActivityMessage } from '../../activityMessagesUtils'
+  import view from '@hcengineering/view'
+  import { Icon, Label } from '@hcengineering/ui'
+
+  export let value: Doc | undefined
 
   const client = getClient()
-  const srcDocQuery = createQuery()
 
-  let srcDoc: Doc | undefined
-  let presenter: AttributeModel | undefined
+  let parentObject: Doc | undefined
 
-  $: srcDocQuery.query(value.srcDocClass, { _id: value.srcDocId }, (r) => {
-    srcDoc = r.shift()
-  })
+  $: showParent = isActivityMessage(value)
 
-  $: if (srcDoc !== undefined) {
-    void getObjectPresenter(client, srcDoc._class, { key: '' }).then((result) => {
-      presenter = result
+  $: isActivityMessage(value) &&
+    client.findOne(value.attachedToClass, { _id: value.attachedTo }).then((res) => {
+      parentObject = res
     })
-  }
 </script>
 
-{#if presenter}
-  <span class="labels-row">
-    <svelte:component this={presenter.presenter} value={srcDoc} {inline} embedded shouldShowAvatar={false} />
-  </span>
-{/if}
+<DocReferencePresenter value={showParent ? parentObject : value} compact={showParent}>
+  <svelte:fragment slot="prefix">
+    {#if showParent}
+      <span class="nowrap flex-presenter flex-gap-1 lower ml-2">
+        <Icon icon={view.icon.Bubble} size="x-small" />
+        <Label label={activity.string.Thread} />
+        <Label label={activity.string.In} />
+      </span>
+    {/if}
+  </svelte:fragment>
+</DocReferencePresenter>

plugins/activity-resources/src/index.ts

@@ -26,13 +26,7 @@ import DocUpdateMessagePreview from './components/doc-update-message/DocUpdateMe
 import ActivityReferencePreview from './components/activity-reference/ActivityReferencePreview.svelte'
 import ActivityInfoMessagePreview from './components/activity-info-message/ActivityInfoMessagePreview.svelte'
 
-import {
-  getMessageFragment,
-  attributesFilter,
-  pinnedFilter,
-  allFilter,
-  referencesFilter
-} from './activityMessagesUtils'
+import { attributesFilter, pinnedFilter, allFilter, referencesFilter } from './activityMessagesUtils'
 import { updateReferences } from './references'
 
 export * from './activity'
@@ -76,9 +70,6 @@ export default async (): Promise<Resources> => ({
     AllFilter: allFilter,
     ReferencesFilter: referencesFilter
   },
-  function: {
-    GetFragment: getMessageFragment
-  },
   backreference: {
     Update: updateReferences
   }