feat(lib): disallow creating threads in deleted messages

lib/src/entities/chat.ts

@@ -373,6 +373,9 @@ export class Chat {
       if (message.channelId.startsWith(MESSAGE_THREAD_ID_PREFIX)) {
         throw "Only one level of thread nesting is allowed"
       }
+      if (message.deleted) {
+        throw "You cannot create threads on deleted messages"
+      }
 
       const threadChannelId = this.getThreadId(message.channelId, message.timetoken)
 

lib/tests/message.test.ts

@@ -208,6 +208,32 @@ describe("Send message test", () => {
     expect(logSpy).toHaveBeenCalledWith("This message has not been deleted")
   })
 
+  test("should throw an error if you try to create a thread on a deleted message", async () => {
+    await channel.sendText("Test message")
+    await sleep(150) // history calls have around 130ms of cache time
+
+    const historyBeforeDelete = await channel.getHistory()
+    const messagesBeforeDelete = historyBeforeDelete.messages
+    const sentMessage = messagesBeforeDelete[messagesBeforeDelete.length - 1]
+
+    await sentMessage.delete({ soft: true })
+    await sleep(150) // history calls have around 130ms of cache time
+
+    const historyAfterDelete = await channel.getHistory()
+    const messagesAfterDelete = historyAfterDelete.messages
+
+    const deletedMessage = messagesAfterDelete.find(
+      (message: Message) => message.timetoken === sentMessage.timetoken
+    )
+    let thrownExceptionString = ""
+
+    await deletedMessage.createThread().catch((e) => {
+      thrownExceptionString = e
+    })
+
+    expect(thrownExceptionString).toBe("You cannot create threads on deleted messages")
+  })
+
   test("should edit the message", async () => {
     await channel.sendText("Test message")
     await sleep(150) // history calls have around 130ms of cache time

samples/react-native-group-chat/components/actions-menu/ActionsMenu.tsx

@@ -109,7 +109,7 @@ export function useActionsMenu({
         Copy message
       </Button>
       <Gap value={16} />
-      {!removeThreadReply ? (
+      {!removeThreadReply && !currentlyFocusedMessage?.originalPnMessage.deleted ? (
         <>
           <Button
             size="md"

samples/react-native-group-chat/screens/ordinary/chat/Chat.tsx

@@ -100,7 +100,7 @@ export function ChatScreen({}: StackScreenProps<HomeStackParamList, "Chat">) {
 
   const handleDeleteMessage = useCallback(async (message: Message) => {
     if (message.deleted) {
-      const restoredMessage = await message.restore()
+      await message.restore()
     } else {
       await message.delete({ soft: true })
     }

samples/react-native-group-chat/screens/ordinary/thread-reply/ThreadReply.tsx

@@ -30,6 +30,7 @@ export function ThreadReply({ route }: StackScreenProps<HomeStackParamList, "Thr
   const [suggestedData, setSuggestedData] = useState<User[] | Channel[]>([])
   const [showSuggestedData, setShowSuggestedData] = useState(false)
   const [lastAffectedNameOccurrenceIndex, setLastAffectedNameOccurrenceIndex] = useState(-1)
+  const [showTextLinkBox, setShowTextLinkBox] = useState(false)
 
   const { renderFooter, renderMessageText, renderChatFooter } = useCommonChatRenderers({
     typingData,
@@ -41,6 +42,9 @@ export function ThreadReply({ route }: StackScreenProps<HomeStackParamList, "Thr
     giftedChatMappedMessages,
     giftedChatRef,
     lastAffectedNameOccurrenceIndex,
+    showTextLinkBox,
+    setShowTextLinkBox,
+    image: "",
   })
 
   const handleQuote = useCallback(
@@ -67,10 +71,39 @@ export function ThreadReply({ route }: StackScreenProps<HomeStackParamList, "Thr
     [chat]
   )
 
+  const handleEmoji = useCallback(
+    (message: Message) => {
+      const copiedMessages = [...giftedChatMappedMessages]
+
+      const index = copiedMessages.findIndex(
+        (msg) => msg.originalPnMessage.timetoken === message.timetoken
+      )
+
+      if (index === -1) {
+        return
+      }
+
+      copiedMessages[index].originalPnMessage = message
+
+      setGiftedChatMappedMessages(copiedMessages)
+    },
+    [giftedChatMappedMessages]
+  )
+
+  const handleDeleteMessage = useCallback(async (message: Message) => {
+    if (message.deleted) {
+      await message.restore()
+    } else {
+      await message.delete({ soft: true })
+    }
+  }, [])
+
   const { ActionsMenuComponent, handlePresentModalPress } = useActionsMenu({
     onQuote: handleQuote,
     removeThreadReply: true,
     onPinMessage: handlePin,
+    onDeleteMessage: handleDeleteMessage,
+    onToggleEmoji: handleEmoji,
   })
 
   useEffect(() => {