@planningcenter/chat-react-native 4.2.0-rc.0 → 4.2.0-rc.1

package/src/utils/group_messages.ts

@@ -10,6 +10,7 @@ export type ReplyShadowMessage = {
   type: 'ReplyShadowMessage'
   id: string
   messageId: string
+  replyRoot: MessageResource | null
   isReplyShadowMessage: boolean
   nextRendersAuthor: boolean
 }
@@ -23,6 +24,7 @@ interface GroupMessagesProps {
 
 export function groupMessages({ ms, inReplyScreen }: GroupMessagesProps): EnrichedMessage[] {
   const items: EnrichedMessage[] = []
+  const messagesById = new Map(ms.map(message => [message.id, message]))
   let myLatestSeen = false
   let nextNeighborEnriched: MessageResource | undefined
 
@@ -41,7 +43,13 @@ export function groupMessages({ ms, inReplyScreen }: GroupMessagesProps): Enrich
     const isMyLatest = !myLatestSeen && message.mine
     if (isMyLatest) myLatestSeen = true
 
-    const enriched = enrichRegularMessage(message, prev, next, isMyLatest, !!inReplyScreen)
+    const enriched = enrichRegularMessage(
+      { ...message, replyRoot: resolveReplyRoot(message, messagesById) },
+      prev,
+      next,
+      isMyLatest,
+      !!inReplyScreen
+    )
     items.push(enriched)
 
     const shadow = replyShadowFor(enriched, prev)
@@ -61,6 +69,14 @@ function neighborsOf<T>(arr: T[], i: number): { prev: T | undefined; next: T | u
   return { prev: arr[i + 1], next: arr[i - 1] }
 }
 
+function resolveReplyRoot(
+  message: MessageResource,
+  messagesById: Map<string, MessageResource>
+): MessageResource | null {
+  if (!message.replyRootId || message.replyRootId === message.id) return null
+  return messagesById.get(message.replyRootId) ?? message.replyRoot ?? null
+}
+
 function enrichSystemMessage(
   message: MessageResource,
   next: MessageResource | undefined
@@ -171,6 +187,7 @@ function replyShadowFor(
     type: 'ReplyShadowMessage',
     id: `${message.id}-${message.replyRootId}`,
     messageId: message.replyRootId,
+    replyRoot: message.replyRoot ?? null,
     isReplyShadowMessage: true,
     nextRendersAuthor: message.renderAuthor ?? false,
   }

package/src/utils/replace_equal_by_id.ts

@@ -0,0 +1,42 @@
+import { InfiniteData, replaceEqualDeep } from '@tanstack/react-query'
+import { ApiCollection, ResourceObject } from '../types'
+
+type Pages = InfiniteData<ApiCollection<ResourceObject>>
+
+/** replaceEqualById
+ * TanStack's default structural sharing compares arrays by index, so an insert or
+ * delete gives every shifted record a new identity. Match by id instead.
+ */
+export function replaceEqualById(oldData: unknown, newData: unknown): unknown {
+  const prev = oldData as Pages | undefined
+  const next = newData as Pages
+  if (!prev?.pages || !next?.pages) return replaceEqualDeep(prev, next)
+
+  const prevById = new Map<ResourceObject['id'], ResourceObject>()
+  prev.pages.forEach(page => page.data.forEach(record => prevById.set(record.id, record)))
+
+  let changed = prev.pages.length !== next.pages.length
+  const pages = next.pages.map((page, index) => {
+    const prevPage = prev.pages[index]
+    const data = page.data.map(record => {
+      const previous = prevById.get(record.id)
+      return previous ? replaceEqualDeep(previous, record) : record
+    })
+    const links = replaceEqualDeep(prevPage?.links, page.links)
+    const meta = replaceEqualDeep(prevPage?.meta, page.meta)
+    const sameRecords =
+      !!prevPage &&
+      data.length === prevPage.data.length &&
+      data.every((record, i) => record === prevPage.data[i])
+
+    if (prevPage && sameRecords && links === prevPage.links && meta === prevPage.meta) {
+      return prevPage
+    }
+    changed = true
+    return { ...page, data, links, meta }
+  })
+  const pageParams = replaceEqualDeep(prev.pageParams, next.pageParams)
+
+  if (!changed && pageParams === prev.pageParams) return prev
+  return { ...next, pages, pageParams }
+}

package/src/utils/request/messages_data_options.ts

@@ -19,4 +19,4 @@ export const getMessageFields = {
   ReactionCount: ['value', 'count', 'mine', 'message_id', 'author_ids'],
 }
 
-export const getMessagesInclude = ['author', 'reaction_counts']
+export const getMessagesInclude = ['author', 'reaction_counts', 'reply_root', 'reply_root.author']