/**
 * ReportSummary — Reusable report summary card.
 *
 * Props:
 *   scans            (array)  — Scans to summarise
 *   title            (string) — Section heading (default: "Report Summary")
 *   properties       (array)  — Properties array (for general summary property count)
 *   unassignedCount  (number) — Count of unassigned scans (general summary only)
 *   roomCount        (number) — Override room count (optional — auto-computed if omitted)
 *
 * Computes: total scans, unique rooms, latest scan date, highest severity.
 * Works for both general (all scans) and per-property (filtered) contexts.
 */
var ReportSummary = function (props) {
    var scans = props.scans || [];
    var title = props.title || 'Report Summary';
    var properties = props.properties || null;
    var unassignedCount = props.unassignedCount || 0;

    if (scans.length === 0) return null;

    // Compute stats from the scan array
    var totalScans = scans.length;

    // Unique rooms
    var roomMap = {};
    for (var i = 0; i < scans.length; i++) {
        var rn = scans[i].roomName || 'Unassigned';
        roomMap[rn] = true;
    }
    var roomCount = props.roomCount !== undefined ? props.roomCount : 0;
    if (props.roomCount === undefined) {
        for (var r in roomMap) { roomCount++; }
    }

    // Latest scan
    var latest = scans[0];
    for (var l = 1; l < scans.length; l++) {
        if (scans[l].timestamp > latest.timestamp) latest = scans[l];
    }

    // Highest severity
    var highestSev = 'low';
    for (var h = 0; h < scans.length; h++) {
        if (SeverityConfig.order(scans[h].severity) > SeverityConfig.order(highestSev)) {
            highestSev = scans[h].severity;
        }
    }
    var hSev = SeverityConfig.get(highestSev);

    // Average risk
    var sum = 0;
    for (var a = 0; a < scans.length; a++) { sum += scans[a].percentage; }
    var avgPct = Math.round(sum / scans.length);

    return (
        <div className="bio-bg bio-bg-40 rounded-xl shadow-soft p-5 border border-stone-100/50">
            <div className="flex items-center justify-between mb-3">
                <h3 className="text-[10px] font-black text-forest uppercase tracking-[0.15em]">{title}</h3>
                <div className="flex items-center gap-2">
                    <span className={'text-xs font-extrabold ' + hSev.text}>{hSev.labelLong}</span>
                    <span className="text-[10px] font-black text-forest">•</span>
                    <span className="text-xs font-extrabold text-forest">{avgPct}% avg</span>
                </div>
            </div>
            <p className="text-sm text-forest/80 font-medium leading-relaxed">
                {'Latest scan on '}
                <span className="font-bold text-forest">{FormatUtils.fullDate(latest.timestamp)}</span>
                {'. '}
                <span className="font-bold text-forest">{totalScans} scan{totalScans !== 1 ? 's' : ''}</span>
                {' across '}
                <span className="font-bold text-forest">{roomCount} room{roomCount !== 1 ? 's' : ''}</span>
                {properties ? (
                    ' in ' + properties.length + ' propert' + (properties.length !== 1 ? 'ies' : 'y')
                ) : ''}
                {unassignedCount > 0 ? ' (plus ' + unassignedCount + ' unassigned)' : ''}
                {'. Highest severity: '}
                <span className={'font-bold ' + hSev.text}>{hSev.labelLong}</span>
                {'.'}
            </p>
        </div>
    );
};

window.ReportSummary = ReportSummary;