add delete button

src/components/dms/MessageMenu.tsx

@@ -1,32 +1,55 @@
 import React from 'react'
-import {View} from 'react-native'
 import {ChatBskyConvoDefs} from '@atproto-labs/api'
+import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 
-import {atoms as a} from '#/alf'
-import * as Dialog from '#/components/Dialog'
+import {Trash_Stroke2_Corner0_Rounded as Trash} from '#/components/icons/Trash'
+import * as Menu from '#/components/Menu'
+import * as Prompt from '#/components/Prompt'
+import {usePromptControl} from '#/components/Prompt'
 
 export let MessageMenu = ({
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   message,
-  onClose,
   control,
 }: {
   message: ChatBskyConvoDefs.MessageView
-  onClose: () => void
-  control: Dialog.DialogControlProps
+  control: Menu.MenuControlProps
 }): React.ReactNode => {
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const {_} = useLingui()
+  const deleteControl = usePromptControl()
+
+  const onDelete = React.useCallback(() => {
+    // TODO delete the message
+  }, [])
 
   return (
-    <Dialog.Outer control={control} onClose={onClose}>
-      <Dialog.Handle />
+    <>
+      <Menu.Root control={control}>
+        <Menu.Outer>
+          <Menu.Group>
+            <Menu.Item
+              testID="postDropdownDeleteBtn"
+              label={_(msg`Delete message`)}
+              onPress={deleteControl.open}>
+              <Menu.ItemText>{_(msg`Delete message`)}</Menu.ItemText>
+              <Menu.ItemIcon icon={Trash} position="right" />
+            </Menu.Item>
+          </Menu.Group>
+        </Menu.Outer>
+      </Menu.Root>
 
-      <Dialog.ScrollableInner label="Menu TODO">
-        <View style={{height: a.gap_lg.gap}} />
-      </Dialog.ScrollableInner>
-    </Dialog.Outer>
+      <Prompt.Basic
+        control={deleteControl}
+        title={_(msg`Delete message`)}
+        description={_(
+          msg`Are you sure you want to delete this message?? The message will be deleted for you, but not for other participants.`,
+        )}
+        confirmButtonCta={_(msg`Delete`)}
+        confirmButtonColor="negative"
+        onConfirm={onDelete}
+      />
+    </>
   )
 }
 MessageMenu = React.memo(MessageMenu)