import { usePage } from '@inertiajs/react';
import { ReactNode } from 'react';

interface Props {
    /** Yazdırma başlığı — örn. "Cari Ekstresi" */
    baslik: string;
    /** Başlığın altındaki bağlam satırı — örn. "ABC Ltd. · 01.01.2026 – 31.01.2026" */
    altBaslik?: ReactNode;
    children: ReactNode;
}

/**
 * Rapor gövdesi sarmalayıcısı.
 *
 * `.rapor-yazdir` sınıfını verir: "Yazdır" (veya Ctrl+P) basıldığında sadece
 * bu blok basılır — sidebar, üst bar, filtre çekmecesi ve sayfalama çıkmaz
 * (kurallar `resources/css/app.css` içindeki @media print bloğunda).
 *
 * Ayrıca yalnızca kâğıtta görünen bir başlık bloğu ekler: rapor adı, firma
 * ve tarih aralığı. Ekranda bunlar zaten AppLayout başlığında olduğu için
 * tekrar gösterilmez.
 */
export default function RaporGovde({ baslik, altBaslik, children }: Props) {
    const { props } = usePage<any>();
    const firmaAd: string = props?.aktif_firma?.ad ?? '';

    return (
        <div className="rapor-yazdir">
            <div className="yalniz-yazdir mb-4 border-b border-slate-300 pb-2">
                {firmaAd && <div className="text-[11px] uppercase tracking-wide text-slate-500">{firmaAd}</div>}
                <h1 className="text-lg font-bold text-slate-900">{baslik}</h1>
                {altBaslik && <div className="text-[11px] text-slate-600">{altBaslik}</div>}
            </div>

            {children}
        </div>
    );
}
