Dialog solution

src/view/com/util/forms/PostDropdownBtn.tsx

@@ -31,7 +31,8 @@ import {useLingui} from '@lingui/react'
 import {useSession} from '#/state/session'
 import {isWeb} from '#/platform/detection'
 import {richTextToString} from '#/lib/strings/rich-text-helpers'
-import {useReportDialogControl} from '#/components/dialogs/ReportDialog'
+import {useOpenGlobalDialog} from '#/components/dialogs'
+import {ReportDialog} from '#/components/dialogs/ReportDialog'
 
 let PostDropdownBtn = ({
   testID,
@@ -64,7 +65,7 @@ let PostDropdownBtn = ({
   const hiddenPosts = useHiddenPosts()
   const {hidePost} = useHiddenPostsApi()
   const openLink = useOpenLink()
-  const reportDialogControl = useReportDialogControl()
+  const openDialog = useOpenGlobalDialog()
 
   const rootUri = record.reply?.root?.uri || postUri
   const isThreadMuted = mutedThreads.includes(rootUri)
@@ -211,7 +212,7 @@ let PostDropdownBtn = ({
       hasSession && {
         label: _(msg`Report post`),
         onPress() {
-          reportDialogControl.open({type: 'post', uri: postUri, cid: postCid})
+          openDialog(ReportDialog, {type: 'post', uri: postUri, cid: postCid})
           // openModal({
           //   name: 'report',
           //   uri: postUri,

src/view/screens/Storybook/Dialogs.tsx

@@ -7,11 +7,14 @@ import {H3, P} from '#/components/Typography'
 import * as Dialog from '#/components/Dialog'
 import * as Prompt from '#/components/Prompt'
 import {useDialogStateControlContext} from '#/state/dialogs'
+import {useOpenGlobalDialog} from '#/components/dialogs'
+import {ReportDialog} from '#/components/dialogs/ReportDialog'
 
 export function Dialogs() {
   const control = Dialog.useDialogControl()
   const prompt = Prompt.usePromptControl()
   const {closeAllDialogs} = useDialogStateControlContext()
+  const openDialog = useOpenGlobalDialog()
 
   return (
     <View style={[a.gap_md]}>
@@ -36,6 +39,19 @@ export function Dialogs() {
         Open prompt
       </Button>
 
+      <View style={[a.flex_row, a.gap_md]}>
+        <Button
+          variant="solid"
+          color="primary"
+          size="small"
+          onPress={() => {
+            openDialog(ReportDialog, {type: 'user', did: ''})
+          }}
+          label="Open prompt">
+          Open dialogs
+        </Button>
+      </View>
+
       <Prompt.Outer control={prompt}>
         <Prompt.Title>This is a prompt</Prompt.Title>
         <Prompt.Description>

src/view/screens/Storybook/index.tsx

@@ -66,6 +66,7 @@ export function Storybook() {
             </Button>
           </View>
 
+          <Dialogs />
           <ThemeProvider theme="light">
             <Theming />
           </ThemeProvider>
@@ -83,7 +84,6 @@ export function Storybook() {
           <Icons />
           <Links />
           <Forms />
-          <Dialogs />
           <Breakpoints />
         </View>
       </CenteredView>

src/view/shell/index.tsx

@@ -29,7 +29,7 @@ import {useSession} from '#/state/session'
 import {useCloseAnyActiveElement} from '#/state/util'
 import * as notifications from 'lib/notifications/notifications'
 import {Outlet as PortalOutlet} from '#/components/Portal'
-import {ReportDialog} from '#/components/dialogs/ReportDialog'
+import {GlobalDialog} from '#/components/dialogs'
 
 function ShellInner() {
   const isDrawerOpen = useIsDrawerOpen()
@@ -97,7 +97,7 @@ function ShellInner() {
       <ModalsContainer />
       <Lightbox />
 
-      <ReportDialog />
+      <GlobalDialog />
       <PortalOutlet />
     </>
   )

src/view/shell/index.web.tsx

@@ -16,7 +16,7 @@ import {useIsDrawerOpen, useSetDrawerOpen} from '#/state/shell'
 import {useCloseAllActiveElements} from '#/state/util'
 import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock'
 import {Outlet as PortalOutlet} from '#/components/Portal'
-import {ReportDialog} from '#/components/dialogs/ReportDialog'
+import {GlobalDialog} from '#/components/dialogs'
 
 function ShellInner() {
   const isDrawerOpen = useIsDrawerOpen()
@@ -43,7 +43,7 @@ function ShellInner() {
       <ModalsContainer />
       <Lightbox />
 
-      <ReportDialog />
+      <GlobalDialog />
       <PortalOutlet />
 
       {!isDesktop && isDrawerOpen && (