feat: change all Link component to SmartLink

Close #3512

themes/nav/components/ArticleAround.js

@@ -1,4 +1,4 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 
 /**
  * 上一篇，下一篇文章
@@ -11,20 +11,20 @@ export default function ArticleAround({ prev, next }) {
   }
   return (
     <section className='text-gray-800 dark:text-gray-400 h-12 flex items-center justify-between space-x-5 my-4'>
-      <Link
+      <SmartLink
         href={prev.href}
         passHref
         className='text-sm cursor-pointer justify-start items-center flex hover:underline duration-300'>
         <i className='mr-1 fas fa-angle-double-left' />
         {prev.title}
-      </Link>
-      <Link
+      </SmartLink>
+      <SmartLink
         href={next.href}
         passHref
         className='text-sm cursor-pointer justify-end items-center flex hover:underline duration-300'>
         {next.title}
         <i className='ml-1 my-1 fas fa-angle-double-right' />
-      </Link>
+      </SmartLink>
     </section>
   )
 }

themes/nav/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/nav/components/BlogPostCard.js

@@ -1,6 +1,6 @@
 import { siteConfig } from '@/lib/config'
 import { checkStartWithHttp } from '@/lib/utils'
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { useRouter } from 'next/router'
 import NotionIcon from './NotionIcon'
 
@@ -21,7 +21,7 @@ const BlogPostCard = ({ post, className }) => {
       ? post.pageIcon + '&width=88'
       : post.pageIcon
   return (
-    <Link
+    <SmartLink
       href={post?.href}
       target={checkStartWithHttp(post.slug) ? '_blank' : '_self'}
       passHref>
@@ -44,7 +44,7 @@ const BlogPostCard = ({ post, className }) => {
           </div>
         </div>
       </div>
-    </Link>
+    </SmartLink>
   )
 }
 

themes/nav/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/nav/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/nav/components/LogoBar.js

@@ -1,4 +1,4 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import CONFIG from '../config'
 import { siteConfig } from '@/lib/config'
 
@@ -12,12 +12,12 @@ export default function LogoBar(props) {
 
   return (
         <div id='top-wrapper' className='w-full flex items-center'>
-                <Link href='/' className='md:w-48 grid justify-items-center text-md md:text-xl dark:text-gray-200'>
+                <SmartLink href='/' className='md:w-48 grid justify-items-center text-md md:text-xl dark:text-gray-200'>
                     {/* eslint-disable-next-line @next/next/no-img-element */}
                     <img src={siteInfo?.icon?.replaceAll('width=400', 'width=280')}
                         height='44px' alt={siteConfig('AUTHOR') + ' - ' + siteConfig('NEXT_PUBLIC_BIO')} className='md:block transition-all hover:scale-110 duration-150' placeholderSrc='' />
                     {siteConfig('NAV_SHOW_TITLE_TEXT', null, CONFIG) && siteConfig('TITLE')}
-                </Link>
+                </SmartLink>
         </div>
   )
 }

themes/nav/components/MenuItem.js

@@ -1,4 +1,4 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { useState } from 'react'
 import Collapse from './Collapse'
 
@@ -43,14 +43,14 @@ export const MenuItem = ({ link }) => {
             </div>
           </>
         ) : (
-          <Link
+          <SmartLink
             href={url}
             className='dark:text-neutral-400 dark:hover:text-white font-bold w-full display-block'>
             <i
               className={`text-base ${link?.icon ? link?.icon : isAnchor ? 'fas fa-hashtag' : ''} mr-1`}
             />
             {link?.title}
-          </Link>
+          </SmartLink>
         )}
       </div>
 
@@ -63,14 +63,14 @@ export const MenuItem = ({ link }) => {
             const sUrl = sIsAnchor ? `#${sLink.name}` : sLink.href
             return (
               <div key={index} className='nav-submenu'>
-                <Link href={sUrl}>
+                <SmartLink href={sUrl}>
                   <span className='dark:text-neutral-400 text-gray-500 hover:text-black dark:hover:text-white text-xs font-bold'>
                     <i
                       className={`text-xs mr-1 ${sLink?.icon ? sLink?.icon : sIsAnchor ? 'fas fa-hashtag' : ''}`}
                     />
                     {sLink.title}
                   </span>
-                </Link>
+                </SmartLink>
               </div>
             )
           })}

themes/nav/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'
 
@@ -43,7 +43,7 @@ export const MenuItemCollapse = props => {
         }
         onClick={toggleShow}>
         {!hasSubMenu && (
-          <Link
+          <SmartLink
             href={url}
             target={link?.target}
             className='py-2 w-full my-auto items-center justify-between flex  '>
@@ -51,7 +51,7 @@ export const MenuItemCollapse = props => {
               <div className={`${link.icon} text-center w-4 mr-4`} />
               {link.name}
             </div>
-          </Link>
+          </SmartLink>
         )}
 
         {hasSubMenu && (
@@ -84,14 +84,14 @@ export const MenuItemCollapse = props => {
                 className='
               py-2 px-14 cursor-pointer hover:bg-gray-100 dark:text-gray-400 dark:hover:text-white font-bold 
               dark:bg-black text-left justify-start text-gray-600 bg-gray-50 bg-opacity-20 dark:hover:bg-gray-600 tracking-widest transition-all duration-200'>
-                <Link href={sUrl} target={'_self'}>
+                <SmartLink href={sUrl} target={'_self'}>
                   <div>
                     <div
                       className={`${sLink?.icon ? sLink?.icon : 'fas fa-hashtag'} text-center w-3 mr-2 text-xs`}
                     />
                     {sLink.title}
                   </div>
-                </Link>
+                </SmartLink>
               </div>
             )
           })}

themes/nav/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'
 
@@ -45,9 +45,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>
       )}
 
@@ -60,12 +60,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 font-extralight'>
                     {link?.icon && <i className={sLink?.icon}> &nbsp; </i>}
                     {sLink.title}
                   </span>
-                </Link>
+                </SmartLink>
               </li>
             )
           })}

themes/nav/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.href}
       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/nav/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.href}`}
       title={link.href}
       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/nav/components/NavPostList.js

@@ -1,5 +1,5 @@
 import NavPostListEmpty from './NavPostListEmpty'
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 
 /**
  * 博客列表滚动分页
@@ -18,7 +18,7 @@ const NavPostList = (props) => {
               // const selected = currentCategory === category.name
               const selected = false
               return (
-                    <Link
+                    <SmartLink
                         key={category.name}
                         href={`/category/${category.name}`}
                         passHref
@@ -29,7 +29,7 @@ const NavPostList = (props) => {
 
                         <div> <i className={`mr-2 fas ${selected ? 'fa-folder-open' : 'fa-folder'}`} />{category.name}({category.count})</div>
 
-                    </Link>
+                    </SmartLink>
               )
             })}
         </div>

themes/nav/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/nav/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>
   )
 }