blog.hangerthem.com/app/categories/page.tsx
2026-08-02 22:39:12 +02:00

43 lines
1.3 KiB
TypeScript

import { getAllCategories } from '@/lib/categories'
import { getAllPostsMeta } from '@/lib/posts'
import { slugify } from '@/utils/slug'
import type { Metadata } from 'next'
import Link from 'next/link'
import { metadata } from '@/app/metadata'
export async function generateMetadata(): Promise<Metadata> {
return { title: `Categories | ${metadata.title!.toString()}`, description: 'List of categories' }
}
export default function CategoriesPage() {
const categories = getAllCategories()
const posts = getAllPostsMeta()
return (
<div className="flex w-full">
<main className="max-w-3xl mx-auto px-4 py-8 lg:py-16 w-full">
<h1 className="text-3xl font-bold">Categories</h1>
<ul>
{Object.keys(categories).map((category) => (
<li key={category}>
<Link href={`/categories/${slugify(category)}`}>
{category} ({categories[category]})
</Link>
<ul>
{posts
.filter((post) => post.category === category)
.map((post) => (
<li key={post.slug}>
<Link href={`/posts/${post.slug}`}>{post.title}</Link>
</li>
))}
</ul>
</li>
))}
</ul>
</main>
<div className="w-80" />
</div>
)
}