From 9e6ea982d990a4c39ef067e58a1330138666e457 Mon Sep 17 00:00:00 2001
From: Innei <i@innei.in>
Date: Fri, 28 Jul 2023 14:06:01 +0800
Subject: [PATCH] fix: header item navigation loop

---
 src/components/layout/header/config.ts                | 11 +++++------
 .../layout/header/internal/HeaderContent.tsx          |  7 +++++--
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/components/layout/header/config.ts b/src/components/layout/header/config.ts
index 1b0317ad50..928a6a9e46 100644
--- a/src/components/layout/header/config.ts
+++ b/src/components/layout/header/config.ts
@@ -8,7 +8,6 @@ import {
   FaSolidDotCircle,
   FaSolidFeatherAlt,
   FaSolidHistory,
-  FaSolidSubway,
   FaSolidUserFriends,
   IcTwotoneSignpost,
   IonBook,
@@ -95,9 +94,9 @@ export const headerMenuConfig: IHeaderMenu[] = [
       },
     ],
   },
-  {
-    title: '开往',
-    icon: h(FaSolidSubway),
-    path: 'https://travellings.link',
-  },
+  // {
+  //   title: '开往',
+  //   icon: h(FaSolidSubway),
+  //   path: 'https://travellings.link',
+  // },
 ]
diff --git a/src/components/layout/header/internal/HeaderContent.tsx b/src/components/layout/header/internal/HeaderContent.tsx
index 480093c6cb..195e24d2be 100644
--- a/src/components/layout/header/internal/HeaderContent.tsx
+++ b/src/components/layout/header/internal/HeaderContent.tsx
@@ -190,9 +190,11 @@ function AnimatedItem({
   className?: string
   isActive?: boolean
 }) {
+  const isExternal = href.startsWith('http')
+  const As = isExternal ? 'a' : Link
   return (
     <div>
-      <Link
+      <As
         href={href}
         className={clsxm(
           'relative block whitespace-nowrap px-4 py-2 transition',
@@ -200,6 +202,7 @@ function AnimatedItem({
           isActive ? 'active' : '',
           className,
         )}
+        target={isExternal ? '_blank' : undefined}
       >
         {children}
         {isActive && (
@@ -211,7 +214,7 @@ function AnimatedItem({
             layoutId="active-nav-item"
           />
         )}
-      </Link>
+      </As>
     </div>
   )
 }