feat: change all Link component to SmartLink

Close #3512

themes/gitbook/components/ArticleAround.js

@@ -1,5 +1,5 @@
 import { useGlobal } from '@/lib/global'
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 
 /**
  * 上一篇，下一篇文章
@@ -15,7 +15,7 @@ export default function ArticleAround({ prev, next }) {
 
   return (
     <section className='text-gray-800 dark:text-gray-400 flex items-center justify-between gap-x-3 my-4'>
-      <Link
+      <SmartLink
         href={prev.href}
         passHref
         className='rounded border w-full h-20 px-3 cursor-pointer justify-between items-center flex hover:text-green-500 duration-300'>
@@ -24,9 +24,9 @@ export default function ArticleAround({ prev, next }) {
           <div>{locale.COMMON.PREV_POST}</div>
           <div>{prev.title}</div>
         </div>
-      </Link>
+      </SmartLink>
 
-      <Link
+      <SmartLink
         href={next.href}
         passHref
         className='rounded border w-full h-20 px-3 cursor-pointer justify-between items-center flex hover:text-green-500 duration-300'>
@@ -35,7 +35,7 @@ export default function ArticleAround({ prev, next }) {
           <div> {next.title}</div>
         </div>
         <i className='ml-1 my-1 fas fa-angle-right' />
-      </Link>
+      </SmartLink>
     </section>
   )
 }

themes/gitbook/components/BlogArchiveItem.js

@@ -1,4 +1,4 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 
 /**
  * 归档分组
@@ -20,12 +20,12 @@ export default function BlogArchiveItem({ archiveTitle, archivePosts }) {
               <div id={post?.publishDay}>
                 <span className='text-gray-400'>{post.date?.start_date}</span>{' '}
                 &nbsp;
-                <Link
+                <SmartLink
                   passHref
                   href={post?.href}
                   className='dark:text-gray-400  dark:hover:text-gray-300 overflow-x-hidden hover:underline cursor-pointer text-gray-600'>
                   {post.title}
-                </Link>
+                </SmartLink>
               </div>
             </li>
           )

themes/gitbook/components/BlogPostCard.js

@@ -1,7 +1,7 @@
 import Badge from '@/components/Badge'
 import NotionIcon from '@/components/NotionIcon'
 import { siteConfig } from '@/lib/config'
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { useRouter } from 'next/router'
 
 const BlogPostCard = ({ post, className }) => {
@@ -10,7 +10,7 @@ const BlogPostCard = ({ post, className }) => {
     decodeURIComponent(router.asPath.split('?')[0]) === post?.href
 
   return (
-    <Link href={post?.href} passHref>
+    <SmartLink href={post?.href} passHref>
       <div
         key={post.id}
         className={`${className} relative py-1.5 cursor-pointer px-1.5 rounded-md hover:bg-gray-50
@@ -26,7 +26,7 @@ const BlogPostCard = ({ post, className }) => {
           <Badge />
         )}
       </div>
-    </Link>
+    </SmartLink>
   )
 }
 

themes/gitbook/components/CategoryItem.js

@@ -1,8 +1,8 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 
 export default function CategoryItem ({ selected, category, categoryCount }) {
   return (
-    <Link
+    <SmartLink
       href={`/category/${category}`}
       passHref
       className={(selected
@@ -13,6 +13,6 @@ export default function CategoryItem ({ selected, category, categoryCount }) {
       <div><i className={`mr-2 fas ${selected ? 'fa-folder-open' : 'fa-folder'}`} />{category} {categoryCount && `(${categoryCount})`}
       </div>
 
-    </Link>
+    </SmartLink>
   );
 }

themes/gitbook/components/LeftMenuBar.js

@@ -1,14 +1,14 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 
 export default function LeftMenuBar () {
   return (
     <div className='w-20  border-r hidden lg:block pt-12'>
       <section>
-        <Link href='/' legacyBehavior>
+        <SmartLink href='/' legacyBehavior>
           <div className='text-center cursor-pointer  hover:text-black'>
             <i className='fas fa-home text-gray-500'/>
           </div>
-        </Link>
+        </SmartLink>
       </section>
     </div>
   );

themes/gitbook/components/LogoBar.js

@@ -1,6 +1,6 @@
 import LazyImage from '@/components/LazyImage'
 import { siteConfig } from '@/lib/config'
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import CONFIG from '../config'
 
 /**
@@ -12,7 +12,7 @@ export default function LogoBar(props) {
   const { siteInfo } = props
   return (
     <div id='logo-wrapper' className='w-full flex items-center mr-2'>
-      <Link
+      <SmartLink
         href={`/${siteConfig('GITBOOK_INDEX_PAGE', '', CONFIG)}`}
         className='flex text-lg font-bold md:text-2xl dark:text-gray-200'>
         <LazyImage
@@ -23,7 +23,7 @@ export default function LogoBar(props) {
           className='mr-2 hidden md:block '
         />
         {siteInfo?.title || siteConfig('TITLE')}
-      </Link>
+      </SmartLink>
     </div>
   )
 }

themes/gitbook/components/MenuItemCollapse.js

@@ -1,5 +1,5 @@
 import Collapse from '@/components/Collapse'
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { useRouter } from 'next/router'
 import { useState } from 'react'
 
@@ -42,7 +42,7 @@ export const MenuItemCollapse = props => {
         }
         onClick={toggleShow}>
         {!hasSubMenu && (
-          <Link
+          <SmartLink
             href={link?.href}
             target={link?.target}
             className='py-2 w-full my-auto items-center justify-between flex  '>
@@ -50,7 +50,7 @@ export const MenuItemCollapse = props => {
               <div className={`${link.icon} text-center w-4 mr-4`} />
               {link.name}
             </div>
-          </Link>
+          </SmartLink>
         )}
 
         {hasSubMenu && (
@@ -79,14 +79,14 @@ export const MenuItemCollapse = props => {
                 className='
               not:last-child:border-b-0 border-b dark:border-gray-800 py-2 px-14 cursor-pointer hover:bg-gray-100 dark:text-gray-200
               font-extralight dark:bg-black text-left justify-start text-gray-600 bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200'>
-                <Link href={sLink.href} target={link?.target}>
+                <SmartLink href={sLink.href} target={link?.target}>
                   <div>
                     <div
                       className={`${sLink.icon} text-center w-3 mr-3 text-xs`}
                     />
                     {sLink.title}
                   </div>
-                </Link>
+                </SmartLink>
               </div>
             )
           })}

themes/gitbook/components/MenuItemDrop.js

@@ -1,4 +1,4 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { useRouter } from 'next/router'
 import { useState } from 'react'
 
@@ -24,9 +24,9 @@ export const MenuItemDrop = ({ link }) => {
               ? 'bg-green-600 text-white hover:text-white'
               : 'hover:text-green-600')
           }>
-          <Link href={link?.href} target={link?.target}>
+          <SmartLink href={link?.href} target={link?.target}>
             {link?.icon && <i className={link?.icon} />} {link?.name}
-          </Link>
+          </SmartLink>
         </div>
       )}
 
@@ -56,12 +56,12 @@ export const MenuItemDrop = ({ link }) => {
                 <li
                   key={index}
                   className='not:last-child:border-b-0 border-b text-gray-700 dark:text-gray-200  hover:bg-gray-50 dark:hover:bg-gray-900 tracking-widest transition-all duration-200  dark:border-gray-800 py-3 pr-6 pl-3'>
-                  <Link href={sLink.href} target={link?.target}>
+                  <SmartLink href={sLink.href} target={link?.target}>
                     <span className='text-xs'>
                       {link?.icon && <i className={sLink?.icon}> &nbsp; </i>}
                       {sLink.title}
                     </span>
-                  </Link>
+                  </SmartLink>
                 </li>
               )
             })}

themes/gitbook/components/MenuItemMobileNormal.js

@@ -1,4 +1,4 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { useRouter } from 'next/router'
 
 export const NormalMenu = props => {
@@ -12,7 +12,7 @@ export const NormalMenu = props => {
   const selected = router.pathname === link.href || router.asPath === link.href
 
   return (
-    <Link
+    <SmartLink
       key={link?.href}
       title={link.name}
       href={link.href}
@@ -24,6 +24,6 @@ export const NormalMenu = props => {
         <div className={'hover:text-black'}>{link.name}</div>
       </div>
       {link.slot}
-    </Link>
+    </SmartLink>
   )
 }

themes/gitbook/components/MenuItemPCNormal.js

@@ -1,4 +1,4 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { useRouter } from 'next/router'
 
 export const MenuItemPCNormal = props => {
@@ -10,7 +10,7 @@ export const MenuItemPCNormal = props => {
   }
 
   return (
-    <Link
+    <SmartLink
       key={`${link.id}-${link.slug}`}
       title={link.name}
       href={link.href}
@@ -25,6 +25,6 @@ export const MenuItemPCNormal = props => {
         <div className='ml-2 whitespace-nowrap'>{link.name}</div>
       </div>
       {link.slot}
-    </Link>
+    </SmartLink>
   )
 }

themes/gitbook/components/PaginationSimple.js

@@ -1,4 +1,4 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { useRouter } from 'next/router'
 import { useGlobal } from '@/lib/global'
 
@@ -18,7 +18,7 @@ const PaginationSimple = ({ page, totalPage }) => {
 
   return (
     <div className="my-10 flex justify-between font-medium text-black dark:text-gray-100 space-x-2">
-      <Link
+      <SmartLink
         href={{
           pathname:
             currentPage === 2
@@ -33,8 +33,8 @@ const PaginationSimple = ({ page, totalPage }) => {
         } text-center w-full duration-200 px-4 py-2 hover:border-green-500 border-b-2 hover:font-bold`}>
         ←{locale.PAGINATION.PREV}
 
-      </Link>
-      <Link
+      </SmartLink>
+      <SmartLink
         href={{
           pathname: `${pagePrefix}/page/${currentPage + 1}`,
           query: router.query.s ? { s: router.query.s } : {}
@@ -46,7 +46,7 @@ const PaginationSimple = ({ page, totalPage }) => {
         } text-center w-full duration-200 px-4 py-2 hover:border-green-500 border-b-2 hover:font-bold`}>
 
         {locale.PAGINATION.NEXT}→
-      </Link>
+      </SmartLink>
     </div>
   )
 }

themes/gitbook/components/TagItemMini.js

@@ -1,8 +1,8 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 
 const TagItemMini = ({ tag, selected = false }) => {
   return (
-    <Link
+    <SmartLink
       key={tag}
       href={selected ? '/' : `/tag/${encodeURIComponent(tag.name)}`}
       passHref
@@ -14,7 +14,7 @@ const TagItemMini = ({ tag, selected = false }) => {
 
       <div className='font-light dark:text-gray-400'>{selected && <i className='mr-1 fas fa-tag'/>} {tag.name + (tag.count ? `(${tag.count})` : '')} </div>
 
-    </Link>
+    </SmartLink>
   )
 }
 

themes/gitbook/index.js

@@ -16,7 +16,7 @@ import { getShortId } from '@/lib/utils/pageId'
 import { SignIn, SignUp } from '@clerk/nextjs'
 import dynamic from 'next/dynamic'
 import Head from 'next/head'
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { useRouter } from 'next/router'
 import { createContext, useContext, useEffect, useRef, useState } from 'react'
 import Announcement from './components/Announcement'
@@ -479,7 +479,7 @@ const LayoutCategoryIndex = props => {
         <div id='category-list' className='duration-200 flex flex-wrap'>
           {categoryOptions?.map(category => {
             return (
-              <Link
+              <SmartLink
                 key={category.name}
                 href={`/category/${category.name}`}
                 passHref
@@ -491,7 +491,7 @@ const LayoutCategoryIndex = props => {
                   <i className='mr-4 fas fa-folder' />
                   {category.name}({category.count})
                 </div>
-              </Link>
+              </SmartLink>
             )
           })}
         </div>