Fix scroll on native (#2170)
parent
8929ff526f
commit
ab04074197
|
@ -12,4 +12,4 @@
|
|||
// - https://github.com/software-mansion/react-native-reanimated/issues/5364
|
||||
//
|
||||
// It's great when it works though.
|
||||
export {useAnimatedScrollHandler as useAnimatedScrollHandler_FIXED} from 'react-native-reanimated'
|
||||
export {useAnimatedScrollHandler} from 'react-native-reanimated'
|
||||
|
|
|
@ -1,45 +1,44 @@
|
|||
import {useRef, useEffect} from 'react'
|
||||
import {useAnimatedScrollHandler as useAnimatedScrollHandler_BUGGY} from 'react-native-reanimated'
|
||||
|
||||
export const useAnimatedScrollHandler_FIXED: typeof useAnimatedScrollHandler_BUGGY =
|
||||
(config, deps) => {
|
||||
const ref = useRef(config)
|
||||
useEffect(() => {
|
||||
ref.current = config
|
||||
})
|
||||
return useAnimatedScrollHandler_BUGGY(
|
||||
{
|
||||
onBeginDrag(e, ctx) {
|
||||
if (typeof ref.current !== 'function' && ref.current.onBeginDrag) {
|
||||
ref.current.onBeginDrag(e, ctx)
|
||||
}
|
||||
},
|
||||
onEndDrag(e, ctx) {
|
||||
if (typeof ref.current !== 'function' && ref.current.onEndDrag) {
|
||||
ref.current.onEndDrag(e, ctx)
|
||||
}
|
||||
},
|
||||
onMomentumBegin(e, ctx) {
|
||||
if (
|
||||
typeof ref.current !== 'function' &&
|
||||
ref.current.onMomentumBegin
|
||||
) {
|
||||
ref.current.onMomentumBegin(e, ctx)
|
||||
}
|
||||
},
|
||||
onMomentumEnd(e, ctx) {
|
||||
if (typeof ref.current !== 'function' && ref.current.onMomentumEnd) {
|
||||
ref.current.onMomentumEnd(e, ctx)
|
||||
}
|
||||
},
|
||||
onScroll(e, ctx) {
|
||||
if (typeof ref.current === 'function') {
|
||||
ref.current(e, ctx)
|
||||
} else if (ref.current.onScroll) {
|
||||
ref.current.onScroll(e, ctx)
|
||||
}
|
||||
},
|
||||
export const useAnimatedScrollHandler: typeof useAnimatedScrollHandler_BUGGY = (
|
||||
config,
|
||||
deps,
|
||||
) => {
|
||||
const ref = useRef(config)
|
||||
useEffect(() => {
|
||||
ref.current = config
|
||||
})
|
||||
return useAnimatedScrollHandler_BUGGY(
|
||||
{
|
||||
onBeginDrag(e, ctx) {
|
||||
if (typeof ref.current !== 'function' && ref.current.onBeginDrag) {
|
||||
ref.current.onBeginDrag(e, ctx)
|
||||
}
|
||||
},
|
||||
deps,
|
||||
)
|
||||
}
|
||||
onEndDrag(e, ctx) {
|
||||
if (typeof ref.current !== 'function' && ref.current.onEndDrag) {
|
||||
ref.current.onEndDrag(e, ctx)
|
||||
}
|
||||
},
|
||||
onMomentumBegin(e, ctx) {
|
||||
if (typeof ref.current !== 'function' && ref.current.onMomentumBegin) {
|
||||
ref.current.onMomentumBegin(e, ctx)
|
||||
}
|
||||
},
|
||||
onMomentumEnd(e, ctx) {
|
||||
if (typeof ref.current !== 'function' && ref.current.onMomentumEnd) {
|
||||
ref.current.onMomentumEnd(e, ctx)
|
||||
}
|
||||
},
|
||||
onScroll(e, ctx) {
|
||||
if (typeof ref.current === 'function') {
|
||||
ref.current(e, ctx)
|
||||
} else if (ref.current.onScroll) {
|
||||
ref.current.onScroll(e, ctx)
|
||||
}
|
||||
},
|
||||
},
|
||||
deps,
|
||||
)
|
||||
}
|
||||
|
|
|
@ -19,7 +19,7 @@ import {OnScrollHandler} from '#/lib/hooks/useOnMainScroll'
|
|||
import {logger} from '#/logger'
|
||||
import {Trans} from '@lingui/macro'
|
||||
import {cleanError} from '#/lib/strings/errors'
|
||||
import {useAnimatedScrollHandler_FIXED} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {useAnimatedScrollHandler} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {useTheme} from '#/lib/ThemeContext'
|
||||
import {usePreferencesQuery} from '#/state/queries/preferences'
|
||||
import {hydrateFeedGenerator} from '#/state/queries/feed'
|
||||
|
@ -184,7 +184,7 @@ export const ProfileFeedgens = React.forwardRef<
|
|||
[error, refetch, onPressRetryLoadMore, pal, preferences],
|
||||
)
|
||||
|
||||
const scrollHandler = useAnimatedScrollHandler_FIXED(onScroll || {})
|
||||
const scrollHandler = useAnimatedScrollHandler(onScroll || {})
|
||||
return (
|
||||
<View testID={testID} style={style}>
|
||||
<FlatList
|
||||
|
|
|
@ -17,7 +17,7 @@ import Animated, {
|
|||
useAnimatedStyle,
|
||||
useSharedValue,
|
||||
} from 'react-native-reanimated'
|
||||
import {useAnimatedScrollHandler_FIXED} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {useAnimatedScrollHandler} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {Gesture, GestureDetector} from 'react-native-gesture-handler'
|
||||
|
||||
import useImageDimensions from '../../hooks/useImageDimensions'
|
||||
|
@ -61,7 +61,7 @@ const ImageItem = ({imageSrc, onTap, onZoom, onRequestClose}: Props) => {
|
|||
}
|
||||
})
|
||||
|
||||
const scrollHandler = useAnimatedScrollHandler_FIXED({
|
||||
const scrollHandler = useAnimatedScrollHandler({
|
||||
onScroll(e) {
|
||||
const nextIsScaled = e.zoomScale > 1
|
||||
translationY.value = nextIsScaled ? 0 : e.contentOffset.y
|
||||
|
|
|
@ -20,7 +20,7 @@ import {OnScrollHandler} from '#/lib/hooks/useOnMainScroll'
|
|||
import {logger} from '#/logger'
|
||||
import {Trans} from '@lingui/macro'
|
||||
import {cleanError} from '#/lib/strings/errors'
|
||||
import {useAnimatedScrollHandler_FIXED} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {useAnimatedScrollHandler} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {useTheme} from '#/lib/ThemeContext'
|
||||
import {FeedLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder'
|
||||
import {isNative} from '#/platform/detection'
|
||||
|
@ -187,7 +187,7 @@ export const ProfileLists = React.forwardRef<SectionRef, ProfileListsProps>(
|
|||
[error, refetch, onPressRetryLoadMore, pal],
|
||||
)
|
||||
|
||||
const scrollHandler = useAnimatedScrollHandler_FIXED(onScroll || {})
|
||||
const scrollHandler = useAnimatedScrollHandler(onScroll || {})
|
||||
return (
|
||||
<View testID={testID} style={style}>
|
||||
<FlatList
|
||||
|
|
|
@ -7,7 +7,7 @@ import {ErrorMessage} from '../util/error/ErrorMessage'
|
|||
import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn'
|
||||
import {EmptyState} from '../util/EmptyState'
|
||||
import {OnScrollHandler} from 'lib/hooks/useOnMainScroll'
|
||||
import {useAnimatedScrollHandler_FIXED} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {useAnimatedScrollHandler} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {s} from 'lib/styles'
|
||||
import {usePalette} from 'lib/hooks/usePalette'
|
||||
import {useNotificationFeedQuery} from '#/state/queries/notifications/feed'
|
||||
|
@ -135,7 +135,7 @@ export function Feed({
|
|||
[isFetchingNextPage],
|
||||
)
|
||||
|
||||
const scrollHandler = useAnimatedScrollHandler_FIXED(onScroll || {})
|
||||
const scrollHandler = useAnimatedScrollHandler(onScroll || {})
|
||||
return (
|
||||
<View style={s.hContentRegion}>
|
||||
{error && (
|
||||
|
|
|
@ -18,7 +18,7 @@ import {LoadMoreRetryBtn} from '../util/LoadMoreRetryBtn'
|
|||
import {OnScrollHandler} from 'lib/hooks/useOnMainScroll'
|
||||
import {useAnalytics} from 'lib/analytics/analytics'
|
||||
import {usePalette} from 'lib/hooks/usePalette'
|
||||
import {useAnimatedScrollHandler_FIXED} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {useAnimatedScrollHandler} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {useTheme} from 'lib/ThemeContext'
|
||||
import {logger} from '#/logger'
|
||||
import {
|
||||
|
@ -271,7 +271,7 @@ let Feed = ({
|
|||
)
|
||||
}, [isFetchingNextPage, shouldRenderEndOfFeed, renderEndOfFeed, headerOffset])
|
||||
|
||||
const scrollHandler = useAnimatedScrollHandler_FIXED(onScroll || {})
|
||||
const scrollHandler = useAnimatedScrollHandler(onScroll || {})
|
||||
return (
|
||||
<View testID={testID} style={style}>
|
||||
<FlatList
|
||||
|
|
|
@ -46,7 +46,7 @@ import {logger} from '#/logger'
|
|||
import {Trans, msg} from '@lingui/macro'
|
||||
import {useLingui} from '@lingui/react'
|
||||
import {useModalControls} from '#/state/modals'
|
||||
import {useAnimatedScrollHandler_FIXED} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {useAnimatedScrollHandler} from '#/lib/hooks/useAnimatedScrollHandler_FIXED'
|
||||
import {
|
||||
useFeedSourceInfoQuery,
|
||||
FeedSourceFeedInfo,
|
||||
|
@ -572,7 +572,7 @@ function AboutSection({
|
|||
}) {
|
||||
const pal = usePalette('default')
|
||||
const {_} = useLingui()
|
||||
const scrollHandler = useAnimatedScrollHandler_FIXED(onScroll)
|
||||
const scrollHandler = useAnimatedScrollHandler(onScroll)
|
||||
const [likeUri, setLikeUri] = React.useState(feedInfo.likeUri)
|
||||
const {hasSession} = useSession()
|
||||
const {track} = useAnalytics()
|
||||
|
|
Loading…
Reference in New Issue