Disable animation on scrollToTop for web (#2137)

This commit is contained in:
Paul Frazee 2023-12-07 13:41:02 -08:00 committed by GitHub
parent f115969f50
commit 940fc0ea5c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 36 additions and 9 deletions

View file

@ -26,6 +26,7 @@ import {
import {RQKEY as NOTIFS_RQKEY} from '#/state/queries/notifications/feed'
import {listenSoftReset, emitSoftReset} from '#/state/events'
import {truncateAndInvalidate} from '#/state/queries/util'
import {isNative} from '#/platform/detection'
type Props = NativeStackScreenProps<
NotificationsTabNavigatorParams,
@ -47,7 +48,7 @@ export function NotificationsScreen({}: Props) {
// event handlers
// =
const scrollToTop = React.useCallback(() => {
scrollElRef.current?.scrollToOffset({offset: 0})
scrollElRef.current?.scrollToOffset({animated: isNative, offset: 0})
resetMainScroll()
}, [scrollElRef, resetMainScroll])

View file

@ -38,6 +38,7 @@ import {listenSoftReset} from '#/state/events'
import {truncateAndInvalidate} from '#/state/queries/util'
import {Text} from '#/view/com/util/text/Text'
import {usePalette} from 'lib/hooks/usePalette'
import {isNative} from '#/platform/detection'
interface SectionRef {
scrollToTop: () => void
@ -419,7 +420,10 @@ const FeedSection = React.forwardRef<SectionRef, FeedSectionProps>(
const [hasNew, setHasNew] = React.useState(false)
const onScrollToTop = React.useCallback(() => {
scrollElRef.current?.scrollToOffset({offset: -headerHeight})
scrollElRef.current?.scrollToOffset({
animated: isNative,
offset: -headerHeight,
})
truncateAndInvalidate(queryClient, FEED_RQKEY(feed))
setHasNew(false)
}, [scrollElRef, headerHeight, queryClient, feed, setHasNew])

View file

@ -65,6 +65,7 @@ import {useSession} from '#/state/session'
import {useLikeMutation, useUnlikeMutation} from '#/state/queries/like'
import {useComposerControls} from '#/state/shell/composer'
import {truncateAndInvalidate} from '#/state/queries/util'
import {isNative} from '#/platform/detection'
const SECTION_TITLES = ['Posts', 'About']
@ -511,7 +512,10 @@ const FeedSection = React.forwardRef<SectionRef, FeedSectionProps>(
const queryClient = useQueryClient()
const onScrollToTop = useCallback(() => {
scrollElRef.current?.scrollToOffset({offset: -headerHeight})
scrollElRef.current?.scrollToOffset({
animated: isNative,
offset: -headerHeight,
})
truncateAndInvalidate(queryClient, FEED_RQKEY(feed))
setHasNew(false)
}, [scrollElRef, headerHeight, queryClient, feed, setHasNew])

View file

@ -54,7 +54,7 @@ import {
import {cleanError} from '#/lib/strings/errors'
import {useSession} from '#/state/session'
import {useComposerControls} from '#/state/shell/composer'
import {isWeb} from '#/platform/detection'
import {isNative, isWeb} from '#/platform/detection'
import {truncateAndInvalidate} from '#/state/queries/util'
import {
usePreferencesQuery,
@ -563,7 +563,10 @@ const FeedSection = React.forwardRef<SectionRef, FeedSectionProps>(
const [hasNew, setHasNew] = React.useState(false)
const onScrollToTop = useCallback(() => {
scrollElRef.current?.scrollToOffset({offset: -headerHeight})
scrollElRef.current?.scrollToOffset({
animated: isNative,
offset: -headerHeight,
})
queryClient.resetQueries({queryKey: FEED_RQKEY(feed)})
setHasNew(false)
}, [scrollElRef, headerHeight, queryClient, feed, setHasNew])
@ -633,7 +636,10 @@ const AboutSection = React.forwardRef<SectionRef, AboutSectionProps>(
)
const onScrollToTop = useCallback(() => {
scrollElRef.current?.scrollToOffset({offset: -headerHeight})
scrollElRef.current?.scrollToOffset({
animated: isNative,
offset: -headerHeight,
})
}, [scrollElRef, headerHeight])
React.useImperativeHandle(ref, () => ({