From 271e0c5b60d30e23e9368255f6dcd710489fbb95 Mon Sep 17 00:00:00 2001
From: hamster1963 <1410514192@qq.com>
Date: Tue, 19 Nov 2024 14:34:40 +0800
Subject: [PATCH] feat(header): custom links

---
 .env.example          |  1 +
 app/(main)/header.tsx | 32 ++++++++++++++++++++++++++++++++
 docker/.env.example   |  1 +
 3 files changed, 34 insertions(+)

diff --git a/.env.example b/.env.example
index 112204c..8cc537f 100644
--- a/.env.example
+++ b/.env.example
@@ -12,6 +12,7 @@ NEXT_PUBLIC_FixedTopServerName=false
 NEXT_PUBLIC_CustomLogo=https://nezha-cf.buycoffee.top/apple-touch-icon.png
 NEXT_PUBLIC_CustomTitle=NezhaDash
 NEXT_PUBLIC_CustomDescription=NezhaDash is a dashboard for Nezha.
+NEXT_PUBLIC_Links="[{"link":"https://github.com/hamster1963/nezha-dash","name":"GitHub"},{"link":"https://buycoffee.top/coffee","name":"Buycoffee☕️"}]"
 NEXT_PUBLIC_DisableIndex=false
 NEXT_PUBLIC_BASE_PATH=/
 NEXT_PUBLIC_ShowTagCount=false
diff --git a/app/(main)/header.tsx b/app/(main)/header.tsx
index d1dc802..2cb28a6 100644
--- a/app/(main)/header.tsx
+++ b/app/(main)/header.tsx
@@ -51,6 +51,7 @@ function Header() {
           </p>
         </section>
         <section className="flex items-center gap-2">
+          <Links />
           <LanguageSwitcher />
           <ModeToggle />
         </section>
@@ -60,6 +61,37 @@ function Header() {
   );
 }
 
+type links = {
+  link: string;
+  name: string;
+};
+
+function Links() {
+  const linksEnv = getEnv("NEXT_PUBLIC_Links");
+
+  const links: links[] | null = linksEnv ? JSON.parse(linksEnv) : null;
+
+  if (!links) return null;
+
+  return (
+    <div className="flex items-center gap-2">
+      {links.map((link, index) => {
+        return (
+          <a
+            key={index}
+            href={link.link}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="flex items-center gap-1 text-sm font-medium opacity-50 transition-opacity hover:opacity-100"
+          >
+            {link.name}
+          </a>
+        );
+      })}
+    </div>
+  );
+}
+
 // https://github.com/streamich/react-use/blob/master/src/useInterval.ts
 const useInterval = (callback: () => void, delay: number | null) => {
   const savedCallback = useRef<() => void>(() => {});
diff --git a/docker/.env.example b/docker/.env.example
index 244fd71..f597931 100644
--- a/docker/.env.example
+++ b/docker/.env.example
@@ -12,5 +12,6 @@ NEXT_PUBLIC_FixedTopServerName=false
 NEXT_PUBLIC_CustomLogo=https://nezha-cf.buycoffee.top/apple-touch-icon.png
 NEXT_PUBLIC_CustomTitle=NezhaDash
 NEXT_PUBLIC_CustomDescription=NezhaDash is a dashboard for Nezha.
+NEXT_PUBLIC_Links="[{"link":"https://github.com/hamster1963/nezha-dash","name":"GitHub"},{"link":"https://buycoffee.top/coffee","name":"Buycoffee☕️"}]"
 NEXT_PUBLIC_DisableIndex=false
 NEXT_PUBLIC_ShowTagCount=false
\ No newline at end of file