@php
    use App\Enums\RecordStatus;
    use App\Helpers\PermissionHelper;

    $tableId = str($routePrefix)->replace('.', '-')->slug();
    $breadcrumbs = $breadcrumbs ?? [
        ['label' => 'Home', 'href' => route('dashboard')],
        ['label' => 'Institution Setup', 'href' => route('institution.dashboard')],
        ['label' => $resourceLabel],
    ];
    $columns = $columns ?? [
        ['key' => 'code', 'label' => 'Code'],
        ['key' => 'name', 'label' => 'Name'],
        ['key' => 'status', 'label' => 'Status', 'render' => 'status'],
    ];
    $canBulk = PermissionHelper::can($permissionPrefix . '.view');
@endphp

<x-ui.page-header
    :title="$resourceLabel"
    :subtitle="'Manage ' . strtolower($resourceLabel) . ' records for your institution.'"
    :breadcrumbs="$breadcrumbs"
>
    <x-slot:actions>
        @include('institution.partials.table-toolbar')
    </x-slot:actions>
</x-ui.page-header>

@include('institution.partials.flash')
@include('institution.partials.stats-row', ['stats' => $stats])
@include('institution.partials.filters')

<form id="institution-bulk-form" method="POST" action="{{ route($routePrefix . '.bulk-archive') }}">
    @csrf
</form>

<x-ui.table-wrapper :id="$tableId" :title="$resourceLabel . ' records'" :record-count="$records->total()">
    <x-slot:toolbar>
        @include('institution.partials.table-toolbar')
    </x-slot:toolbar>

    <x-slot:head>
        <tr>
            @if($canBulk)
                <th style="width: 40px;">
                    <input type="checkbox" class="form-check-input" id="{{ $tableId }}-select-all" aria-label="Select all">
                </th>
            @endif
            @foreach($columns as $column)
                <th>{{ $column['label'] }}</th>
            @endforeach
            <th class="text-end" style="width: 80px;">Actions</th>
        </tr>
    </x-slot:head>

    @forelse($records as $record)
        <tr @if(method_exists($record, 'trashed') && $record->trashed()) class="table-secondary" @endif>
            @if($canBulk)
                <td>
                    <input type="checkbox"
                           class="form-check-input institution-row-check"
                           name="ids[]"
                           value="{{ $record->id }}"
                           form="institution-bulk-form"
                           aria-label="Select {{ $record->name ?? $record->code }}">
                </td>
            @endif
            @foreach($columns as $column)
                <td>
                    @php
                        $render = $column['render'] ?? 'text';
                        $value = data_get($record, $column['key']);
                    @endphp
                    @switch($render)
                        @case('status')
                            @php
                                $status = is_object($record->status) ? $record->status : RecordStatus::tryFrom($record->status ?? 'active');
                            @endphp
                            <x-ui.status-pill :status="$status?->value ?? 'active'" :label="$status?->label() ?? 'Active'" />
                            @break
                        @case('enum')
                            @php $enumVal = is_object($value) ? $value : null; @endphp
                            {{ $enumVal?->label() ?? ucfirst(str_replace('_', ' ', (string) $value)) }}
                            @break
                        @case('date')
                            {{ $value ? \Illuminate\Support\Carbon::parse($value)->format('d M Y') : '—' }}
                            @break
                        @case('datetime')
                            {{ $value ? \Illuminate\Support\Carbon::parse($value)->format('d M Y, H:i') : '—' }}
                            @break
                        @case('boolean')
                            <x-ui.badge :variant="$value ? 'success' : 'secondary'">{{ $value ? 'Yes' : 'No' }}</x-ui.badge>
                            @break
                        @case('relation')
                            {{ data_get($record, $column['relation'] ?? $column['key']) ?? '—' }}
                            @break
                        @case('badge')
                            <x-ui.badge variant="primary">{{ $value ?? '—' }}</x-ui.badge>
                            @break
                        @default
                            {{ $value ?? '—' }}
                    @endswitch
                </td>
            @endforeach
            <td class="text-end">
                @include('institution.partials.row-actions', ['record' => $record])
            </td>
        </tr>
    @empty
        <tr>
            <td colspan="{{ count($columns) + ($canBulk ? 2 : 1) }}">
                <x-ui.empty-state
                    :title="'No ' . strtolower($resourceLabel) . ' records'"
                    :message="'Create your first ' . strtolower($resourceLabel) . ' to get started.'"
                    icon="bi-inbox"
                    :action-label="PermissionHelper::can($permissionPrefix . '.create') ? 'Add ' . $resourceLabel : null"
                    :action-href="PermissionHelper::can($permissionPrefix . '.create') ? route($routePrefix . '.create') : null"
                />
            </td>
        </tr>
    @endforelse

    @if($records->hasPages())
        <x-slot:footer>
            {{ $records->links() }}
        </x-slot:footer>
    @endif
</x-ui.table-wrapper>

@push('scripts')
@vite('resources/js/pages/tables.js')
<script>
document.addEventListener('DOMContentLoaded', function () {
    const selectAll = document.getElementById(@json($tableId . '-select-all'));
    if (!selectAll) return;
    selectAll.addEventListener('change', function () {
        document.querySelectorAll('.institution-row-check').forEach(function (cb) {
            cb.checked = selectAll.checked;
        });
    });
});
</script>
@endpush