63 lines
2.5 KiB
TypeScript
63 lines
2.5 KiB
TypeScript
import Link from "next/link";
|
|
import { notFound } from "next/navigation";
|
|
import { ArrowLeft } from "lucide-react";
|
|
import { rawDb } from "@/lib/db/client";
|
|
import { listImages } from "@/lib/db/queries";
|
|
import { MasonryGrid } from "@/components/grid/MasonryGrid";
|
|
import { RegisterVisible } from "@/components/select/RegisterVisible";
|
|
import { FilterBar } from "@/components/grid/FilterBar";
|
|
import { resolveSort } from "@/lib/sortServer";
|
|
import { parseFilterCriteria, statusToFlags } from "@/lib/filters";
|
|
|
|
export const dynamic = "force-dynamic";
|
|
|
|
export default async function GenrePage({
|
|
params,
|
|
searchParams,
|
|
}: {
|
|
params: Promise<{ slug: string }>;
|
|
searchParams: Promise<Record<string, string | string[] | undefined>>;
|
|
}) {
|
|
const { slug } = await params;
|
|
const sp = await searchParams;
|
|
const sort = await resolveSort(typeof sp.sort === "string" ? sp.sort : undefined);
|
|
const search = (typeof sp.q === "string" ? sp.q.trim() : "") || undefined;
|
|
const criteria = parseFilterCriteria(sp);
|
|
const g = rawDb.prepare(`SELECT id, name, slug FROM genres WHERE slug = ?`).get(decodeURIComponent(slug)) as { id: number; name: string; slug: string } | undefined;
|
|
if (!g) notFound();
|
|
const items = listImages({
|
|
genreId: g.id,
|
|
sort,
|
|
search,
|
|
...statusToFlags(criteria.status),
|
|
marks: criteria.marks,
|
|
actressIds: criteria.ids.actresses,
|
|
actressMode: criteria.mode.actresses,
|
|
studioIds: criteria.ids.studios,
|
|
seriesIds: criteria.ids.series,
|
|
genreIds: criteria.ids.genres,
|
|
genreMode: criteria.mode.genres,
|
|
collectionIds: criteria.ids.collections,
|
|
collectionMode: criteria.mode.collections,
|
|
tagIds: criteria.ids.tags,
|
|
tagMode: criteria.mode.tags,
|
|
categoryIds: criteria.ids.categories,
|
|
categoryMode: criteria.mode.categories,
|
|
});
|
|
|
|
return (
|
|
<div className="max-w-[1600px] mx-auto px-6 py-6 fade-in">
|
|
<Link href="/genres" className="inline-flex items-center gap-1 text-sm text-[var(--color-fg-dim)] hover:text-[var(--color-fg)] mb-4">
|
|
<ArrowLeft className="w-4 h-4" /> All genres
|
|
</Link>
|
|
<div className="mb-4">
|
|
<h1 className="text-3xl font-semibold tracking-tight mb-1 text-[var(--color-cyan)]">#{g.name}</h1>
|
|
<p className="text-[var(--color-fg-dim)]">{items.length} cover{items.length === 1 ? "" : "s"}</p>
|
|
</div>
|
|
<FilterBar current={{ kind: "genre", name: g.name }} criteria={criteria} sort={sort} />
|
|
<RegisterVisible ids={items.map((i) => i.id)} />
|
|
<MasonryGrid images={items} />
|
|
</div>
|
|
);
|
|
}
|