1 files changed, 15 insertions, 12 deletions

diff --git a/src/components/ReportDialog/index.tsx b/src/components/ReportDialog/index.tsx
index 6a7aa6ff2..b41df3b3a 100644
--- a/src/components/ReportDialog/index.tsx
+++ b/src/components/ReportDialog/index.tsx
@@ -1,22 +1,24 @@
 import React from 'react'
-import {View, Pressable} from 'react-native'
+import {Pressable, View} from 'react-native'
 import {Trans} from '@lingui/macro'
 
-import {useMyLabelersQuery} from '#/state/queries/preferences'
 import {ReportOption} from '#/lib/moderation/useReportOptions'
+import {useMyLabelersQuery} from '#/state/queries/preferences'
 export {useDialogControl as useReportDialogControl} from '#/components/Dialog'
 
+import {AppBskyLabelerDefs} from '@atproto/api'
+import {BottomSheetScrollViewMethods} from '@discord/bottom-sheet/src'
+
 import {atoms as a} from '#/alf'
-import {Loader} from '#/components/Loader'
 import * as Dialog from '#/components/Dialog'
+import {useDelayedLoading} from '#/components/hooks/useDelayedLoading'
+import {useOnKeyboardDidShow} from '#/components/hooks/useOnKeyboard'
+import {Loader} from '#/components/Loader'
 import {Text} from '#/components/Typography'
-
-import {ReportDialogProps} from './types'
 import {SelectLabelerView} from './SelectLabelerView'
 import {SelectReportOptionView} from './SelectReportOptionView'
 import {SubmitView} from './SubmitView'
-import {useDelayedLoading} from '#/components/hooks/useDelayedLoading'
-import {AppBskyLabelerDefs} from '@atproto/api'
+import {ReportDialogProps} from './types'
 
 export function ReportDialog(props: ReportDialogProps) {
   return (
@@ -36,10 +38,13 @@ function ReportDialogInner(props: ReportDialogProps) {
   } = useMyLabelersQuery()
   const isLoading = useDelayedLoading(500, isLabelerLoading)
 
+  const ref = React.useRef<BottomSheetScrollViewMethods>(null)
+  useOnKeyboardDidShow(() => {
+    ref.current?.scrollToEnd({animated: true})
+  })
+
   return (
-    <Dialog.ScrollableInner
-      label="Report Dialog"
-      keyboardDismissMode="interactive">
+    <Dialog.ScrollableInner label="Report Dialog" ref={ref}>
       {isLoading ? (
         <View style={[a.align_center, {height: 100}]}>
           <Loader size="xl" />
@@ -55,8 +60,6 @@ function ReportDialogInner(props: ReportDialogProps) {
       ) : (
         <ReportDialogLoaded labelers={labelers} {...props} />
       )}
-
-      <Dialog.Close />
     </Dialog.ScrollableInner>
   )
 }