Fix learn 404, coin animation, full regions, and AI key errors.

Use numeric /learn/{num} routes, register Tailwind coin animations with方孔铜钱 UI, expand to 34 provinces, and surface missing OPENAI_API_KEY clearly. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-10 21:32:20 +08:00
parent 96b659fbe5
commit a487b17165
15 changed files with 931 additions and 159 deletions
@@ -0,0 +1,68 @@
+import Link from "next/link";
+import { notFound } from "next/navigation";
+import PageShell from "@/components/page-shell";
+import GuaFooter from "@/components/learn/gua-footer";
+import MarkdownContent from "@/components/learn/markdown-content";
+import {
+  getGuaName,
+  getGuaNumber,
+  guaNumFromMark,
+  listGuaMarks,
+  markFromNum,
+  readLearnMarkdown,
+  stripFrontmatter,
+} from "@/lib/content/zhouyi";
+
+async function resolveGuaMark(slug: string): Promise<string | null> {
+  const decoded = decodeURIComponent(slug);
+  if (/^\d{1,2}$/.test(decoded)) {
+    return markFromNum(decoded, "traditional");
+  }
+  const marks = await listGuaMarks("traditional");
+  if (marks.includes(decoded)) {
+    return decoded;
+  }
+  if (/^\d{2}\./.test(decoded)) {
+    return marks.find((m) => m === decoded || m.startsWith(decoded.split(".")[0] + ".")) ?? null;
+  }
+  return null;
+}
+
+export async function generateStaticParams() {
+  return Array.from({ length: 64 }, (_, i) => ({
+    slug: String(i + 1).padStart(2, "0"),
+  }));
+}
+
+export const dynamicParams = true;
+
+export default async function GuaDetailPage({
+  params,
+}: {
+  params: Promise<{ slug: string }>;
+}) {
+  const { slug } = await params;
+  const guaMark = await resolveGuaMark(slug);
+  if (!guaMark) {
+    notFound();
+  }
+
+  const raw = await readLearnMarkdown(guaMark, "traditional");
+  const content = stripFrontmatter(raw);
+  const num = guaNumFromMark(guaMark);
+
+  return (
+    <PageShell className="max-w-3xl px-4 py-8">
+      <div className="mb-6 text-sm text-muted-foreground">
+        <Link href="/learn" className="hover:text-foreground">
+          ← 返回总览
+        </Link>
+      </div>
+      <div className="mb-4 text-sm text-muted-foreground">
+        第 {getGuaNumber(guaMark)} 卦 · {getGuaName(guaMark)}
+      </div>
+      <MarkdownContent content={content} variant="traditional" />
+      <GuaFooter guaMark={guaMark} guaNum={num} />
+    </PageShell>
+  );
+}