Show tabs when swiping feeds (#1856)

zio/stable
dan 2023-11-09 21:45:31 +00:00 committed by GitHub
parent 7a55ca6133
commit c627a766cd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 3 deletions

View File

@ -26,6 +26,9 @@ interface Props {
renderTabBar: RenderTabBarFn renderTabBar: RenderTabBarFn
onPageSelected?: (index: number) => void onPageSelected?: (index: number) => void
onPageSelecting?: (index: number) => void onPageSelecting?: (index: number) => void
onPageScrollStateChanged?: (
scrollState: 'idle' | 'dragging' | 'settling',
) => void
testID?: string testID?: string
} }
export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>( export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>(
@ -35,6 +38,7 @@ export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>(
tabBarPosition = 'top', tabBarPosition = 'top',
initialPage = 0, initialPage = 0,
renderTabBar, renderTabBar,
onPageScrollStateChanged,
onPageSelected, onPageSelected,
onPageSelecting, onPageSelecting,
testID, testID,
@ -97,11 +101,12 @@ export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>(
[lastOffset, lastDirection, onPageSelecting], [lastOffset, lastDirection, onPageSelecting],
) )
const onPageScrollStateChanged = React.useCallback( const handlePageScrollStateChanged = React.useCallback(
(e: PageScrollStateChangedNativeEvent) => { (e: PageScrollStateChangedNativeEvent) => {
scrollState.current = e.nativeEvent.pageScrollState scrollState.current = e.nativeEvent.pageScrollState
onPageScrollStateChanged?.(e.nativeEvent.pageScrollState)
}, },
[scrollState], [scrollState, onPageScrollStateChanged],
) )
const onTabBarSelect = React.useCallback( const onTabBarSelect = React.useCallback(
@ -123,7 +128,7 @@ export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>(
ref={pagerView} ref={pagerView}
style={s.flex1} style={s.flex1}
initialPage={initialPage} initialPage={initialPage}
onPageScrollStateChanged={onPageScrollStateChanged} onPageScrollStateChanged={handlePageScrollStateChanged}
onPageSelected={onPageSelectedInner} onPageSelected={onPageSelectedInner}
onPageScroll={onPageScroll}> onPageScroll={onPageScroll}>
{children} {children}

View File

@ -85,6 +85,15 @@ export const HomeScreen = withAuthRequired(
store.emitScreenSoftReset() store.emitScreenSoftReset()
}, [store]) }, [store])
const onPageScrollStateChanged = React.useCallback(
(state: 'idle' | 'dragging' | 'settling') => {
if (state === 'dragging') {
setMinimalShellMode(false)
}
},
[setMinimalShellMode],
)
const renderTabBar = React.useCallback( const renderTabBar = React.useCallback(
(props: RenderTabBarFnProps) => { (props: RenderTabBarFnProps) => {
return ( return (
@ -113,6 +122,7 @@ export const HomeScreen = withAuthRequired(
ref={pagerRef} ref={pagerRef}
testID="homeScreen" testID="homeScreen"
onPageSelected={onPageSelected} onPageSelected={onPageSelected}
onPageScrollStateChanged={onPageScrollStateChanged}
renderTabBar={renderTabBar} renderTabBar={renderTabBar}
tabBarPosition="top"> tabBarPosition="top">
<FeedPage <FeedPage