Show tabs when swiping feeds (#1856)
parent
7a55ca6133
commit
c627a766cd
|
@ -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}
|
||||||
|
|
|
@ -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
|
||||||
|
|
Loading…
Reference in New Issue