fix: 优化路由和加载组件

components/Masonry.tsx

@@ -62,10 +62,12 @@ export default function Masonry(props : Readonly<ImageHandleProps>) {
           </div>
         )}
       />
-      {isValidating && <Spinner label="Loading..." color="primary" className="mx-auto w-full my-6" />}
       <div className="flex items-center justify-center my-4">
         {
-          size < pageTotal ?
+          isValidating ?
+            <Spinner label="Loading..." color="primary" />
+            :
+          size < pageTotal &&
             <Button
               color="primary"
               variant="bordered"
@@ -76,8 +78,6 @@ export default function Masonry(props : Readonly<ImageHandleProps>) {
             >
               加载更多
             </Button>
-            :
-            <></>
         }
       </div>
       <MasonryItem />

components/layout/Header.tsx

@@ -3,17 +3,20 @@ import Logo from '~/components/layout/Logo'
 import DynamicNavbar from '~/components/layout/DynamicNavbar'
 import HeaderLink from '~/components/layout/HeaderLink'
 import { fetchTagsShow } from '~/server/lib/query'
-import { HandleProps } from '~/types'
+import {  LinkProps } from '~/types'
 
-export default function Header() {
+export default async function Header() {
   const getData = async () => {
     'use server'
     return await fetchTagsShow()
   }
 
-  const props: HandleProps = {
+  const data = await getData()
+
+  const props: LinkProps = {
     handle: getData,
     args: 'headerLink',
+    data: data
   }
 
   return (

components/layout/HeaderLink.tsx

@@ -1,13 +1,16 @@
 'use client'
 
 import { Button } from '@nextui-org/react'
-import { TagType, HandleProps } from '~/types'
-import { useSWRHydrated } from '~/hooks/useSWRHydrated'
+import { TagType, LinkProps } from '~/types'
 import { usePathname } from 'next/navigation'
 import { useRouter } from 'next-nprogress-bar'
+import useSWR from 'swr'
 
-export default function HeaderLink(props: Readonly<HandleProps>) {
-  const { data } = useSWRHydrated(props)
+export default function HeaderLink(props: Readonly<LinkProps>) {
+  const { data } = useSWR(props.args,
+    () => {
+      return props.handle
+    }, { revalidateOnFocus: false, fallbackData: props.data })
   const pathname = usePathname()
   const router = useRouter()
 

types/index.ts

@@ -19,6 +19,7 @@ export type ImageHandleProps = {
 export type LinkProps = {
   handle: () => any
   args: string
+  data: any
 }
 
 export type TagType = {