From 2dab545d243b663e7718cff02c81d41bf4e88751 Mon Sep 17 00:00:00 2001
From: Eric Bailey <git@esb.lol>
Date: Mon, 17 Feb 2025 16:21:40 -0600
Subject: [PATCH] Add option to align web dialogs to top

---
 src/components/Dialog/index.web.tsx   | 7 +++++--
 src/components/Dialog/types.ts        | 4 +++-
 src/components/ReportDialog/index.tsx | 2 +-
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/Dialog/index.web.tsx b/src/components/Dialog/index.web.tsx
index 9f4f8bb3fa..1ab75e8e32 100644
--- a/src/components/Dialog/index.web.tsx
+++ b/src/components/Dialog/index.web.tsx
@@ -41,6 +41,7 @@ export function Outer({
   children,
   control,
   onClose,
+  webOptions,
 }: React.PropsWithChildren<DialogOuterProps>) {
   const {_} = useLingui()
   const {gtMobile} = useBreakpoints()
@@ -116,7 +117,7 @@ export function Outer({
                   a.inset_0,
                   a.z_10,
                   a.align_center,
-                  gtMobile ? a.p_lg : a.p_md,
+                  gtMobile ? a.p_5xl : a.p_xl,
                   {overflowY: 'auto'},
                 ]}>
                 <Backdrop />
@@ -124,7 +125,9 @@ export function Outer({
                   style={[
                     a.w_full,
                     a.z_20,
-                    a.justify_center,
+                    webOptions?.alignTop
+                      ? undefined
+                      : a.justify_center,
                     a.align_center,
                     {
                       minHeight: web('calc(90vh - 36px)') || undefined,
diff --git a/src/components/Dialog/types.ts b/src/components/Dialog/types.ts
index 526784baac..88ea9ba731 100644
--- a/src/components/Dialog/types.ts
+++ b/src/components/Dialog/types.ts
@@ -60,7 +60,9 @@ export type DialogOuterProps = {
   control: DialogControlProps
   onClose?: () => void
   nativeOptions?: Omit<BottomSheetViewProps, 'children'>
-  webOptions?: {}
+  webOptions?: {
+    alignTop?: boolean
+  }
   testID?: string
 }
 
diff --git a/src/components/ReportDialog/index.tsx b/src/components/ReportDialog/index.tsx
index 4402152abe..d8efc4c969 100644
--- a/src/components/ReportDialog/index.tsx
+++ b/src/components/ReportDialog/index.tsx
@@ -22,7 +22,7 @@ import {ReportDialogProps} from './types'
 
 export function ReportDialog(props: ReportDialogProps) {
   return (
-    <Dialog.Outer control={props.control}>
+    <Dialog.Outer webOptions={{alignTop: true}} control={props.control}>
       <Dialog.Handle />
       <ReportDialogInner {...props} />
     </Dialog.Outer>