<x-filament-panels::page>
    <div class="space-y-6">
        <x-filament::section heading="Compose Controls">
            <div class="grid gap-4 md:grid-cols-2">
                @foreach($composes as $compose)
                    <div class="rounded-2xl border border-slate-200/70 bg-white/80 p-4 shadow-sm dark:border-white/10 dark:bg-slate-900/60">
                        <div class="flex items-center justify-between">
                            <div>
                                <p class="text-sm font-semibold text-slate-700 dark:text-slate-200">{{ $compose['label'] }}</p>
                                <p class="text-xs text-slate-500 dark:text-slate-400">{{ $compose['compose_id'] }}</p>
                            </div>
                            <span class="rounded-full bg-slate-100 px-3 py-1 text-xs font-semibold text-slate-700 dark:bg-slate-800 dark:text-slate-100">
                                {{ ucfirst($compose['status'] ?? 'unknown') }}
                            </span>
                        </div>

                        <div class="mt-4 flex flex-wrap gap-2">
                            <x-filament::button size="sm" color="warning" wire:click="redeploy('{{ $compose['compose_id'] }}')">
                                Redeploy
                            </x-filament::button>
                            <x-filament::button size="sm" color="danger" wire:click="stop('{{ $compose['compose_id'] }}')">
                                Stop
                            </x-filament::button>
                            @if($dokployWebUrl)
                                <x-filament::button tag="a" size="sm" color="gray" href="{{ rtrim($dokployWebUrl, '/') }}" target="_blank">
                                    Open in Dokploy
                                </x-filament::button>
                            @endif
                        </div>
                    </div>
                @endforeach
            </div>
        </x-filament::section>

        <x-filament::section heading="Recent Actions">
            <div class="overflow-x-auto">
                <table class="min-w-full text-sm">
                    <thead>
                        <tr class="text-left text-xs uppercase tracking-wide text-slate-500">
                            <th class="px-3 py-2">When</th>
                            <th class="px-3 py-2">User</th>
                            <th class="px-3 py-2">Target</th>
                            <th class="px-3 py-2">Action</th>
                            <th class="px-3 py-2">Status</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-slate-100">
                        @forelse($recentLogs as $log)
                            <tr>
                                <td class="px-3 py-2 text-slate-700 dark:text-slate-200">{{ $log['created_at'] }}</td>
                                <td class="px-3 py-2 text-slate-600">{{ $log['user'] }}</td>
                                <td class="px-3 py-2 font-mono text-xs">{{ $log['service_id'] }}</td>
                                <td class="px-3 py-2">{{ ucfirst($log['action']) }}</td>
                                <td class="px-3 py-2">{{ $log['status_code'] ?? '—' }}</td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="5" class="px-3 py-4 text-center text-slate-500">No actions recorded yet.</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
            <x-filament::link href="{{ route('filament.superadmin.resources.infrastructure-action-logs.index') }}" class="mt-3 inline-flex text-sm text-primary-600">
                View full log →
            </x-filament::link>
        </x-filament::section>
    </div>
</x-filament-panels::page>
