Move dialog outputs inside navigation context (#8511)

* Move all dialogs within NavigationContent on native

* Ok leave old ModalsContainer alone for now

* Do the same on web

* Gate browser consent dialog just to be clear

5 files changed, 22 insertions, 28 deletions

diff --git a/src/App.native.tsx b/src/App.native.tsx
index 81d4a870e..45021da22 100644
--- a/src/App.native.tsx
+++ b/src/App.native.tsx
@@ -64,7 +64,6 @@ import {Shell} from '#/view/shell'
 import {ThemeProvider as Alf} from '#/alf'
 import {useColorModeTheme} from '#/alf/util/useColorModeTheme'
 import {Provider as ContextMenuProvider} from '#/components/ContextMenu'
-import {NuxDialogs} from '#/components/dialogs/nuxs'
 import {useStarterPackEntry} from '#/components/hooks/useStarterPackEntry'
 import {Provider as IntentDialogProvider} from '#/components/intents/IntentDialogs'
 import {Provider as PortalProvider} from '#/components/Portal'
@@ -157,7 +156,6 @@ function InnerApp() {
                                                     <IntentDialogProvider>
                                                       <TestCtrls />
                                                       <Shell />
-                                                      <NuxDialogs />
                                                     </IntentDialogProvider>
                                                   </GestureHandlerRootView>
                                                 </HideBottomBarBorderProvider>
diff --git a/src/App.web.tsx b/src/App.web.tsx
index b706774fd..beb86c90e 100644
--- a/src/App.web.tsx
+++ b/src/App.web.tsx
@@ -54,7 +54,6 @@ import {Shell} from '#/view/shell/index'
 import {ThemeProvider as Alf} from '#/alf'
 import {useColorModeTheme} from '#/alf/util/useColorModeTheme'
 import {Provider as ContextMenuProvider} from '#/components/ContextMenu'
-import {NuxDialogs} from '#/components/dialogs/nuxs'
 import {useStarterPackEntry} from '#/components/hooks/useStarterPackEntry'
 import {Provider as IntentDialogProvider} from '#/components/intents/IntentDialogs'
 import {Provider as PortalProvider} from '#/components/Portal'
@@ -135,7 +134,6 @@ function InnerApp() {
                                                   <HideBottomBarBorderProvider>
                                                     <IntentDialogProvider>
                                                       <Shell />
-                                                      <NuxDialogs />
                                                     </IntentDialogProvider>
                                                   </HideBottomBarBorderProvider>
                                                 </ServiceConfigProvider>
diff --git a/src/view/shell/createNativeStackNavigatorWithAuth.tsx b/src/view/shell/createNativeStackNavigatorWithAuth.tsx
index 1c32971d4..b16f39bbf 100644
--- a/src/view/shell/createNativeStackNavigatorWithAuth.tsx
+++ b/src/view/shell/createNativeStackNavigatorWithAuth.tsx
@@ -40,6 +40,14 @@ import {Onboarding} from '#/screens/Onboarding'
 import {SignupQueued} from '#/screens/SignupQueued'
 import {Takendown} from '#/screens/Takendown'
 import {atoms as a, useLayoutBreakpoints} from '#/alf'
+import {EmailDialog} from '#/components/dialogs/EmailDialog'
+import {InAppBrowserConsentDialog} from '#/components/dialogs/InAppBrowserConsent'
+import {LinkWarningDialog} from '#/components/dialogs/LinkWarning'
+import {MutedWordsDialog} from '#/components/dialogs/MutedWords'
+import {NuxDialogs} from '#/components/dialogs/nuxs'
+import {SigninDialog} from '#/components/dialogs/Signin'
+import {Outlet as PortalOutlet} from '#/components/Portal'
+import {BottomSheetOutlet} from '#/../modules/bottom-sheet'
 import {BottomBarWeb} from './bottom-bar/BottomBarWeb'
 import {DesktopLeftNav} from './desktop/LeftNav'
 import {DesktopRightNav} from './desktop/RightNav'
@@ -167,6 +175,20 @@ function NativeStackNavigator({
           {!isMobile && <DesktopRightNav routeName={activeRoute.name} />}
         </>
       )}
+
+      {/* Start: individual dialogs and outlets */}
+      <MutedWordsDialog />
+      <SigninDialog />
+      <EmailDialog />
+      <LinkWarningDialog />
+      {!isWeb && <InAppBrowserConsentDialog />}
+      <PortalOutlet />
+      <BottomSheetOutlet />
+      {/* End: individual dialogs and outlets */}
+
+      {/* Start: dialog controllers */}
+      <NuxDialogs />
+      {/* End: dialog controllers */}
     </NavigationContent>
   )
 }
diff --git a/src/view/shell/index.tsx b/src/view/shell/index.tsx
index 8c08ec0c0..f3232e06e 100644
--- a/src/view/shell/index.tsx
+++ b/src/view/shell/index.tsx
@@ -25,14 +25,7 @@ import {ModalsContainer} from '#/view/com/modals/Modal'
 import {ErrorBoundary} from '#/view/com/util/ErrorBoundary'
 import {atoms as a, select, useTheme} from '#/alf'
 import {setSystemUITheme} from '#/alf/util/systemUI'
-import {EmailDialog} from '#/components/dialogs/EmailDialog'
-import {InAppBrowserConsentDialog} from '#/components/dialogs/InAppBrowserConsent'
-import {LinkWarningDialog} from '#/components/dialogs/LinkWarning'
-import {MutedWordsDialog} from '#/components/dialogs/MutedWords'
-import {SigninDialog} from '#/components/dialogs/Signin'
-import {Outlet as PortalOutlet} from '#/components/Portal'
 import {RoutesContainer, TabsNavigator} from '#/Navigation'
-import {BottomSheetOutlet} from '../../../modules/bottom-sheet'
 import {updateActiveViewAsync} from '../../../modules/expo-bluesky-swiss-army/src/VisibilityView'
 import {Composer} from './Composer'
 import {DrawerContent} from './Drawer'
@@ -152,14 +145,7 @@ function ShellInner() {
       </View>
       <Composer winHeight={winDim.height} />
       <ModalsContainer />
-      <MutedWordsDialog />
-      <SigninDialog />
-      <EmailDialog />
-      <InAppBrowserConsentDialog />
-      <LinkWarningDialog />
       <Lightbox />
-      <PortalOutlet />
-      <BottomSheetOutlet />
     </>
   )
 }
diff --git a/src/view/shell/index.web.tsx b/src/view/shell/index.web.tsx
index 8969d68f8..c468f08d7 100644
--- a/src/view/shell/index.web.tsx
+++ b/src/view/shell/index.web.tsx
@@ -17,11 +17,6 @@ import {Lightbox} from '#/view/com/lightbox/Lightbox'
 import {ModalsContainer} from '#/view/com/modals/Modal'
 import {ErrorBoundary} from '#/view/com/util/ErrorBoundary'
 import {atoms as a, select, useTheme} from '#/alf'
-import {EmailDialog} from '#/components/dialogs/EmailDialog'
-import {LinkWarningDialog} from '#/components/dialogs/LinkWarning'
-import {MutedWordsDialog} from '#/components/dialogs/MutedWords'
-import {SigninDialog} from '#/components/dialogs/Signin'
-import {Outlet as PortalOutlet} from '#/components/Portal'
 import {FlatNavigator, RoutesContainer} from '#/Navigation'
 import {Composer} from './Composer.web'
 import {DrawerContent} from './Drawer'
@@ -67,12 +62,7 @@ function ShellInner() {
       </ErrorBoundary>
       <Composer winHeight={0} />
       <ModalsContainer />
-      <MutedWordsDialog />
-      <SigninDialog />
-      <EmailDialog />
-      <LinkWarningDialog />
       <Lightbox />
-      <PortalOutlet />
 
       {showDrawerDelayedExit && (
         <>