@use('Core\Localization\LocalizedDate')

{{--
    Listagem de páginas estáticas no painel (P5.S3.1): o módulo informa `title`/`breadcrumbs` e
    preenche **apenas** o conteúdo — a estrutura é do shell (ADR-009/ADR-016).

    Publicar/despublicar e arquivar são da S3.2: aqui não existe ação de estado. As ações de linha
    são links/botões de formulário; nada depende de JS.
--}}

<x-layout::cms
    :title="__('paginas::cms.title')"
    :breadcrumbs="[
        ['label' => __('paginas::index.title')],
        ['label' => __('paginas::cms.title')],
    ]">
    @if (session('status'))
        <x-cms::alert variant="success">{{ session('status') }}</x-cms::alert>
    @endif

    <p class="text-sm opacity-70">{{ __('paginas::cms.intro') }}</p>

    <div class="mt-4 flex justify-end">
        <x-cms::button variant="primary" :href="route('paginas.cms.create')">
            <x-ui::icon name="plus" />
            <span>{{ __('paginas::cms.new') }}</span>
        </x-cms::button>
    </div>

    <div class="mt-4">
        <x-cms::filter-card :title="__('paginas::cms.filters')">
            <x-cms::form-group name="q" :label="__('paginas::cms.search')" :value="$filters['q']" />

            <label class="form-control w-full">
                <span class="label"><span class="label-text">{{ __('paginas::cms.filter_status') }}</span></span>
                <select name="status" class="select select-bordered w-full">
                    <option value="">{{ __('paginas::cms.filter_all') }}</option>
                    @foreach ($statuses as $case)
                        <option value="{{ $case->value }}" @selected($filters['status'] === $case->value)>
                            {{ __('paginas::cms.status_'.$case->value) }}
                        </option>
                    @endforeach
                </select>
            </label>
        </x-cms::filter-card>
    </div>

    <div class="mt-4">
        <x-cms::card>
            @if ($paginas->isEmpty())
                <x-cms::empty-state :title="__('paginas::cms.empty')" />
            @else
                <x-cms::table :caption="__('paginas::cms.caption')">
                    <thead>
                        <tr>
                            <th scope="col">{{ __('paginas::cms.col_title') }}</th>
                            <th scope="col">{{ __('paginas::cms.col_status') }}</th>
                            <th scope="col">{{ __('paginas::cms.col_updated') }}</th>
                            <th scope="col" class="text-end">{{ __('paginas::cms.col_actions') }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($paginas as $pagina)
                            <tr>
                                <td>
                                    <a href="{{ route('paginas.cms.edit', $pagina) }}" class="font-medium link link-hover">
                                        {{ $pagina->title ?? $pagina->slug }}
                                    </a>
                                    <span class="block text-xs opacity-70">/{{ $pagina->slug }}</span>
                                </td>
                                <td>
                                    <x-cms::status-badge
                                        :status="$pagina->status->value"
                                        :label="__('paginas::cms.status_'.$pagina->status->value)" />
                                </td>
                                <td>{{ LocalizedDate::short($pagina->updated_at) }}</td>
                                <td>
                                    <x-cms::table-actions :label="__('paginas::cms.col_actions')">
                                        <x-cms::button variant="ghost" :href="route('paginas.cms.edit', $pagina)">
                                            <x-ui::icon name="pencil" />
                                            <span class="sr-only">{{ __('paginas::cms.action_edit') }}</span>
                                        </x-cms::button>
                                    </x-cms::table-actions>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </x-cms::table>

                <x-cms::pagination :paginator="$paginas" />
            @endif
        </x-cms::card>
    </div>
</x-layout::cms>