blog.hangerthem.com/components/post/PostList.tsx
HangerThem 98212889bf chore: README, dependency cleanup and shared components
- Replace the create-next-app README with real project docs (features,
  env vars, frontmatter schema, Markdown extensions, deployment)
- Drop ESLint (unused by any script; oxlint is the linter) and the
  unrelated 'hast' package; move oxlint, oxfmt and puppeteer to
  devDependencies (locked versions unchanged)
- Extract PostList, used by the tag and category pages
- Use shared Intl formatters for post dates, pinned to Europe/Prague so
  the build server's timezone can't shift dates
- Use <h1> for the tag/category page headings (same styling)
- Remove math/mermaid flags from posts that don't use them; fix a typo
  in the Tessera cover alt text

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-19 14:25:58 +02:00

25 lines
1 KiB
TypeScript

import Link from 'next/link'
import type { PostMeta } from '@/types/Post.type'
import { cn } from '@/utils/cn'
import { dateFormatter } from '@/utils/time'
/** Compact list of post titles with dates, used on the tag and category pages. */
export function PostList({ posts, className }: { posts: PostMeta[]; className?: string }) {
return (
<ul className={cn('border-l border-border mb-3', className)}>
{posts.map((post) => (
<li key={post.slug} className="pl-5">
<Link
href={`/posts/${post.slug}`}
className="group flex items-baseline justify-between gap-3 py-1.5 px-2 -ml-2 border-l-2 border-transparent hover:bg-accent/10 hover:border-accent transition-colors"
>
<span className="group-hover:text-accent transition-colors truncate">{post.title}</span>
<time dateTime={post.date} className="text-sm whitespace-nowrap">
{dateFormatter.format(new Date(post.date))}
</time>
</Link>
</li>
))}
</ul>
)
}