Composer - fix modals, and other tweaks (#4298)

* fix depreciated import

* add animations to old dropdown

* wrap modals in fullwindowoverlay

* move errors inside header

* add background to bottom bar and stop overlap

* nest dialogs on android

* fix android (wrap in gesturehandlerrootview)

* make borders all the same color

* revert threadgate button back to solid

1 files changed, 44 insertions, 41 deletions

diff --git a/src/components/Dialog/index.tsx b/src/components/Dialog/index.tsx
index f32e0e79e..158244c8e 100644
--- a/src/components/Dialog/index.tsx
+++ b/src/components/Dialog/index.tsx
@@ -32,6 +32,7 @@ import {
   DialogOuterProps,
 } from '#/components/Dialog/types'
 import {createInput} from '#/components/forms/TextField'
+import {FullWindowOverlay} from '#/components/FullWindowOverlay'
 import {Portal} from '#/components/Portal'
 
 export {useDialogContext, useDialogControl} from '#/components/Dialog/context'
@@ -170,47 +171,49 @@ export function Outer({
   return (
     isOpen && (
       <Portal>
-        <View
-          // iOS
-          accessibilityViewIsModal
-          // Android
-          importantForAccessibility="yes"
-          style={[a.absolute, a.inset_0]}
-          testID={testID}
-          onTouchMove={() => Keyboard.dismiss()}>
-          <BottomSheet
-            enableDynamicSizing={!hasSnapPoints}
-            enablePanDownToClose
-            keyboardBehavior="interactive"
-            android_keyboardInputMode="adjustResize"
-            keyboardBlurBehavior="restore"
-            topInset={insets.top}
-            {...sheetOptions}
-            snapPoints={sheetOptions.snapPoints || ['100%']}
-            ref={sheet}
-            index={openIndex}
-            backgroundStyle={{backgroundColor: 'transparent'}}
-            backdropComponent={Backdrop}
-            handleIndicatorStyle={{backgroundColor: t.palette.primary_500}}
-            handleStyle={{display: 'none'}}
-            onClose={onCloseAnimationComplete}>
-            <Context.Provider value={context}>
-              <View
-                style={[
-                  a.absolute,
-                  a.inset_0,
-                  t.atoms.bg,
-                  {
-                    borderTopLeftRadius: 40,
-                    borderTopRightRadius: 40,
-                    height: Dimensions.get('window').height * 2,
-                  },
-                ]}
-              />
-              {children}
-            </Context.Provider>
-          </BottomSheet>
-        </View>
+        <FullWindowOverlay>
+          <View
+            // iOS
+            accessibilityViewIsModal
+            // Android
+            importantForAccessibility="yes"
+            style={[a.absolute, a.inset_0]}
+            testID={testID}
+            onTouchMove={() => Keyboard.dismiss()}>
+            <BottomSheet
+              enableDynamicSizing={!hasSnapPoints}
+              enablePanDownToClose
+              keyboardBehavior="interactive"
+              android_keyboardInputMode="adjustResize"
+              keyboardBlurBehavior="restore"
+              topInset={insets.top}
+              {...sheetOptions}
+              snapPoints={sheetOptions.snapPoints || ['100%']}
+              ref={sheet}
+              index={openIndex}
+              backgroundStyle={{backgroundColor: 'transparent'}}
+              backdropComponent={Backdrop}
+              handleIndicatorStyle={{backgroundColor: t.palette.primary_500}}
+              handleStyle={{display: 'none'}}
+              onClose={onCloseAnimationComplete}>
+              <Context.Provider value={context}>
+                <View
+                  style={[
+                    a.absolute,
+                    a.inset_0,
+                    t.atoms.bg,
+                    {
+                      borderTopLeftRadius: 40,
+                      borderTopRightRadius: 40,
+                      height: Dimensions.get('window').height * 2,
+                    },
+                  ]}
+                />
+                {children}
+              </Context.Provider>
+            </BottomSheet>
+          </View>
+        </FullWindowOverlay>
       </Portal>
     )
   )