Remove onPageSelecting event

It's difficult to tell what exactly it's supposed to represent, and in practice it's not really used aside from logging. Let's rip it out for now to keep other changes simpler.
This commit is contained in:
Dan Abramov
2024-11-26 20:01:53 +00:00
parent 972fb887ec
commit 06d03fff94
6 changed files with 12 additions and 63 deletions
-6
View File
@@ -80,12 +80,6 @@ export type LogEvents = {
feedUrl: string
feedType: string
index: number
reason:
| 'focus'
| 'tabbar-click'
| 'pager-swipe'
| 'desktop-sidebar-click'
| 'starter-pack-initial-feed'
}
'feed:endReached': {
feedUrl: string
+4 -20
View File
@@ -6,16 +6,12 @@ import PagerView, {
PageScrollStateChangedNativeEvent,
} from 'react-native-pager-view'
import {LogEvents} from '#/lib/statsig/events'
import {atoms as a, native} from '#/alf'
export type PageSelectedEvent = PagerViewOnPageSelectedEvent
export interface PagerRef {
setPage: (
index: number,
reason: LogEvents['home:feedDisplayed']['reason'],
) => void
setPage: (index: number) => void
}
export interface RenderTabBarFnProps {
@@ -29,10 +25,6 @@ interface Props {
initialPage?: number
renderTabBar: RenderTabBarFn
onPageSelected?: (index: number) => void
onPageSelecting?: (
index: number,
reason: LogEvents['home:feedDisplayed']['reason'],
) => void
onPageScrollStateChanged?: (
scrollState: 'idle' | 'dragging' | 'settling',
) => void
@@ -46,7 +38,6 @@ export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>(
renderTabBar,
onPageScrollStateChanged,
onPageSelected,
onPageSelecting,
testID,
}: React.PropsWithChildren<Props>,
ref,
@@ -58,12 +49,8 @@ export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>(
const pagerView = React.useRef<PagerView>(null)
React.useImperativeHandle(ref, () => ({
setPage: (
index: number,
reason: LogEvents['home:feedDisplayed']['reason'],
) => {
setPage: (index: number) => {
pagerView.current?.setPage(index)
onPageSelecting?.(index, reason)
},
}))
@@ -92,14 +79,12 @@ export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>(
// -prf
if (scrollState.current === 'settling') {
if (lastDirection.current === -1 && offset < lastOffset.current) {
onPageSelecting?.(position, 'pager-swipe')
setSelectedPage(position)
lastDirection.current = 0
} else if (
lastDirection.current === 1 &&
offset > lastOffset.current
) {
onPageSelecting?.(position + 1, 'pager-swipe')
setSelectedPage(position + 1)
lastDirection.current = 0
}
@@ -112,7 +97,7 @@ export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>(
}
lastOffset.current = offset
},
[lastOffset, lastDirection, onPageSelecting],
[lastOffset, lastDirection],
)
const handlePageScrollStateChanged = React.useCallback(
@@ -126,9 +111,8 @@ export const Pager = forwardRef<PagerRef, React.PropsWithChildren<Props>>(
const onTabBarSelect = React.useCallback(
(index: number) => {
pagerView.current?.setPage(index)
onPageSelecting?.(index, 'tabbar-click')
},
[pagerView, onPageSelecting],
[pagerView],
)
return (
+5 -15
View File
@@ -2,7 +2,6 @@ import React from 'react'
import {View} from 'react-native'
import {flushSync} from 'react-dom'
import {LogEvents} from '#/lib/statsig/events'
import {s} from '#/lib/styles'
export interface RenderTabBarFnProps {
@@ -16,10 +15,6 @@ interface Props {
initialPage?: number
renderTabBar: RenderTabBarFn
onPageSelected?: (index: number) => void
onPageSelecting?: (
index: number,
reason: LogEvents['home:feedDisplayed']['reason'],
) => void
}
export const Pager = React.forwardRef(function PagerImpl(
{
@@ -27,7 +22,6 @@ export const Pager = React.forwardRef(function PagerImpl(
initialPage = 0,
renderTabBar,
onPageSelected,
onPageSelecting,
}: React.PropsWithChildren<Props>,
ref,
) {
@@ -36,16 +30,13 @@ export const Pager = React.forwardRef(function PagerImpl(
const anchorRef = React.useRef(null)
React.useImperativeHandle(ref, () => ({
setPage: (
index: number,
reason: LogEvents['home:feedDisplayed']['reason'],
) => {
onTabBarSelect(index, reason)
setPage: (index: number) => {
onTabBarSelect(index)
},
}))
const onTabBarSelect = React.useCallback(
(index: number, reason: LogEvents['home:feedDisplayed']['reason']) => {
(index: number) => {
const scrollY = window.scrollY
// We want to determine if the tabbar is already "sticking" at the top (in which
// case we should preserve and restore scroll), or if it is somewhere below in the
@@ -64,7 +55,6 @@ export const Pager = React.forwardRef(function PagerImpl(
flushSync(() => {
setSelectedPage(index)
onPageSelected?.(index)
onPageSelecting?.(index, reason)
})
if (isSticking) {
const restoredScrollY = scrollYs.current[index]
@@ -75,7 +65,7 @@ export const Pager = React.forwardRef(function PagerImpl(
}
}
},
[selectedPage, setSelectedPage, onPageSelected, onPageSelecting],
[selectedPage, setSelectedPage, onPageSelected],
)
return (
@@ -83,7 +73,7 @@ export const Pager = React.forwardRef(function PagerImpl(
{renderTabBar({
selectedPage,
tabBarAnchor: <View ref={anchorRef} />,
onSelect: e => onTabBarSelect(e, 'tabbar-click'),
onSelect: e => onTabBarSelect(e),
})}
{React.Children.map(children, (child, i) => (
<View style={selectedPage === i ? s.flex1 : s.hidden} key={`page-${i}`}>
-5
View File
@@ -182,17 +182,12 @@ export const PagerWithHeader = React.forwardRef<PagerRef, PagerWithHeaderProps>(
[onPageSelected, setCurrentPage],
)
const onPageSelecting = React.useCallback((index: number) => {
setCurrentPage(index)
}, [])
return (
<Pager
ref={ref}
testID={testID}
initialPage={initialPage}
onPageSelected={onPageSelectedInner}
onPageSelecting={onPageSelecting}
renderTabBar={renderTabBar}>
{toArray(children)
.filter(Boolean)
@@ -75,17 +75,12 @@ export const PagerWithHeader = React.forwardRef<PagerRef, PagerWithHeaderProps>(
[onPageSelected, setCurrentPage],
)
const onPageSelecting = React.useCallback((index: number) => {
setCurrentPage(index)
}, [])
return (
<Pager
ref={ref}
testID={testID}
initialPage={initialPage}
onPageSelected={onPageSelectedInner}
onPageSelecting={onPageSelecting}
renderTabBar={renderTabBar}>
{toArray(children)
.filter(Boolean)
+3 -12
View File
@@ -11,7 +11,7 @@ import {
HomeTabNavigatorParams,
NativeStackScreenProps,
} from '#/lib/routes/types'
import {logEvent, LogEvents} from '#/lib/statsig/statsig'
import {logEvent} from '#/lib/statsig/statsig'
import {isWeb} from '#/platform/detection'
import {emitSoftReset} from '#/state/events'
import {SavedFeedSourceInfo, usePinnedFeedsInfos} from '#/state/queries/feed'
@@ -121,7 +121,7 @@ function HomeScreenReady({
// This is supposed to only happen on the web when you use the right nav.
if (selectedIndex !== lastPagerReportedIndexRef.current) {
lastPagerReportedIndexRef.current = selectedIndex
pagerRef.current?.setPage(selectedIndex, 'desktop-sidebar-click')
pagerRef.current?.setPage(selectedIndex)
}
}, [selectedIndex])
@@ -158,21 +158,13 @@ function HomeScreenReady({
const feed = allFeeds[index]
setSelectedFeed(feed)
lastPagerReportedIndexRef.current = index
},
[setDrawerSwipeDisabled, setSelectedFeed, setMinimalShellMode, allFeeds],
)
const onPageSelecting = React.useCallback(
(index: number, reason: LogEvents['home:feedDisplayed']['reason']) => {
const feed = allFeeds[index]
logEvent('home:feedDisplayed', {
index,
feedType: feed.split('|')[0],
feedUrl: feed,
reason,
})
},
[allFeeds],
[setDrawerSwipeDisabled, setSelectedFeed, setMinimalShellMode, allFeeds],
)
const onPressSelected = React.useCallback(() => {
@@ -228,7 +220,6 @@ function HomeScreenReady({
ref={pagerRef}
testID="homeScreen"
initialPage={selectedIndex}
onPageSelecting={onPageSelecting}
onPageSelected={onPageSelected}
onPageScrollStateChanged={onPageScrollStateChanged}
renderTabBar={renderTabBar}>