UBERF-5495: load all messages for inbox with one query (#4628)

Signed-off-by: Kristina Fefelova <kristin.fefelova@gmail.com>

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

@@ -103,13 +103,6 @@
       </div>
     {:else}
       <div class="header">
-        <!--      <CheckBox-->
-        <!--        circle-->
-        <!--        kind="primary"-->
-        <!--        on:value={(event) => {-->
-        <!--          dispatch('check', event.detail)-->
-        <!--        }}-->
-        <!--      />-->
         <NotifyContextIcon {value} />
 
         {#if presenterMixin?.labelPresenter}

plugins/notification-resources/src/components/inbox/ActivityInboxNotificationPresenter.svelte

@@ -13,8 +13,8 @@
 // limitations under the License.
 -->
 <script lang="ts">
-  import { createQuery, getClient } from '@hcengineering/presentation'
-  import { matchQuery, Ref, SortingOrder } from '@hcengineering/core'
+  import { getClient } from '@hcengineering/presentation'
+  import { matchQuery, Ref } from '@hcengineering/core'
   import notification, {
     ActivityInboxNotification,
     ActivityNotificationViewlet,
@@ -22,12 +22,12 @@
     InboxNotification
   } from '@hcengineering/notification'
   import { ActivityMessagePresenter, combineActivityMessages } from '@hcengineering/activity-resources'
-  import activity, { ActivityMessage, DisplayActivityMessage } from '@hcengineering/activity'
+  import { ActivityMessage, DisplayActivityMessage } from '@hcengineering/activity'
   import { location, Action, Component } from '@hcengineering/ui'
   import { getActions } from '@hcengineering/view-resources'
   import { getResource } from '@hcengineering/platform'
 
-  import { InboxNotificationsClientImpl } from '../../inboxNotificationsClient'
+  import { inboxMessagesStore, InboxNotificationsClientImpl } from '../../inboxNotificationsClient'
   import { openInboxDoc } from '../../utils'
 
   export let value: DisplayActivityInboxNotification
@@ -40,7 +40,6 @@
   export let onClick: (() => void) | undefined = undefined
 
   const client = getClient()
-  const messagesQuery = createQuery()
   const inboxClient = InboxNotificationsClientImpl.getClient()
   const notificationsStore = inboxClient.inboxNotifications
 
@@ -58,20 +57,15 @@
   ) as ActivityInboxNotification[]
 
   $: messageIds = combinedNotifications.map(({ attachedTo }) => attachedTo)
-  $: messagesQuery.query(
-    activity.class.ActivityMessage,
-    { _id: { $in: messageIds } },
-    (res) => {
-      combineActivityMessages(res).then((m) => {
-        displayMessage = m[0]
-      })
-    },
-    {
-      sort: {
-        createdBy: SortingOrder.Ascending
-      }
-    }
-  )
+
+  $: updateDisplayMessage(messageIds, $inboxMessagesStore)
+
+  async function updateDisplayMessage (ids: Ref<ActivityMessage>[], allMessages: ActivityMessage[]) {
+    const messages = allMessages.filter(({ _id }) => ids.includes(_id))
+    const combinedMessages = await combineActivityMessages(messages)
+
+    displayMessage = combinedMessages[0]
+  }
 
   $: getAllActions(value).then((res) => {
     actions = res

plugins/notification-resources/src/components/inbox/Inbox.svelte

@@ -18,7 +18,7 @@
     DisplayInboxNotification,
     DocNotifyContext
   } from '@hcengineering/notification'
-  import { ActionContext, getClient } from '@hcengineering/presentation'
+  import { ActionContext, createQuery, getClient } from '@hcengineering/presentation'
   import view, { Viewlet } from '@hcengineering/view'
   import {
     AnyComponent,
@@ -39,7 +39,7 @@
   import activity, { ActivityMessage } from '@hcengineering/activity'
   import { isReactionMessage } from '@hcengineering/activity-resources'
 
-  import { InboxNotificationsClientImpl } from '../../inboxNotificationsClient'
+  import { inboxMessagesStore, InboxNotificationsClientImpl } from '../../inboxNotificationsClient'
   import Filter from '../Filter.svelte'
   import { getDisplayInboxNotifications, openInboxDoc, resolveLocation } from '../../utils'
   import { InboxNotificationsFilter } from '../../types'
@@ -50,10 +50,13 @@
 
   const client = getClient()
   const hierarchy = client.getHierarchy()
+
   const inboxClient = InboxNotificationsClientImpl.getClient()
   const notificationsByContextStore = inboxClient.inboxNotificationsByContext
   const notifyContextsStore = inboxClient.docNotifyContexts
 
+  const messagesQuery = createQuery()
+
   const allTab: TabItem = {
     id: 'all',
     labelIntl: notification.string.All
@@ -70,6 +73,8 @@
   let displayNotifications: DisplayInboxNotification[] = []
   let displayContextsIds = new Set<Ref<DocNotifyContext>>()
 
+  let messagesIds: Ref<ActivityMessage>[] = []
+
   let filteredNotifications: DisplayInboxNotification[] = []
   let filter: InboxNotificationsFilter = 'all'
 
@@ -100,6 +105,20 @@
     syncLocation(newLocation)
   })
 
+  inboxClient.activityInboxNotifications.subscribe((notifications) => {
+    messagesIds = notifications.map(({ attachedTo }) => attachedTo)
+  })
+
+  $: messagesQuery.query(
+    activity.class.ActivityMessage,
+    {
+      _id: { $in: messagesIds }
+    },
+    (result) => {
+      inboxMessagesStore.set(result)
+    }
+  )
+
   async function syncLocation (newLocation: Location) {
     const loc = await resolveLocation(newLocation)
 

plugins/notification-resources/src/components/inbox/InboxFlatListView.svelte

@@ -14,7 +14,7 @@
 -->
 <script lang="ts">
   import { ListView } from '@hcengineering/ui'
-  import { ActivityNotificationViewlet, DisplayInboxNotification, DocNotifyContext } from '@hcengineering/notification'
+  import { ActivityNotificationViewlet, DisplayInboxNotification } from '@hcengineering/notification'
   import { createEventDispatcher } from 'svelte'
 
   import InboxNotificationPresenter from './InboxNotificationPresenter.svelte'
@@ -66,14 +66,6 @@
   $: if (element) {
     element.focus()
   }
-
-  // async function handleCheck(notification: DisplayInboxNotification, isChecked: boolean) {
-  //   if (!isChecked) {
-  //     return
-  //   }
-  //
-  //   await deleteInboxNotification(notification)
-  // }
 </script>
 
 <!-- svelte-ignore a11y-no-noninteractive-tabindex -->
@@ -83,15 +75,6 @@
     <svelte:fragment slot="item" let:item={itemIndex}>
       {@const notification = notifications[itemIndex]}
       <div class="notification gap-2">
-        <!--        <div class="mt-6">-->
-        <!--          <CheckBox-->
-        <!--            circle-->
-        <!--            kind="primary"-->
-        <!--            on:value={(event) => {-->
-        <!--              handleCheck(notification, event.detail)-->
-        <!--            }}-->
-        <!--          />-->
-        <!--        </div>-->
         <InboxNotificationPresenter
           value={notification}
           {viewlets}

plugins/notification-resources/src/inboxNotificationsClient.ts

@@ -24,6 +24,8 @@ import notification, {
 import { createQuery, getClient } from '@hcengineering/presentation'
 import { derived, get, writable } from 'svelte/store'
 
+export const inboxMessagesStore = writable<ActivityMessage[]>([])
+
 /**
  * @public
  */