virtus
41aca718c9
- Replace Prisma database calls with API fetches from the reader API in GenreDetailPage, GenresPage, SearchPage, ChapterReaderPage, and NovelDetailPage. - Introduce new utility functions for API requests in server-api.ts, including error handling. - Update authentication flow in auth.ts to sync Google login with the reader API. - Modify NextAuth session and JWT types to include additional user information. - Clean up unused imports and code related to Prisma and MongoDB connections. - Adjust the configuration in next.config.mjs to remove unnecessary API routes.
65 lines
2.4 KiB
TypeScript
65 lines
2.4 KiB
TypeScript
import Link from "next/link"
|
|
import { BookOpen, Sparkles, Flame, Heart, Swords, Building2, Rocket, Crown, Laugh, Search, Shield } from "lucide-react"
|
|
import { readerApiFetch } from "@/lib/server-api"
|
|
|
|
const iconMap: Record<string, React.ReactNode> = {
|
|
Sparkles: <Sparkles className="h-6 w-6" />,
|
|
Flame: <Flame className="h-6 w-6" />,
|
|
Heart: <Heart className="h-6 w-6" />,
|
|
Sword: <Swords className="h-6 w-6" />,
|
|
Building: <Building2 className="h-6 w-6" />,
|
|
Rocket: <Rocket className="h-6 w-6" />,
|
|
Crown: <Crown className="h-6 w-6" />,
|
|
Laugh: <Laugh className="h-6 w-6" />,
|
|
Search: <Search className="h-6 w-6" />,
|
|
Shield: <Shield className="h-6 w-6" />,
|
|
}
|
|
|
|
export const dynamic = "force-dynamic"
|
|
|
|
type GenreItem = {
|
|
id: string
|
|
name: string
|
|
slug: string
|
|
description: string | null
|
|
icon: string | null
|
|
novelCount: number
|
|
}
|
|
|
|
export default async function GenresPage() {
|
|
let genres: GenreItem[] = []
|
|
|
|
try {
|
|
genres = await readerApiFetch<GenreItem[]>("/api/genres")
|
|
} catch (error) {
|
|
console.error("Failed to fetch genres during build/runtime", error)
|
|
}
|
|
|
|
return (
|
|
<div className="mx-auto max-w-6xl px-4 py-6">
|
|
<h1 className="mb-6 text-2xl font-bold text-foreground">Thể Loại Truyện</h1>
|
|
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
|
|
{genres.map((genre) => {
|
|
const novelCount = genre.novelCount
|
|
return (
|
|
<Link
|
|
key={genre.id}
|
|
href={`/the-loai/${genre.slug}`}
|
|
className="group flex items-start gap-4 rounded-xl border border-border bg-card p-5 transition-all hover:border-primary/30 hover:shadow-md"
|
|
>
|
|
<span className="flex h-12 w-12 shrink-0 items-center justify-center rounded-lg bg-primary/10 text-primary transition-colors group-hover:bg-primary group-hover:text-primary-foreground">
|
|
{genre.icon && iconMap[genre.icon] ? iconMap[genre.icon] : <BookOpen className="h-6 w-6" />}
|
|
</span>
|
|
<div>
|
|
<h2 className="text-base font-semibold text-foreground group-hover:text-primary transition-colors">{genre.name}</h2>
|
|
<p className="mt-1 text-sm leading-relaxed text-muted-foreground">{genre.description}</p>
|
|
<p className="mt-2 text-xs text-muted-foreground">{novelCount} truyện</p>
|
|
</div>
|
|
</Link>
|
|
)
|
|
})}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|