1 files changed, 35 insertions, 45 deletions

diff --git a/src/view/com/util/forms/PostDropdownBtn.tsx b/src/view/com/util/forms/PostDropdownBtn.tsx
index 6f2ae55b2..84a047c40 100644
--- a/src/view/com/util/forms/PostDropdownBtn.tsx
+++ b/src/view/com/util/forms/PostDropdownBtn.tsx
@@ -1,11 +1,5 @@
 import React, {memo} from 'react'
-import {
-  StyleProp,
-  ViewStyle,
-  Pressable,
-  View,
-  PressableProps,
-} from 'react-native'
+import {StyleProp, ViewStyle, Pressable, PressableProps} from 'react-native'
 import Clipboard from '@react-native-clipboard/clipboard'
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
 import {useNavigation} from '@react-navigation/native'
@@ -20,6 +14,8 @@ import {useTheme} from 'lib/ThemeContext'
 import {shareUrl} from 'lib/sharing'
 import * as Toast from '../Toast'
 import {EventStopper} from '../EventStopper'
+import {useDialogControl} from '#/components/Dialog'
+import * as Prompt from '#/components/Prompt'
 import {useModalControls} from '#/state/modals'
 import {makeProfileLink} from '#/lib/routes/links'
 import {CommonNavigatorParams} from '#/lib/routes/types'
@@ -38,7 +34,7 @@ import {isWeb} from '#/platform/detection'
 import {richTextToString} from '#/lib/strings/rich-text-helpers'
 import {useGlobalDialogsControlContext} from '#/components/dialogs/Context'
 
-import {atoms as a, useTheme as useAlf, web} from '#/alf'
+import {atoms as a, useTheme as useAlf} from '#/alf'
 import * as Menu from '#/components/Menu'
 import {Clipboard_Stroke2_Corner2_Rounded as ClipboardIcon} from '#/components/icons/Clipboard'
 import {Filter_Stroke2_Corner0_Rounded as Filter} from '#/components/icons/Filter'
@@ -87,6 +83,8 @@ let PostDropdownBtn = ({
   const openLink = useOpenLink()
   const navigation = useNavigation()
   const {mutedWordsDialogControl} = useGlobalDialogsControlContext()
+  const deletePromptControl = useDialogControl()
+  const hidePromptControl = useDialogControl()
 
   const rootUri = record.reply?.root?.uri || postUri
   const isThreadMuted = mutedThreads.includes(rootUri)
@@ -174,29 +172,18 @@ let PostDropdownBtn = ({
       <Menu.Root>
         <Menu.Trigger label={_(msg`Open post options menu`)}>
           {({props, state}) => {
-            const styles = [
-              style,
-              a.rounded_full,
-              (state.hovered || state.focused || state.pressed) && [
-                web({outline: 0}),
-                alf.atoms.bg_contrast_25,
-              ],
-            ]
-            return isWeb ? (
-              <View {...props} testID={testID} style={styles}>
-                <FontAwesomeIcon
-                  icon="ellipsis"
-                  size={20}
-                  color={defaultCtrlColor}
-                  style={{pointerEvents: 'none'}}
-                />
-              </View>
-            ) : (
+            return (
               <Pressable
                 {...props}
                 hitSlop={hitSlop}
                 testID={testID}
-                style={styles}>
+                style={[
+                  style,
+                  a.rounded_full,
+                  (state.hovered || state.pressed) && [
+                    alf.atoms.bg_contrast_50,
+                  ],
+                ]}>
                 <FontAwesomeIcon
                   icon="ellipsis"
                   size={20}
@@ -274,16 +261,7 @@ let PostDropdownBtn = ({
                   <Menu.Item
                     testID="postDropdownHideBtn"
                     label={_(msg`Hide post`)}
-                    onPress={() => {
-                      openModal({
-                        name: 'confirm',
-                        title: _(msg`Hide this post?`),
-                        message: _(
-                          msg`This will hide this post from your feeds.`,
-                        ),
-                        onPressConfirm: onHidePost,
-                      })
-                    }}>
+                    onPress={hidePromptControl.open}>
                     <Menu.ItemText>{_(msg`Hide post`)}</Menu.ItemText>
                     <Menu.ItemIcon icon={EyeSlash} position="right" />
                   </Menu.Item>
@@ -315,14 +293,7 @@ let PostDropdownBtn = ({
               <Menu.Item
                 testID="postDropdownDeleteBtn"
                 label={_(msg`Delete post`)}
-                onPress={() => {
-                  openModal({
-                    name: 'confirm',
-                    title: _(msg`Delete this post?`),
-                    message: _(msg`Are you sure? This cannot be undone.`),
-                    onPressConfirm: onDeletePost,
-                  })
-                }}>
+                onPress={deletePromptControl.open}>
                 <Menu.ItemText>{_(msg`Delete post`)}</Menu.ItemText>
                 <Menu.ItemIcon icon={Trash} position="right" />
               </Menu.Item>
@@ -352,6 +323,25 @@ let PostDropdownBtn = ({
           </Menu.Group>
         </Menu.Outer>
       </Menu.Root>
+
+      <Prompt.Basic
+        control={deletePromptControl}
+        title={_(msg`Delete this post?`)}
+        description={_(
+          msg`If you remove this post, you won't be able to recover it.`,
+        )}
+        onConfirm={onDeletePost}
+        confirmButtonCta={_(msg`Delete`)}
+        confirmButtonColor="negative"
+      />
+
+      <Prompt.Basic
+        control={hidePromptControl}
+        title={_(msg`Hide this post?`)}
+        description={_(msg`This post will be hidden from feeds.`)}
+        onConfirm={onHidePost}
+        confirmButtonCta={_(msg`Hide`)}
+      />
     </EventStopper>
   )
 }