Ai Run Summary code

@props([
    'iteration' => 1,
    'status' => 'complete',
    'duration' => null,
    'filesChanged' => 0,
    'testsPassed' => null,
    'testsFailed' => null,
    'message' => null,
    'embedded' => false,
    'compact' => false,
])

@php
    /*
    | End-of-iteration summary for agent loops.
    |
    | status: complete, failed, partial
    |
    | Usage:
    |   <x-ui.ai-run-summary
    |       :iteration="4"
    |       duration="3m 12s"
    |       :files-changed="3"
    |       :tests-passed="28"
    |       :tests-failed="0"
    |   />
    */
    $statusStyles = [
        'complete' => ['label' => 'Completed', 'variant' => 'green'],
        'failed' => ['label' => 'Failed', 'variant' => 'red'],
        'partial' => ['label' => 'Partial', 'variant' => 'amber'],
    ];

    $current = $statusStyles[$status] ?? $statusStyles['complete'];
@endphp

<div {{ $attributes->merge(['class' => $embedded ? 'min-w-0' : 'min-w-0 overflow-hidden rounded-2xl border border-gray-200 bg-white shadow-sm dark:border-gray-800 dark:bg-gray-900']) }}>
    @unless ($embedded)
        <div class="flex flex-col gap-3 border-b border-gray-200 px-4 py-4 dark:border-gray-800 sm:flex-row sm:items-center sm:justify-between sm:px-5">
            <div class="min-w-0">
                <p class="text-sm font-semibold text-gray-900 dark:text-white">Run summary</p>
                <p class="text-xs text-gray-500 dark:text-gray-400">Iteration {{ $iteration }}@if ($duration)<span class="mx-1.5 text-gray-300 dark:text-gray-600">·</span>{{ $duration }}@endif</p>
            </div>
            <x-ui.badge :variant="$current['variant']" class="self-start shrink-0">{{ $current['label'] }}</x-ui.badge>
        </div>
    @endunless

    <dl @class([
        'grid gap-3 px-4 py-4 sm:px-5',
        'grid-cols-1' => $compact,
        'grid-cols-2 sm:grid-cols-3' => ! $compact,
        'border-t border-gray-200 dark:border-gray-800' => $embedded,
    ])>
        <div class="rounded-xl border border-gray-200 bg-gray-50 px-3 py-2.5 dark:border-gray-800 dark:bg-gray-950">
            <dt class="text-xs text-gray-500 dark:text-gray-400">Files changed</dt>
            <dd class="mt-1 text-lg font-semibold tabular-nums text-gray-900 dark:text-white">{{ $filesChanged }}</dd>
        </div>

        @if ($testsPassed !== null)
            <div class="rounded-xl border border-gray-200 bg-gray-50 px-3 py-2.5 dark:border-gray-800 dark:bg-gray-950">
                <dt class="text-xs text-gray-500 dark:text-gray-400">Tests passed</dt>
                <dd class="mt-1 text-lg font-semibold tabular-nums text-gray-900 dark:text-white">{{ $testsPassed }}</dd>
            </div>
        @endif

        @if ($testsFailed !== null)
            <div class="rounded-xl border border-gray-200 bg-gray-50 px-3 py-2.5 dark:border-gray-800 dark:bg-gray-950">
                <dt class="text-xs text-gray-500 dark:text-gray-400">Tests failed</dt>
                <dd class="mt-1 text-lg font-semibold tabular-nums text-gray-900 dark:text-white">{{ $testsFailed }}</dd>
            </div>
        @endif
    </dl>

    @if ($message)
        <div class="border-t border-gray-200 px-4 py-3 text-sm text-gray-600 dark:border-gray-800 dark:text-gray-400 sm:px-5">{{ $message }}</div>
    @endif

    @if (trim($slot) !== '')
        <div class="border-t border-gray-200 px-4 py-3 dark:border-gray-800 sm:px-5">{{ $slot }}</div>
    @endif
</div>