'app下载页

app/components/Community.tsx

@@ -3,14 +3,16 @@
 import { Link, useTranslation } from "@/i18n/navigation";
 import ShopCard from "./ShopCard";
 
-const linkKeys = ["guide", "discord", "tools", "github", "feishu", "destinations"] as const;
+const linkKeys = ["github", "destinations", "appDownload"] as const;
 const linkIcons: Record<(typeof linkKeys)[number], string> = {
-  guide: "📖",
-  discord: "💬",
-  tools: "🛒",
   github: "📦",
-  feishu: "📝",
   destinations: "🗺️",
+  appDownload: "📱",
+};
+const linkHrefs: Record<(typeof linkKeys)[number], { href: string; newTab?: boolean }> = {
+  github: { href: "https://github.com" },
+  destinations: { href: "#" },
+  appDownload: { href: "/app" },
 };
 
 export default function Community() {
@@ -67,12 +69,9 @@ export default function Community() {
           </Link>
         </div>
 
-        <div className="text-center">
-          <div className="mb-2 text-sm font-semibold text-slate-400 dark:text-slate-500">
-            {t("openSource")}
-          </div>
+        <div id="resources" className="text-center">
           <h2 className="text-3xl font-bold tracking-tight text-slate-900 dark:text-slate-100 sm:text-4xl">
-            {t("contributeTitle")} <span className="gradient-text">{t("contributeHighlight")}</span>
+            <span className="gradient-text">{t("resourcesTitle")}</span>
           </h2>
           <p className="mx-auto mt-4 max-w-2xl text-lg text-slate-600 dark:text-slate-400">
             {t("contributeSubtitle")}
@@ -82,37 +81,34 @@ export default function Community() {
         </div>
 
         <div className="mt-12 grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
-          {linkKeys.map((key) => (
-            <div
-              key={key}
-              className="card-hover flex items-start gap-4 rounded-xl border border-slate-100 bg-white p-5 shadow-sm dark:border-slate-800 dark:bg-slate-900"
-            >
-              <span className="flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-slate-50 text-xl dark:bg-slate-800">
-                {linkIcons[key]}
-              </span>
-              <div>
-                <h4 className="font-bold text-slate-900 dark:text-slate-100">{t(`links.${key}.title`)}</h4>
-                <p className="mt-1 text-sm text-slate-500 dark:text-slate-400">{t(`links.${key}.desc`)}</p>
-                <span className="mt-2 inline-block text-sm font-medium text-sky-600">
-                  {t(`links.${key}.label`)}
+          {linkKeys.map((key) => {
+            const { href, newTab } = linkHrefs[key];
+            const content = (
+              <>
+                <span className="flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-slate-50 text-xl dark:bg-slate-800">
+                  {linkIcons[key]}
                 </span>
-              </div>
-            </div>
-          ))}
-        </div>
-
-        <div className="mt-12 text-center">
-          <div className="mb-4 text-lg font-bold text-slate-900 dark:text-slate-100">
-            {t("betterTitle")}
-          </div>
-          <p className="mb-6 text-slate-600 dark:text-slate-400">
-            {t("betterDesc")}
-            <br />
-            {t("betterDesc2")}
-          </p>
-          <button className="inline-flex items-center gap-2 rounded-full bg-slate-900 px-8 py-3 font-semibold text-white transition-colors hover:bg-slate-800 dark:bg-slate-100 dark:text-slate-900 dark:hover:bg-slate-200">
-            {t("starFork")}
-          </button>
+                <div>
+                  <h4 className="font-bold text-slate-900 dark:text-slate-100">{t(`links.${key}.title`)}</h4>
+                  <p className="mt-1 text-sm text-slate-500 dark:text-slate-400">{t(`links.${key}.desc`)}</p>
+                  <span className="mt-2 inline-block text-sm font-medium text-sky-600">
+                    {t(`links.${key}.label`)}
+                  </span>
+                </div>
+              </>
+            );
+            return (
+              <Link
+                key={key}
+                href={href}
+                target={newTab ? "_blank" : undefined}
+                rel={newTab ? "noopener noreferrer" : undefined}
+                className="card-hover flex items-start gap-4 rounded-xl border border-slate-100 bg-white p-5 shadow-sm dark:border-slate-800 dark:bg-slate-900"
+              >
+                {content}
+              </Link>
+            );
+          })}
         </div>
       </div>
     </section>

app/components/Header.tsx

@@ -11,6 +11,7 @@ const navLinks = [
   { labelKey: "tools" as const, href: "#tools" },
   { labelKey: "community" as const, href: "#community" },
   { labelKey: "shop" as const, href: "#shop" },
+  { labelKey: "resources" as const, href: "#resources" },
 ];
 
 export default function Header() {