deckyvault/apps/web/app/updates/page.tsx

import type { Metadata } from "next"
import Link from "next/link"
import { getAllUpdates } from "@/lib/updates"
import { UpdateCard } from "@/components/updates/update-card"
import { ArrowLeftIcon } from "lucide-react"

export const metadata: Metadata = {
    title: "Updates",
    description:
        "See what's new in DeckyVault — version release notes, features, and improvements.",
}

export default function UpdatesPage() {
    const updates = getAllUpdates()

    return (
        <main className='w-full max-w-7xl mx-auto px-4 py-8'>
            <div className='flex flex-row items-center gap-2 mb-6'>
                <Link
                    href='/'
                    className='text-text/60 hover:text-primary transition-colors'
                >
                    <ArrowLeftIcon className='w-4 h-4' />
                </Link>
                <h1 className='text-2xl font-bold'>Updates</h1>
            </div>
            <p className='text-text/60 mb-8'>
                Release notes, changelogs, and the like for DeckyVault.
            </p>
            {updates.length === 0 ? (
                <p className='text-text/40 text-center py-16'>
                    No updates yet.
                </p>
            ) : (
                <div className='flex flex-col gap-3'>
                    {updates.map((update) => (
                        <UpdateCard
                            key={update.slug}
                            update={update}
                        />
                    ))}
                </div>
            )}
        </main>
    )
}