diff options
Diffstat (limited to 'src/view/shell/index.tsx')
-rw-r--r-- | src/view/shell/index.tsx | 50 |
1 files changed, 18 insertions, 32 deletions
diff --git a/src/view/shell/index.tsx b/src/view/shell/index.tsx index 1ab045d75..8dbbbea6f 100644 --- a/src/view/shell/index.tsx +++ b/src/view/shell/index.tsx @@ -1,18 +1,15 @@ -import React from 'react' -import {BackHandler, StyleSheet, useWindowDimensions, View} from 'react-native' +import {useCallback, useEffect} from 'react' +import {BackHandler, useWindowDimensions, View} from 'react-native' import {Drawer} from 'react-native-drawer-layout' import {useSafeAreaInsets} from 'react-native-safe-area-context' -import * as NavigationBar from 'expo-navigation-bar' import {StatusBar} from 'expo-status-bar' import {useNavigation, useNavigationState} from '@react-navigation/native' import {useDedupe} from '#/lib/hooks/useDedupe' import {useIntentHandler} from '#/lib/hooks/useIntentHandler' import {useNotificationsHandler} from '#/lib/hooks/useNotificationHandler' -import {usePalette} from '#/lib/hooks/usePalette' import {useNotificationsRegistration} from '#/lib/notifications/notifications' import {isStateAtTabRoot} from '#/lib/routes/helpers' -import {useTheme} from '#/lib/ThemeContext' import {isAndroid, isIOS} from '#/platform/detection' import {useDialogStateControlContext} from '#/state/dialogs' import {useSession} from '#/state/session' @@ -25,30 +22,31 @@ import {useCloseAnyActiveElement} from '#/state/util' 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 as useNewTheme} from '#/alf' +import {atoms as a, select, useTheme} from '#/alf' +import {setNavigationBar} from '#/alf/util/navigationBar' 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 {RoutesContainer, TabsNavigator} from '../../Navigation' import {Composer} from './Composer' import {DrawerContent} from './Drawer' function ShellInner() { - const t = useNewTheme() + const t = useTheme() const isDrawerOpen = useIsDrawerOpen() const isDrawerSwipeDisabled = useIsDrawerSwipeDisabled() const setIsDrawerOpen = useSetDrawerOpen() const winDim = useWindowDimensions() const insets = useSafeAreaInsets() - const renderDrawerContent = React.useCallback(() => <DrawerContent />, []) - const onOpenDrawer = React.useCallback( + const renderDrawerContent = useCallback(() => <DrawerContent />, []) + const onOpenDrawer = useCallback( () => setIsDrawerOpen(true), [setIsDrawerOpen], ) - const onCloseDrawer = React.useCallback( + const onCloseDrawer = useCallback( () => setIsDrawerOpen(false), [setIsDrawerOpen], ) @@ -59,7 +57,7 @@ function ShellInner() { useNotificationsRegistration() useNotificationsHandler() - React.useEffect(() => { + useEffect(() => { if (isAndroid) { const listener = BackHandler.addEventListener('hardwareBackPress', () => { return closeAnyActiveElement() @@ -79,7 +77,7 @@ function ShellInner() { // To be certain though, we will also dedupe these calls. const navigation = useNavigation() const dedupe = useDedupe(1000) - React.useEffect(() => { + useEffect(() => { if (!isAndroid) return const onFocusOrBlur = () => { setTimeout(() => { @@ -132,24 +130,18 @@ function ShellInner() { export const Shell: React.FC = function ShellImpl() { const {fullyExpandedCount} = useDialogStateControlContext() - const theme = useTheme() - const pal = usePalette('default') + const t = useTheme() useIntentHandler() - React.useEffect(() => { - if (isAndroid) { - NavigationBar.setBackgroundColorAsync(theme.palette.default.background) - NavigationBar.setBorderColorAsync(theme.palette.default.background) - NavigationBar.setButtonStyleAsync( - theme.colorScheme === 'dark' ? 'light' : 'dark', - ) - } - }, [theme]) + useEffect(() => { + setNavigationBar('theme', t) + }, [t]) + return ( - <View testID="mobileShellView" style={[styles.outerContainer, pal.view]}> + <View testID="mobileShellView" style={[a.h_full, t.atoms.bg]}> <StatusBar style={ - theme.colorScheme === 'dark' || (isIOS && fullyExpandedCount > 0) + t.name !== 'light' || (isIOS && fullyExpandedCount > 0) ? 'light' : 'dark' } @@ -161,9 +153,3 @@ export const Shell: React.FC = function ShellImpl() { </View> ) } - -const styles = StyleSheet.create({ - outerContainer: { - height: '100%', - }, -}) |