Ai Run Log code

@props([
    'messages' => [],
    'title' => 'Run log',
    'maxHeight' => 'max-h-96',
    'embedded' => false,
])

@php
    /*
    | Scrollable conversation log for a single agent run or iteration.
    |
    | Usage:
    |   <x-ui.ai-run-log :messages="[
    |       ['role' => 'user', 'content' => 'Keep CI green.', 'time' => '09:41'],
    |       ['role' => 'assistant', 'content' => 'Running workflow tests first.', 'time' => '09:42'],
    |   ]" />
    */
    $normalizedMessages = collect($messages)
        ->map(function ($message) {
            if (! is_array($message)) {
                return [
                    'role' => 'assistant',
                    'content' => (string) $message,
                    'time' => null,
                ];
            }

            return [
                'role' => $message['role'] ?? 'assistant',
                'content' => $message['content'] ?? $message['body'] ?? '',
                'time' => $message['time'] ?? null,
            ];
        })
        ->filter(fn (array $message) => $message['content'] !== '')
        ->values()
        ->all();
@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="border-b border-gray-200 px-4 py-4 dark:border-gray-800 sm:px-5">
            <p class="text-sm font-semibold text-gray-900 dark:text-white">{{ $title }}</p>
            <p class="text-xs text-gray-500 dark:text-gray-400">{{ count($normalizedMessages) }} messages</p>
        </div>
    @endunless

    <div @class([$maxHeight, 'space-y-3 overflow-y-auto p-4 sm:p-5', 'border-t border-gray-200 dark:border-gray-800' => $embedded])>
        @forelse ($normalizedMessages as $message)
            <x-ui.ai-agent-message :role="$message['role']" :time="$message['time']">
                {{ $message['content'] }}
            </x-ui.ai-agent-message>
        @empty
            <p class="text-sm text-gray-500 dark:text-gray-400">No messages yet.</p>
        @endforelse

        {{ $slot }}
    </div>
</div>