feat: scroll to top when switching explore tabs
This commit is contained in:
parent
579385ce3d
commit
158d875123
1 changed files with 7 additions and 2 deletions
|
|
@ -10,7 +10,7 @@ import { useUserTrust } from '@/providers/UserTrustProvider'
|
|||
import { TPageRef } from '@/types'
|
||||
import { Compass, Plus } from 'lucide-react'
|
||||
import { NostrEvent } from 'nostr-tools'
|
||||
import { forwardRef, useCallback, useMemo, useState } from 'react'
|
||||
import { forwardRef, useCallback, useMemo, useRef, useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
|
||||
type TExploreTabs = 'following' | 'explore' | 'reviews'
|
||||
|
|
@ -18,6 +18,7 @@ type TExploreTabs = 'following' | 'explore' | 'reviews'
|
|||
const ExplorePage = forwardRef<TPageRef>((_, ref) => {
|
||||
const { hideUntrustedNotes } = useUserTrust()
|
||||
const [tab, setTab] = useState<TExploreTabs>('explore')
|
||||
const topRef = useRef<HTMLDivElement | null>(null)
|
||||
|
||||
const relayReviewFilterFn = useCallback((evt: NostrEvent) => {
|
||||
const d = getReplaceableEventIdentifier(evt)
|
||||
|
|
@ -61,8 +62,12 @@ const ExplorePage = forwardRef<TPageRef>((_, ref) => {
|
|||
{ value: 'reviews', label: 'Reviews' },
|
||||
{ value: 'following', label: "Following's Favorites" }
|
||||
]}
|
||||
onTabChange={(tab) => setTab(tab as TExploreTabs)}
|
||||
onTabChange={(tab) => {
|
||||
setTab(tab as TExploreTabs)
|
||||
topRef.current?.scrollIntoView({ behavior: 'instant' })
|
||||
}}
|
||||
/>
|
||||
<div ref={topRef} className="scroll-mt-[calc(6rem+1px)]" />
|
||||
{content}
|
||||
</PrimaryPageLayout>
|
||||
)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue