feat: change all Link component to SmartLink

Close #3512

themes/medium/components/ArticleAround.js

@@ -1,4 +1,4 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 
 /**
  * 上一篇，下一篇文章
@@ -11,22 +11,22 @@ 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.slug}`}
         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.slug}`}
         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/medium/components/ArticleInfo.js

@@ -1,5 +1,5 @@
 import LazyImage from '@/components/LazyImage'
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { siteConfig } from '@/lib/config'
 import NotionIcon from '@/components/NotionIcon'
 
@@ -25,7 +25,7 @@ export default function ArticleInfo(props) {
                     <i className="mr-1 fas fa-eye" /><span className="busuanzi_value_page_pv" />
                 </div>
             </div>
-            <Link href="/about" passHref legacyBehavior>
+            <SmartLink href="/about" passHref legacyBehavior>
                 <div className='flex pt-2'>
                     <LazyImage src={siteInfo?.icon} className='rounded-full cursor-pointer' width={22} alt={siteConfig('AUTHOR')} />
 
@@ -33,7 +33,7 @@ export default function ArticleInfo(props) {
                         {siteConfig('AUTHOR')}
                     </div>
                 </div>
-            </Link>
+            </SmartLink>
         </section>
     </>)
 }

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

@@ -4,7 +4,7 @@ import NotionPage from '@/components/NotionPage'
 import TwikooCommentCount from '@/components/TwikooCommentCount'
 import { siteConfig } from '@/lib/config'
 import { useGlobal } from '@/lib/global'
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import CONFIG from '../config'
 import CategoryItem from './CategoryItem'
 import TagItemMini from './TagItemMini'
@@ -22,7 +22,7 @@ const BlogPostCard = ({ post, showSummary }) => {
       data-aos-anchor-placement='top-bottom'
       className='mb-6 max-w-7xl border-b dark:border-gray-800 '>
       <header className='lg:py-8 py-4 flex flex-col w-full'>
-        <Link
+        <SmartLink
           href={post?.href}
           passHref
           className={
@@ -43,7 +43,7 @@ const BlogPostCard = ({ post, showSummary }) => {
             )}
             {post.title}
           </h2>
-        </Link>
+        </SmartLink>
 
         <div
           className={
@@ -73,13 +73,13 @@ const BlogPostCard = ({ post, showSummary }) => {
             <NotionPage post={post} />
             <div className='pointer-events-none border-t pt-8 border-dashed'>
               <div className='w-full justify-start flex'>
-                <Link
+                <SmartLink
                   href={post?.href}
                   passHref
                   className='hover:bg-opacity-100 hover:scale-105 duration-200 pointer-events-auto transform font-bold text-green-500 cursor-pointer'>
                   {locale.COMMON.ARTICLE_DETAIL}
                   <i className='ml-1 fas fa-angle-right' />
-                </Link>
+                </SmartLink>
               </div>
             </div>
           </div>

themes/medium/components/BottomMenuBar.js

@@ -1,4 +1,4 @@
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 import { useMediumGlobal } from '..'
 import JumpToTopButton from './JumpToTopButton'
 
@@ -17,11 +17,11 @@ export default function BottomMenuBar({ post, className }) {
         className
       }>
       <div className='flex justify-between h-full shadow-card'>
-        <Link href='/search' passHref legacyBehavior>
+        <SmartLink href='/search' passHref legacyBehavior>
           <div className='flex w-full items-center justify-center cursor-pointer'>
             <i className='fas fa-search' />
           </div>
-        </Link>
+        </SmartLink>
         <div className='flex w-full items-center justify-center cursor-pointer z-20'>
           <JumpToTopButton />
         </div>
@@ -33,11 +33,11 @@ export default function BottomMenuBar({ post, className }) {
           </div>
         )}
         {!showTocButton && (
-          <Link href='/' passHref legacyBehavior>
+          <SmartLink href='/' passHref legacyBehavior>
             <div className='flex w-full items-center justify-center cursor-pointer'>
               <i className='fas fa-home' />
             </div>
-          </Link>
+          </SmartLink>
         )}
       </div>
     </div>

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

@@ -1,12 +1,12 @@
 import { siteConfig } from '@/lib/config'
-import Link from 'next/link'
+import SmartLink from '@/components/SmartLink'
 
 export default function LogoBar(props) {
   return (
     <div id='top-wrapper' className='w-full flex items-center '>
-      <Link href='/' className='logo text-md md:text-xl dark:text-gray-200'>
+      <SmartLink href='/' className='logo text-md md:text-xl dark:text-gray-200'>
         {siteConfig('TITLE')}
-      </Link>
+      </SmartLink>
     </div>
   )
 }

themes/medium/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/medium/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={sLink.id}
                 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/medium/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/medium/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/medium/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/medium/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>
   )
 }