manipulate headerMode directly
This commit is contained in:
@@ -12,7 +12,6 @@ export {
|
|||||||
useSetDrawerSwipeDisabled,
|
useSetDrawerSwipeDisabled,
|
||||||
} from './drawer-swipe-disabled'
|
} from './drawer-swipe-disabled'
|
||||||
export {
|
export {
|
||||||
useDangerouslyImperativelySetMinimalShellMode,
|
|
||||||
useEnableMinimalShellMode,
|
useEnableMinimalShellMode,
|
||||||
useEnableMinimalShellModeForScreen,
|
useEnableMinimalShellModeForScreen,
|
||||||
useMinimalShellMode,
|
useMinimalShellMode,
|
||||||
|
|||||||
@@ -104,41 +104,6 @@ export function useMinimalShellModeSetters() {
|
|||||||
return context
|
return context
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* Bypasses the refcount and directly animates the shell. Only for use in
|
|
||||||
* scroll/pager callbacks where the refcount is 0 but MainScrollProvider has
|
|
||||||
* hidden the header via direct shared-value manipulation.
|
|
||||||
* @deprecated Prefer `useEnableMinimalShellMode` or the `minimalShell` prop.
|
|
||||||
*/
|
|
||||||
export function useDangerouslyImperativelySetMinimalShellMode() {
|
|
||||||
const {headerMode, footerMode} = useMinimalShellMode()
|
|
||||||
|
|
||||||
const setMode = useCallback(
|
|
||||||
(v: boolean) => {
|
|
||||||
'worklet'
|
|
||||||
headerMode.set(() =>
|
|
||||||
withSpring(v ? 1 : 0, {
|
|
||||||
overshootClamping: true,
|
|
||||||
}),
|
|
||||||
)
|
|
||||||
footerMode.set(() =>
|
|
||||||
withSpring(v ? 1 : 0, {
|
|
||||||
overshootClamping: true,
|
|
||||||
}),
|
|
||||||
)
|
|
||||||
},
|
|
||||||
[headerMode, footerMode],
|
|
||||||
)
|
|
||||||
|
|
||||||
useFocusEffect(
|
|
||||||
useCallback(() => {
|
|
||||||
return () => setMode(false)
|
|
||||||
}, [setMode]),
|
|
||||||
)
|
|
||||||
|
|
||||||
return setMode
|
|
||||||
}
|
|
||||||
|
|
||||||
export function useEnableMinimalShellMode({enabled} = {enabled: true}) {
|
export function useEnableMinimalShellMode({enabled} = {enabled: true}) {
|
||||||
const setters = useMinimalShellModeSetters()
|
const setters = useMinimalShellModeSetters()
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
import {useCallback, useEffect, useLayoutEffect, useMemo, useRef} from 'react'
|
import {useCallback, useEffect, useLayoutEffect, useMemo, useRef} from 'react'
|
||||||
import {ActivityIndicator, StyleSheet} from 'react-native'
|
import {ActivityIndicator, StyleSheet} from 'react-native'
|
||||||
|
import {withSpring} from 'react-native-reanimated'
|
||||||
import {useFocusEffect} from '@react-navigation/native'
|
import {useFocusEffect} from '@react-navigation/native'
|
||||||
|
|
||||||
import {PROD_DEFAULT_FEED} from '#/lib/constants'
|
import {PROD_DEFAULT_FEED} from '#/lib/constants'
|
||||||
@@ -20,7 +21,7 @@ import {type FeedDescriptor, type FeedParams} from '#/state/queries/post-feed'
|
|||||||
import {usePreferencesQuery} from '#/state/queries/preferences'
|
import {usePreferencesQuery} from '#/state/queries/preferences'
|
||||||
import {type UsePreferencesQueryResponse} from '#/state/queries/preferences/types'
|
import {type UsePreferencesQueryResponse} from '#/state/queries/preferences/types'
|
||||||
import {useSession} from '#/state/session'
|
import {useSession} from '#/state/session'
|
||||||
import {useDangerouslyImperativelySetMinimalShellMode} from '#/state/shell'
|
import {useMinimalShellMode} from '#/state/shell'
|
||||||
import {useLoggedOutViewControls} from '#/state/shell/logged-out'
|
import {useLoggedOutViewControls} from '#/state/shell/logged-out'
|
||||||
import {useSelectedFeed, useSetSelectedFeed} from '#/state/shell/selected-feed'
|
import {useSelectedFeed, useSetSelectedFeed} from '#/state/shell/selected-feed'
|
||||||
import {FeedPage} from '#/view/com/feeds/FeedPage'
|
import {FeedPage} from '#/view/com/feeds/FeedPage'
|
||||||
@@ -138,7 +139,17 @@ function HomeScreenReady({
|
|||||||
}, [selectedIndex])
|
}, [selectedIndex])
|
||||||
|
|
||||||
const {hasSession} = useSession()
|
const {hasSession} = useSession()
|
||||||
const setMinimalShellMode = useDangerouslyImperativelySetMinimalShellMode()
|
const {headerMode} = useMinimalShellMode()
|
||||||
|
const showHeader = useCallback(() => {
|
||||||
|
'worklet'
|
||||||
|
headerMode.set(() => withSpring(0, {overshootClamping: true}))
|
||||||
|
}, [headerMode])
|
||||||
|
|
||||||
|
useFocusEffect(
|
||||||
|
useCallback(() => {
|
||||||
|
return () => showHeader()
|
||||||
|
}, [showHeader]),
|
||||||
|
)
|
||||||
|
|
||||||
useFocusEffect(
|
useFocusEffect(
|
||||||
useNonReactiveCallback(() => {
|
useNonReactiveCallback(() => {
|
||||||
@@ -155,7 +166,7 @@ function HomeScreenReady({
|
|||||||
|
|
||||||
const onPageSelected = useCallback(
|
const onPageSelected = useCallback(
|
||||||
(index: number) => {
|
(index: number) => {
|
||||||
setMinimalShellMode(false)
|
showHeader()
|
||||||
const maybeFeed = allFeeds[index]
|
const maybeFeed = allFeeds[index]
|
||||||
|
|
||||||
// Mutate the ref before setting state to avoid the imperative syncing effect
|
// Mutate the ref before setting state to avoid the imperative syncing effect
|
||||||
@@ -171,7 +182,7 @@ function HomeScreenReady({
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[ax, setSelectedFeed, setMinimalShellMode, allFeeds],
|
[ax, setSelectedFeed, showHeader, allFeeds],
|
||||||
)
|
)
|
||||||
|
|
||||||
const onPressSelected = useCallback(() => {
|
const onPressSelected = useCallback(() => {
|
||||||
@@ -182,10 +193,10 @@ function HomeScreenReady({
|
|||||||
(state: 'idle' | 'dragging' | 'settling') => {
|
(state: 'idle' | 'dragging' | 'settling') => {
|
||||||
'worklet'
|
'worklet'
|
||||||
if (state === 'dragging') {
|
if (state === 'dragging') {
|
||||||
setMinimalShellMode(false)
|
showHeader()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[setMinimalShellMode],
|
[showHeader],
|
||||||
)
|
)
|
||||||
|
|
||||||
const [demoMode] = useDemoMode()
|
const [demoMode] = useDemoMode()
|
||||||
|
|||||||
Reference in New Issue
Block a user