@extends('layouts.admin')

@section('title', $pageModel->title.' — '.config('app.name'))
@section('page_title', $pageModel->title)

@section('breadcrumbs')
    <li class="breadcrumb-item"><a href="{{ route('admin.cms.pages.index') }}">CMS pages</a></li>
    <li class="breadcrumb-item active">#{{ $pageModel->id }}</li>
@endsection

@section('content')
    <div class="card mb-3">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h5 class="mb-0">Page metadata</h5>
            <div class="d-flex gap-2">
                <a href="{{ route('admin.cms.pages.edit', $pageModel) }}" class="btn btn-sm btn-outline-primary">Edit</a>
                <form method="POST" action="{{ route('admin.cms.pages.destroy', $pageModel) }}" onsubmit="return confirm('Delete this page? It will no longer be visible on the public site.');">
                    @csrf
                    @method('DELETE')
                    <button class="btn btn-sm btn-outline-danger" type="submit">Delete</button>
                </form>
            </div>
        </div>
        <div class="card-body">
            <dl class="row mb-0">
                <dt class="col-sm-3">ID</dt><dd class="col-sm-9">{{ $pageModel->id }}</dd>
                <dt class="col-sm-3">Slug</dt><dd class="col-sm-9">{{ $pageModel->slug ?: '—' }}</dd>
                <dt class="col-sm-3">Source</dt><dd class="col-sm-9">{{ $pageModel->source }}</dd>
                <dt class="col-sm-3">Published</dt><dd class="col-sm-9">{{ $pageModel->is_published ? 'Yes' : 'No' }}</dd>
            </dl>
        </div>
    </div>
    <div class="card">
        <div class="card-header"><h5 class="mb-0">Blocks ({{ $pageModel->blocks->count() }})</h5></div>
        <div class="card-body">
            @forelse ($pageModel->blocks as $block)
                <div class="mb-4">
                    <div class="text-muted small mb-1">#{{ $block->id }} · {{ $block->descriptor ?: 'no descriptor' }}</div>
                    <div class="border rounded p-3" style="max-height:280px;overflow:auto">
                        {!! $block->content !!}
                    </div>
                </div>
            @empty
                <p class="text-muted mb-0">No blocks.</p>
            @endforelse
        </div>
    </div>
@endsection