From b8cfb2d0af2cd6383f1d3c76a8cc597d2c8d553a Mon Sep 17 00:00:00 2001 From: Eric Bailey Date: Tue, 5 Aug 2025 15:42:39 -0500 Subject: [PATCH] Move context around, unmount portals on native --- src/App.native.tsx | 110 +++++++++--------- src/App.web.tsx | 92 +++++++-------- .../PolicyUpdateOverlay/Overlay.tsx | 1 + src/components/PolicyUpdateOverlay/Portal.tsx | 7 ++ .../PolicyUpdateOverlay/context.tsx | 34 ++++++ src/components/PolicyUpdateOverlay/index.tsx | 14 +-- src/view/shell/index.tsx | 20 +++- src/view/shell/index.web.tsx | 5 +- 8 files changed, 166 insertions(+), 117 deletions(-) create mode 100644 src/components/PolicyUpdateOverlay/Portal.tsx create mode 100644 src/components/PolicyUpdateOverlay/context.tsx diff --git a/src/App.native.tsx b/src/App.native.tsx index 1bc232cfbd..4037eedd27 100644 --- a/src/App.native.tsx +++ b/src/App.native.tsx @@ -138,49 +138,51 @@ function InnerApp() { // Resets the entire tree below when it changes: key={currentAccount?.did}> - - - - - {/* LabelDefsProvider MUST come before ModerationOptsProvider */} - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + {/* LabelDefsProvider MUST come before ModerationOptsProvider */} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + @@ -221,18 +223,16 @@ function App() { - - - - - - - - - - - + + + + + + + + + diff --git a/src/App.web.tsx b/src/App.web.tsx index 37f9d0a3d7..2897aa3f2f 100644 --- a/src/App.web.tsx +++ b/src/App.web.tsx @@ -118,45 +118,47 @@ function InnerApp() { // Resets the entire tree below when it changes: key={currentAccount?.did}> - - - - - {/* LabelDefsProvider MUST come before ModerationOptsProvider */} - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + {/* LabelDefsProvider MUST come before ModerationOptsProvider */} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + @@ -197,13 +199,11 @@ function App() { - - - - - - - + + + + + diff --git a/src/components/PolicyUpdateOverlay/Overlay.tsx b/src/components/PolicyUpdateOverlay/Overlay.tsx index dd071ef15c..d55496c470 100644 --- a/src/components/PolicyUpdateOverlay/Overlay.tsx +++ b/src/components/PolicyUpdateOverlay/Overlay.tsx @@ -109,6 +109,7 @@ export function Overlay({ ({ + completed: true, + complete: () => {}, +}) + +export function usePolicyUpdateStateContext() { + const context = useContext(Context) + if (!context) { + throw new Error( + 'usePolicyUpdateStateContext must be used within a PolicyUpdateProvider', + ) + } + return context +} + +export function Provider({children}: {children?: ReactNode}) { + const state = usePolicyUpdateState() + + return ( + + state, [state])}> + {children} + + + ) +} diff --git a/src/components/PolicyUpdateOverlay/index.tsx b/src/components/PolicyUpdateOverlay/index.tsx index ab6e3dfbd9..1900dc27fd 100644 --- a/src/components/PolicyUpdateOverlay/index.tsx +++ b/src/components/PolicyUpdateOverlay/index.tsx @@ -3,18 +3,16 @@ import {View} from 'react-native' import {isIOS} from '#/platform/detection' import {atoms as a} from '#/alf' import {FullWindowOverlay} from '#/components/FullWindowOverlay' +import {usePolicyUpdateStateContext} from '#/components/PolicyUpdateOverlay/context' +import {Portal} from '#/components/PolicyUpdateOverlay/Portal' import {Content} from '#/components/PolicyUpdateOverlay/updates/202508' -import {usePolicyUpdateState} from '#/components/PolicyUpdateOverlay/usePolicyUpdateState' -import {createPortalGroup} from '#/components/Portal' -const portalGroup = createPortalGroup() - -export const Provider = portalGroup.Provider -export const Portal = portalGroup.Portal -export const Outlet = portalGroup.Outlet +export {Provider} from '#/components/PolicyUpdateOverlay/context' +export {usePolicyUpdateStateContext} from '#/components/PolicyUpdateOverlay/context' +export {Outlet} from '#/components/PolicyUpdateOverlay/Portal' export function PolicyUpdateOverlay() { - const state = usePolicyUpdateState() + const state = usePolicyUpdateStateContext() /* * See `window.clearNux` example in `/state/queries/nuxs` for a way to clear diff --git a/src/view/shell/index.tsx b/src/view/shell/index.tsx index 4962d459ae..0d8c245665 100644 --- a/src/view/shell/index.tsx +++ b/src/view/shell/index.tsx @@ -31,7 +31,10 @@ import {InAppBrowserConsentDialog} from '#/components/dialogs/InAppBrowserConsen import {LinkWarningDialog} from '#/components/dialogs/LinkWarning' import {MutedWordsDialog} from '#/components/dialogs/MutedWords' import {SigninDialog} from '#/components/dialogs/Signin' -import {Outlet as PolicyUpdateOverlayPortal} from '#/components/PolicyUpdateOverlay' +import { + Outlet as PolicyUpdateOverlayPortalOutlet, + usePolicyUpdateStateContext, +} from '#/components/PolicyUpdateOverlay' import {Outlet as PortalOutlet} from '#/components/Portal' import {RoutesContainer, TabsNavigator} from '#/Navigation' import {BottomSheetOutlet} from '../../../modules/bottom-sheet' @@ -46,6 +49,7 @@ function ShellInner() { const setIsDrawerOpen = useSetDrawerOpen() const winDim = useWindowDimensions() const insets = useSafeAreaInsets() + const policyUpdateState = usePolicyUpdateStateContext() const renderDrawerContent = useCallback(() => , []) const onOpenDrawer = useCallback( @@ -152,6 +156,7 @@ function ShellInner() { + @@ -161,11 +166,16 @@ function ShellInner() { - - - {/* MUST BE LAST */} - + {/* Until policy update has been completed by the user, don't render anything that is portaled */} + {policyUpdateState.completed && ( + <> + + + + )} + + ) } diff --git a/src/view/shell/index.web.tsx b/src/view/shell/index.web.tsx index c6d926c9eb..968ff754a6 100644 --- a/src/view/shell/index.web.tsx +++ b/src/view/shell/index.web.tsx @@ -22,7 +22,7 @@ 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 PolicyUpdateOverlayPortal} from '#/components/PolicyUpdateOverlay' +import {Outlet as PolicyUpdateOverlayPortalOutlet} from '#/components/PolicyUpdateOverlay' import {Outlet as PortalOutlet} from '#/components/Portal' import {FlatNavigator, RoutesContainer} from '#/Navigation' import {Composer} from './Composer.web' @@ -115,8 +115,7 @@ function ShellInner() { )} - {/* MUST BE LAST */} - + ) }