Files
netrunner-landing/app/[lang]/blog/page.tsx
T
Трапезников Кирилл Иванович 4b11fec8cc base with cms integrated
2026-04-18 21:16:55 +10:00

93 lines
3.2 KiB
TypeScript

import { pb } from "@/lib/pb";
import Link from "next/link";
import { Badge } from "@/components/ui/badge";
// Типизация записи из PocketBase
interface PBPost {
id: string;
title: string;
slug: string;
excerpt: string;
lang: string;
created: string;
published: boolean;
}
interface Props {
params: Promise<{ lang: string }>;
}
export default async function BlogIndexPage({ params }: Props) {
const { lang } = await params;
const isRu = lang === "ru";
let records: PBPost[] = [];
try {
// Возвращаем фильтрацию: только нужный язык и только опубликованные
records = await pb.collection("posts").getFullList<PBPost>({
filter: `lang = "${lang}" && published = true`,
sort: "-created",
cache: "no-store", // Чтобы новые посты из админки появлялись сразу
});
} catch (err) {
console.error("Failed to fetch blog posts:", err);
}
return (
<main className="min-h-screen pt-32 pb-20 container mx-auto max-w-5xl px-4">
<Badge
variant="outline"
className="mb-6 border-primary/30 text-primary uppercase tracking-widest"
>
{isRu ? "Архив терминала" : "Terminal Archive"}
</Badge>
<h1 className="text-5xl md:text-6xl font-extrabold tracking-tighter mb-12">
{isRu ? "Data Logs" : "System Logs"}
</h1>
{records.length === 0 ? (
<div className="p-20 border border-dashed border-border/50 rounded-3xl text-center bg-card/10">
<p className="text-muted-foreground font-mono italic">
{isRu
? "[Записи не найдены в этом секторе]"
: "[No records found in this sector]"}
</p>
</div>
) : (
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
{records.map((post) => (
<Link
href={`/${lang}/blog/${post.slug}`}
key={post.id}
className="group block"
>
<article className="p-8 border border-border/50 rounded-2xl bg-card/20 hover:bg-card/40 hover:border-primary/50 transition-all duration-300 h-full flex flex-col">
<div className="text-xs text-primary font-mono mb-4 flex items-center gap-2">
<span className="w-1.5 h-1.5 bg-primary rounded-full animate-pulse" />
{new Date(post.created).toLocaleDateString(
isRu ? "ru-RU" : "en-US",
)}
</div>
<h2 className="text-2xl font-bold mb-3 group-hover:text-primary transition-colors duration-300">
{post.title}
</h2>
<p className="text-muted-foreground text-sm leading-relaxed line-clamp-3">
{post.excerpt}
</p>
<div className="mt-8 pt-4 border-t border-border/30 text-xs font-bold uppercase tracking-widest text-primary/50 group-hover:text-primary transition-colors">
{isRu ? "Дешифровать →" : "Decrypt entry →"}
</div>
</article>
</Link>
))}
</div>
)}
</main>
);
}