feat(guides): add structured image-first editor

app/page.tsx

@@ -1,32 +1,12 @@
 import { connection } from "next/server";
 
-import { CharacterDirectory } from "@/components/public/character-directory";
-import { SiteHeader } from "@/components/public/site-header";
 import { LiveRefresh } from "@/components/live-refresh";
-import { loadPublicDirectory } from "@/lib/content/loaders";
+import { StructuredDirectory } from "@/components/public/structured-directory";
+import { SiteHeader } from "@/components/public/site-header";
+import { listGuideCards } from "@/lib/guides/queries";
 
 export default async function HomePage() {
   await connection();
-  const characters = await loadPublicDirectory();
-
-  return (
-    <div className="min-h-svh bg-background">
-      {process.env.BUZZ_DEMO_MODE === "true" ? null : (
-        <LiveRefresh endpoint="/api/events/directory" />
-      )}
-      <SiteHeader />
-      <main className="mx-auto w-full max-w-7xl px-4 py-10 sm:px-6 sm:py-14">
-        <header className="mb-8 max-w-3xl space-y-3">
-          <p className="text-sm font-medium text-primary">คลังคู่มือตัวละคร</p>
-          <h1 className="font-heading text-3xl font-semibold tracking-tight sm:text-4xl">
-            หาคู่มือที่ต้องการ แล้วเริ่มจัดทีมได้เลย
-          </h1>
-          <p className="text-base leading-7 text-muted-foreground sm:text-lg">
-            ค้นหาตามชื่อ ธาตุ หรือบทบาท ทุกหน้าจัดรูปแบบมาให้อ่านง่ายทั้งมือถือและเดสก์ท็อป
-          </p>
-        </header>
-        <CharacterDirectory characters={characters} />
-      </main>
-    </div>
-  );
+  const guides = await listGuideCards();
+  return <div className="min-h-svh bg-background"><LiveRefresh endpoint="/api/events/directory" /><SiteHeader /><main className="mx-auto flex w-full max-w-7xl flex-col gap-8 px-4 py-10 sm:px-6 sm:py-14"><header className="max-w-3xl"><p className="text-sm font-medium text-primary">Genshin Impact Build Guides</p><h1 className="mt-2 font-heading text-4xl font-semibold">เลือกตัวละคร แล้วจัด Build และ Team ได้เลย</h1><p className="mt-3 text-lg leading-8 text-muted-foreground">คู่มือแบบภาพ-first สำหรับ Weapons, Artifacts, Constellations และ Team Calc</p></header><StructuredDirectory guides={guides} /></main></div>;
 }