77 lines
4.2 KiB
TypeScript
77 lines
4.2 KiB
TypeScript
import Image from "next/image";
|
|
import Link from "next/link";
|
|
import { ArrowLeftIcon, ArrowUpRightIcon } from "lucide-react";
|
|
import { notFound, redirect } from "next/navigation";
|
|
import { connection } from "next/server";
|
|
|
|
import { AdminHeader } from "@/components/admin/admin-header";
|
|
import { EditorPresence } from "@/components/admin/editor-presence";
|
|
import { ExtraOverview } from "@/components/admin/guide-extra-controls";
|
|
import { GuideOverviewForm } from "@/components/admin/guide-overview-form";
|
|
import { GuideSectionNav } from "@/components/admin/guide-section-nav";
|
|
import { GuideVisibilityControl } from "@/components/admin/guide-visibility-control";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Card, CardAction, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { getAdminSession } from "@/lib/auth/server";
|
|
import { getGuideByCharacterKey } from "@/lib/guides/queries";
|
|
import { navigationIconPath } from "@/lib/navigation";
|
|
|
|
const sections = [
|
|
{ slug: "weapon", title: "Weapons", description: "จัดอันดับอาวุธ Refinement และเปอร์เซ็นต์" },
|
|
{ slug: "artifact", title: "Artifacts & Stats", description: "ชุด Artifact, Main/Sub Stats และ Talent" },
|
|
{ slug: "constellations", title: "Constellations", description: "รายละเอียด C1–C6 และเปอร์เซ็นต์สะสม" },
|
|
{ slug: "team", title: "Team Calc", description: "ตัวละคร 4 ตัว Damage share, DPS และ Combo" },
|
|
];
|
|
|
|
export const instant = false;
|
|
|
|
export default async function GuideOverviewPage({ params }: { params: Promise<{ character: string }> }) {
|
|
await connection();
|
|
if (!(await getAdminSession())) redirect("/admin/login");
|
|
const { character } = await params;
|
|
const guide = await getGuideByCharacterKey(character);
|
|
if (!guide) notFound();
|
|
const extras = guide.sections
|
|
.filter((section) => section.kind === "extra")
|
|
.map(({ id, slug, title }) => ({ id, slug, title }));
|
|
|
|
return (
|
|
<div className="min-h-svh">
|
|
<AdminHeader />
|
|
<main className="mx-auto flex w-full max-w-6xl flex-col gap-8 p-4 sm:p-6 lg:p-8">
|
|
<header className="flex flex-wrap items-center gap-4">
|
|
<Button variant="ghost" size="icon" render={<Link href="/admin" />} nativeButton={false} aria-label="กลับ Dashboard">
|
|
<ArrowLeftIcon />
|
|
</Button>
|
|
<div className="relative size-16 overflow-hidden rounded-lg border">
|
|
<Image src={guide.coverUrl} alt={guide.name} fill sizes="64px" className="object-cover" />
|
|
</div>
|
|
<div className="min-w-0 flex-1">
|
|
<p className="text-sm text-muted-foreground">เลือกส่วนที่ต้องการแก้ไข</p>
|
|
<h1 className="font-heading text-3xl font-semibold">{guide.name}</h1>
|
|
<EditorPresence guideId={guide.id} section="Overview" />
|
|
</div>
|
|
<GuideVisibilityControl guideId={guide.id} guideName={guide.name} isPublic={guide.isPublic} />
|
|
</header>
|
|
<GuideSectionNav guideId={guide.id} characterKey={guide.characterKey} current="overview" extras={extras} />
|
|
<GuideOverviewForm key={guide.version} guide={guide} />
|
|
<div className="grid gap-4 md:grid-cols-2">
|
|
{sections.map(({ slug, title, description }) => (
|
|
<Link key={slug} href={`/admin/${guide.characterKey}/${slug}`} prefetch={false} className="rounded-xl outline-none focus-visible:ring-2 focus-visible:ring-ring">
|
|
<Card className="h-full transition-colors hover:bg-muted/50">
|
|
<CardHeader>
|
|
{navigationIconPath(slug) ? <Image src={navigationIconPath(slug)!} alt="" width={40} height={40} className="size-10 object-contain" /> : null}
|
|
<CardTitle>{title}</CardTitle>
|
|
<CardDescription>{description}</CardDescription>
|
|
<CardAction><ArrowUpRightIcon aria-hidden="true" className="size-5 text-primary" /></CardAction>
|
|
</CardHeader>
|
|
</Card>
|
|
</Link>
|
|
))}
|
|
</div>
|
|
<ExtraOverview guideId={guide.id} characterKey={guide.characterKey} initialVersion={guide.version} initialExtras={extras} />
|
|
</main>
|
|
</div>
|
|
);
|
|
}
|