feat: scroll to top when jumping to the current page

src/pages/primary/MePage/index.tsx

@@ -13,10 +13,10 @@ import { cn } from '@/lib/utils'
 import { useSecondaryPage } from '@/PageManager'
 import { useNostr } from '@/providers/NostrProvider'
 import { ArrowDownUp, ChevronRight, LogOut, Settings, UserRound } from 'lucide-react'
-import { HTMLProps, useState } from 'react'
+import { forwardRef, HTMLProps, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 
-export default function MePage() {
+const MePage = forwardRef((_, ref) => {
   const { t } = useTranslation()
   const { push } = useSecondaryPage()
   const { pubkey } = useNostr()
@@ -25,7 +25,7 @@ export default function MePage() {
 
   if (!pubkey) {
     return (
-      <PrimaryPageLayout pageName="home" titlebar={<MePageTitlebar />}>
+      <PrimaryPageLayout ref={ref} pageName="home" titlebar={<MePageTitlebar />}>
         <div className="flex flex-col p-4 gap-4 overflow-auto">
           <AccountManager />
         </div>
@@ -34,7 +34,7 @@ export default function MePage() {
   }
 
   return (
-    <PrimaryPageLayout pageName="home" titlebar={<MePageTitlebar />}>
+    <PrimaryPageLayout ref={ref} pageName="home" titlebar={<MePageTitlebar />}>
       <div className="flex gap-4 items-center p-4">
         <SimpleUserAvatar userId={pubkey} size="big" />
         <div className="space-y-1">
@@ -71,7 +71,9 @@ export default function MePage() {
       <LogoutDialog open={logoutDialogOpen} setOpen={setLogoutDialogOpen} />
     </PrimaryPageLayout>
   )
-}
+})
+MePage.displayName = 'MePage'
+export default MePage
 
 function MePageTitlebar() {
   const { push } = useSecondaryPage()

src/pages/primary/NoteListPage/index.tsx

@@ -4,16 +4,18 @@ import { Button } from '@/components/ui/button'
 import PrimaryPageLayout from '@/layouts/PrimaryPageLayout'
 import { useFeed } from '@/providers/FeedProvider'
 import { useNostr } from '@/providers/NostrProvider'
-import { useEffect, useRef } from 'react'
+import { TPageRef } from '@/types'
+import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react'
 import { useTranslation } from 'react-i18next'
 import FeedButton from './FeedButton'
 import SearchButton from './SearchButton'
 
-export default function NoteListPage() {
+const NoteListPage = forwardRef((_, ref) => {
   const { t } = useTranslation()
-  const layoutRef = useRef<{ scrollToTop: () => void }>(null)
+  const layoutRef = useRef<TPageRef>(null)
   const { pubkey, checkLogin } = useNostr()
   const { feedType, relayUrls, isReady, filter } = useFeed()
+  useImperativeHandle(ref, () => layoutRef.current)
 
   useEffect(() => {
     if (layoutRef.current) {
@@ -46,7 +48,9 @@ export default function NoteListPage() {
       {content}
     </PrimaryPageLayout>
   )
-}
+})
+NoteListPage.displayName = 'NoteListPage'
+export default NoteListPage
 
 function NoteListPageTitlebar({ temporaryRelayUrls = [] }: { temporaryRelayUrls?: string[] }) {
   return (

src/pages/primary/NotificationListPage/index.tsx

@@ -1,11 +1,13 @@
 import NotificationList from '@/components/NotificationList'
 import PrimaryPageLayout from '@/layouts/PrimaryPageLayout'
 import { Bell } from 'lucide-react'
+import { forwardRef } from 'react'
 import { useTranslation } from 'react-i18next'
 
-export default function NotificationListPage() {
+const NotificationListPage = forwardRef((_, ref) => {
   return (
     <PrimaryPageLayout
+      ref={ref}
       pageName="notifications"
       titlebar={<NotificationListPageTitlebar />}
       displayScrollToTopButton
@@ -15,7 +17,9 @@ export default function NotificationListPage() {
       </div>
     </PrimaryPageLayout>
   )
-}
+})
+NotificationListPage.displayName = 'NotificationListPage'
+export default NotificationListPage
 
 function NotificationListPageTitlebar() {
   const { t } = useTranslation()