about summary refs log tree commit diff
path: root/src/components/dms/ConvoMenu.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/dms/ConvoMenu.tsx')
-rw-r--r--src/components/dms/ConvoMenu.tsx104
1 files changed, 19 insertions, 85 deletions
diff --git a/src/components/dms/ConvoMenu.tsx b/src/components/dms/ConvoMenu.tsx
index cf1dbc171..0e5cd12bf 100644
--- a/src/components/dms/ConvoMenu.tsx
+++ b/src/components/dms/ConvoMenu.tsx
@@ -3,25 +3,25 @@ import {Keyboard, Pressable, View} from 'react-native'
 import {
   AppBskyActorDefs,
   ChatBskyConvoDefs,
-  ModerationDecision,
+  ModerationCause,
 } from '@atproto/api'
 import {msg, Trans} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {useNavigation} from '@react-navigation/native'
 
 import {NavigationProp} from '#/lib/routes/types'
-import {listUriToHref} from '#/lib/strings/url-helpers'
 import {Shadow} from '#/state/cache/types'
 import {
   useConvoQuery,
   useMarkAsReadMutation,
 } from '#/state/queries/messages/conversation'
-import {useLeaveConvo} from '#/state/queries/messages/leave-conversation'
 import {useMuteConvo} from '#/state/queries/messages/mute-conversation'
 import {useProfileBlockMutationQueue} from '#/state/queries/profile'
 import * as Toast from '#/view/com/util/Toast'
 import {atoms as a, useTheme} from '#/alf'
-import * as Dialog from '#/components/Dialog'
+import {BlockedByListDialog} from '#/components/dms/BlockedByListDialog'
+import {LeaveConvoPrompt} from '#/components/dms/LeaveConvoPrompt'
+import {ReportConversationPrompt} from '#/components/dms/ReportConversationPrompt'
 import {ArrowBoxLeft_Stroke2_Corner0_Rounded as ArrowBoxLeft} from '#/components/icons/ArrowBoxLeft'
 import {DotGrid_Stroke2_Corner0_Rounded as DotsHorizontal} from '#/components/icons/DotGrid'
 import {Flag_Stroke2_Corner0_Rounded as Flag} from '#/components/icons/Flag'
@@ -30,10 +30,8 @@ import {Person_Stroke2_Corner0_Rounded as Person} from '#/components/icons/Perso
 import {PersonCheck_Stroke2_Corner0_Rounded as PersonCheck} from '#/components/icons/PersonCheck'
 import {PersonX_Stroke2_Corner0_Rounded as PersonX} from '#/components/icons/PersonX'
 import {SpeakerVolumeFull_Stroke2_Corner0_Rounded as Unmute} from '#/components/icons/Speaker'
-import {InlineLinkText} from '#/components/Link'
 import * as Menu from '#/components/Menu'
 import * as Prompt from '#/components/Prompt'
-import {Text} from '#/components/Typography'
 import {Bubble_Stroke2_Corner2_Rounded as Bubble} from '../icons/Bubble'
 
 let ConvoMenu = ({
@@ -44,7 +42,7 @@ let ConvoMenu = ({
   showMarkAsRead,
   hideTrigger,
   triggerOpacity,
-  moderation,
+  blockInfo,
 }: {
   convo: ChatBskyConvoDefs.ConvoView
   profile: Shadow<AppBskyActorDefs.ProfileViewBasic>
@@ -53,7 +51,10 @@ let ConvoMenu = ({
   showMarkAsRead?: boolean
   hideTrigger?: boolean
   triggerOpacity?: number
-  moderation: ModerationDecision
+  blockInfo: {
+    listBlocks: ModerationCause[]
+    userBlock?: ModerationCause
+  }
 }): React.ReactNode => {
   const navigation = useNavigation<NavigationProp>()
   const {_} = useLingui()
@@ -62,17 +63,9 @@ let ConvoMenu = ({
   const reportControl = Prompt.usePromptControl()
   const blockedByListControl = Prompt.usePromptControl()
   const {mutate: markAsRead} = useMarkAsReadMutation()
-  const modui = moderation.ui('profileView')
-  const {listBlocks, userBlock} = React.useMemo(() => {
-    const blocks = modui.alerts.filter(alert => alert.type === 'blocking')
-    const listBlocks = blocks.filter(alert => alert.source.type === 'list')
-    const userBlock = blocks.find(alert => alert.source.type === 'user')
-    return {
-      listBlocks,
-      userBlock,
-    }
-  }, [modui])
-  const isBlocking = !!userBlock || !!listBlocks.length
+
+  const {listBlocks, userBlock} = blockInfo
+  const isBlocking = userBlock || !!listBlocks.length
 
   const {data: convo} = useConvoQuery(initialConvo)
 
@@ -108,17 +101,6 @@ let ConvoMenu = ({
     }
   }, [userBlock, listBlocks, blockedByListControl, queueBlock, queueUnblock])
 
-  const {mutate: leaveConvo} = useLeaveConvo(convo?.id, {
-    onSuccess: () => {
-      if (currentScreen === 'conversation') {
-        navigation.replace('Messages')
-      }
-    },
-    onError: () => {
-      Toast.show(_(msg`Could not leave chat`))
-    },
-  })
-
   return (
     <>
       <Menu.Root control={control}>
@@ -218,67 +200,19 @@ let ConvoMenu = ({
         </Menu.Outer>
       </Menu.Root>
 
-      <Prompt.Basic
+      <LeaveConvoPrompt
         control={leaveConvoControl}
-        title={_(msg`Leave conversation`)}
-        description={_(
-          msg`Are you sure you want to leave this conversation? Your messages will be deleted for you, but not for the other participant.`,
-        )}
-        confirmButtonCta={_(msg`Leave`)}
-        confirmButtonColor="negative"
-        onConfirm={() => leaveConvo()}
+        convoId={convo.id}
+        currentScreen={currentScreen}
       />
-
-      <Prompt.Basic
-        control={reportControl}
-        title={_(msg`Report conversation`)}
-        description={_(
-          msg`To report a conversation, please report one of its messages via the conversation screen. This lets our moderators understand the context of your issue.`,
-        )}
-        confirmButtonCta={_(msg`I understand`)}
-        onConfirm={noop}
+      <ReportConversationPrompt control={reportControl} />
+      <BlockedByListDialog
+        control={blockedByListControl}
+        listBlocks={listBlocks}
       />
-
-      <Prompt.Outer control={blockedByListControl} testID="blockedByListDialog">
-        <Prompt.TitleText>{_(msg`User blocked by list`)}</Prompt.TitleText>
-
-        <View style={[a.gap_sm, a.pb_lg]}>
-          <Text
-            selectable
-            style={[a.text_md, a.leading_snug, t.atoms.text_contrast_high]}>
-            {_(
-              msg`This account is blocked by one or more of your moderation lists. To unblock, please visit the lists directly and remove this user.`,
-            )}{' '}
-          </Text>
-
-          <Text style={[a.text_md, a.leading_snug, t.atoms.text_contrast_high]}>
-            {_(msg`Lists blocking this user:`)}{' '}
-            {listBlocks.map((block, i) =>
-              block.source.type === 'list' ? (
-                <React.Fragment key={block.source.list.uri}>
-                  {i === 0 ? null : ', '}
-                  <InlineLinkText
-                    to={listUriToHref(block.source.list.uri)}
-                    style={[a.text_md, a.leading_snug]}>
-                    {block.source.list.name}
-                  </InlineLinkText>
-                </React.Fragment>
-              ) : null,
-            )}
-          </Text>
-        </View>
-
-        <Prompt.Actions>
-          <Prompt.Cancel cta={_(msg`I understand`)} />
-        </Prompt.Actions>
-
-        <Dialog.Close />
-      </Prompt.Outer>
     </>
   )
 }
 ConvoMenu = React.memo(ConvoMenu)
 
 export {ConvoMenu}
-
-function noop() {}