Conversation-level reporting by reporting most recent message available (#7423)

* report latest message via convo menu

* check all messages we have

* fix types

* rm convo warning

src/components/ReportDialog/SelectReportOptionView.tsx

@@ -25,9 +25,7 @@ import {SquareArrowTopRight_Stroke2_Corner0_Rounded as SquareArrowTopRight} from
 import {Text} from '#/components/Typography'
 import {ReportDialogProps} from './types'
 
-export function SelectReportOptionView({
-  ...props
-}: {
+export function SelectReportOptionView(props: {
   params: ReportDialogProps['params']
   labelers: AppBskyLabelerDefs.LabelerViewDetailed[]
   onSelectReportOption: (reportOption: ReportOption) => void

src/components/dms/ConvoMenu.tsx

@@ -35,6 +35,7 @@ import {SpeakerVolumeFull_Stroke2_Corner0_Rounded as Unmute} from '#/components/
 import * as Menu from '#/components/Menu'
 import * as Prompt from '#/components/Prompt'
 import {Bubble_Stroke2_Corner2_Rounded as Bubble} from '../icons/Bubble'
+import {ReportDialog} from './ReportDialog'
 
 let ConvoMenu = ({
   convo: initialConvo,
@@ -44,6 +45,7 @@ let ConvoMenu = ({
   showMarkAsRead,
   hideTrigger,
   blockInfo,
+  latestReportableMessage,
   style,
 }: {
   convo: ChatBskyConvoDefs.ConvoView
@@ -56,6 +58,7 @@ let ConvoMenu = ({
     listBlocks: ModerationCause[]
     userBlock?: ModerationCause
   }
+  latestReportableMessage?: ChatBskyConvoDefs.MessageView
   style?: ViewStyleProp['style']
 }): React.ReactNode => {
   const navigation = useNavigation<NavigationProp>()
@@ -222,7 +225,19 @@ let ConvoMenu = ({
         convoId={convo.id}
         currentScreen={currentScreen}
       />
+      {latestReportableMessage ? (
+        <ReportDialog
+          params={{
+            type: 'convoMessage',
+            convoId: convo.id,
+            message: latestReportableMessage,
+          }}
+          control={reportControl}
+        />
+      ) : (
         <ReportConversationPrompt control={reportControl} />
+      )}
+
       <BlockedByListDialog
         control={blockedByListControl}
         listBlocks={listBlocks}

src/components/dms/MessagesListHeader.tsx

@@ -151,6 +151,15 @@ function HeaderReady({
         moderation.ui('displayName'),
       )
 
+  const latestMessageFromOther = convoState.items.findLast(
+    item => item.type === 'message' && item.message.sender.did === profile.did,
+  )
+
+  const latestReportableMessage =
+    latestMessageFromOther?.type === 'message'
+      ? latestMessageFromOther.message
+      : undefined
+
   return (
     <View style={[a.flex_1]}>
       <View style={[a.w_full, a.flex_row, a.align_center, a.justify_between]}>
@@ -208,6 +217,7 @@ function HeaderReady({
             profile={profile}
             currentScreen="conversation"
             blockInfo={blockInfo}
+            latestReportableMessage={latestReportableMessage}
           />
         )}
       </View>

src/screens/Messages/components/ChatListItem.tsx

@@ -112,13 +112,22 @@ function ChatListItemReady({
 
   const isDimStyle = convo.muted || moderation.blocked || isDeletedAccount
 
-  const {lastMessage, lastMessageSentAt} = useMemo(() => {
+  const {lastMessage, lastMessageSentAt, latestReportableMessage} =
+    useMemo(() => {
+      // eslint-disable-next-line @typescript-eslint/no-shadow
       let lastMessage = _(msg`No messages yet`)
+      // eslint-disable-next-line @typescript-eslint/no-shadow
       let lastMessageSentAt: string | null = null
+      // eslint-disable-next-line @typescript-eslint/no-shadow
+      let latestReportableMessage: ChatBskyConvoDefs.MessageView | undefined
 
       if (ChatBskyConvoDefs.isMessageView(convo.lastMessage)) {
         const isFromMe = convo.lastMessage.sender?.did === currentAccount?.did
 
+        if (!isFromMe) {
+          latestReportableMessage = convo.lastMessage
+        }
+
         if (convo.lastMessage.text) {
           if (isFromMe) {
             lastMessage = _(msg`You: ${convo.lastMessage.text}`)
@@ -168,6 +177,7 @@ function ChatListItemReady({
       return {
         lastMessage,
         lastMessageSentAt,
+        latestReportableMessage,
       }
     }, [_, convo.lastMessage, currentAccount?.did, isDeletedAccount])
 
@@ -412,6 +422,7 @@ function ChatListItemReady({
               opacity: !gtMobile || showActions || menuControl.isOpen ? 1 : 0,
             },
           ]}
+          latestReportableMessage={latestReportableMessage}
         />
         <LeaveConvoPrompt
           control={leaveConvoControl}