MikrotikManager/app/(main)/releases/page.tsx

import Link from "next/link"
import { PageHeader } from "@/components/page-header"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
import { buttonVariants } from "@/components/ui/button"
import { formatAppVersionLabel, getAppVersion, getReleaseUrl } from "@/lib/app-version"
import { readReleaseManifest } from "@/lib/release-manifest"
import { cn } from "@/lib/utils"
import { ExternalLinkIcon } from "lucide-react"

export const dynamic = "force-dynamic"

function formatPublishedAt(value: string | null, isProdBuild: boolean): string {
  if (value) {
    return new Intl.DateTimeFormat("ru-RU", {
      dateStyle: "long",
      timeStyle: "short",
    }).format(new Date(value))
  }
  return isProdBuild ? "Прод-сборка" : "Локальная сборка"
}

export default function ReleasesPage() {
  const manifest = readReleaseManifest()
  const version = getAppVersion()
  const isProdBuild = !version.endsWith("-dev")
  const releaseUrl = getReleaseUrl() || manifest.releaseUrl || null
  const commits = manifest.commits

  return (
    <div className="flex flex-col h-full">
      <PageHeader
        crumbs={[{ label: "Система" }, { label: "Релизы" }]}
        actions={
          releaseUrl ? (
            <Link
              href={releaseUrl}
              target="_blank"
              rel="noreferrer"
              className={cn(buttonVariants({ variant: "outline", size: "sm" }), "h-8 inline-flex items-center gap-2")}
            >
              <ExternalLinkIcon className="size-4" />
              Открыть в Gitea
            </Link>
          ) : null
        }
      />

      <div className="flex-1 overflow-y-auto p-6">
        <div className="max-w-[960px] mx-auto space-y-6">
          <Card>
            <CardHeader>
              <CardTitle>Текущая версия</CardTitle>
              <CardDescription>Сборка RouterLists, опубликованная через CI/CD.</CardDescription>
            </CardHeader>
            <CardContent className="space-y-3">
              <div className="flex flex-wrap items-center gap-3">
                <span className="text-2xl font-semibold tracking-tight">{formatAppVersionLabel(version)}</span>
                <span className="text-sm text-muted-foreground">{formatPublishedAt(manifest.publishedAt, isProdBuild)}</span>
              </div>
              <p className="text-sm text-muted-foreground">
                Версия формируется автоматически от базы <span className="font-mono">v1.0.0</span> по Conventional Commits.
              </p>
            </CardContent>
          </Card>

          <Card>
            <CardHeader>
              <CardTitle>Сводка коммитов</CardTitle>
              <CardDescription>
                {commits.length > 0
                  ? `Изменения, вошедшие в ${formatAppVersionLabel(manifest.version)}.`
                  : "Для локальной разработки список коммитов пуст. В прод-сборке он заполняется CI."}
              </CardDescription>
            </CardHeader>
            <CardContent>
              {commits.length === 0 ? (
                <p className="text-sm text-muted-foreground">Коммитов для отображения пока нет.</p>
              ) : (
                <ul className="space-y-3">
                  {commits.map((commit) => (
                    <li key={commit.sha} className="rounded-md border px-3 py-2">
                      <div className="flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
                        <span className="font-mono uppercase">{commit.type}</span>
                        <span className="font-mono">{commit.shortSha}</span>
                        <span>{commit.author}</span>
                      </div>
                      <p className="mt-1 text-sm">{commit.subject}</p>
                    </li>
                  ))}
                </ul>
              )}
            </CardContent>
          </Card>
        </div>
      </div>
    </div>
  )
}