"use client";

import { useEffect, useState } from "react";

type Release = { version: string; releasedAt: string; summary: string };
type Data = { release: Release; entries: string[]; logAvailable: boolean };

export default function ReleasesPage() {
  const [data, setData] = useState<Data | null>(null);
  const [error, setError] = useState("");
  useEffect(() => {
    fetch("/api/admin/release").then(async (response) => ({ response, body: await response.json() })).then(({ response, body }) => {
      if (!response.ok) throw new Error(body.error || "Não foi possível consultar a versão.");
      setData(body);
    }).catch((reason) => setError(reason instanceof Error ? reason.message : "Não foi possível consultar a versão."));
  }, []);

  return <main className="admin-hub release-page"><header><a href="/">← Dashboard Capital</a><div><a href="/admin">Usuários</a><a href="/admin/clientes">Clientes</a></div></header><p className="eyebrow">OPERAÇÃO E RASTREABILIDADE</p><h1>Versão e implantações</h1>{error ? <p className="release-error">{error}</p> : !data ? <p className="admin-lead">Consultando informações da aplicação...</p> : <><section className="release-current"><div><span>VERSÃO EM EXECUÇÃO</span><b>{data.release.version}</b><p>{data.release.summary}</p></div><small>Pacote preparado em {new Date(`${data.release.releasedAt}T12:00:00`).toLocaleDateString("pt-BR")}</small></section><section className="release-log"><div><h2>Últimas implantações registradas</h2><p>Os próximos deploys feitos pelo script oficial serão registrados com arquivo, checksum, data e resultado.</p></div>{data.logAvailable ? data.entries.length ? <ol>{data.entries.map((entry, index) => <li key={`${index}-${entry}`}>{entry}</li>)}</ol> : <div className="release-empty">Ainda não há implantações registradas.</div> : <div className="release-empty">O registro ainda não foi criado no servidor. Use o script de implantação a partir desta versão.</div>}</section></>}</main>;
}
