"use client";

import Link from "next/link";
import { AppShell } from "@/components/AppShell";
import { CustomerForm } from "@/components/CustomerForm";
import { useCan } from "@/lib/abilities";

export default function NuevoClientePage() {
  return (
    <AppShell>
      <NuevoCliente />
    </AppShell>
  );
}

function NuevoCliente() {
  const allowed = useCan("customer:create");

  return (
    <>
      <div className="page-head">
        <Link href="/clientes" className="back-link">
          ← Clientes
        </Link>
        <h1 className="page-title">Nuevo cliente</h1>
      </div>
      {allowed ? (
        <CustomerForm />
      ) : (
        <div className="state-box state-error">
          No tiene permisos para crear clientes.
        </div>
      )}
    </>
  );
}