<div class="container-fluid">
    {{ if .Error }}
    <div class="alert alert-danger alert-dismissible fade show" role="alert">
        {{ .Error }}
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>
    {{ end }}
    {{ if .Success }}
    <div class="alert alert-success alert-dismissible fade show" role="alert">
        {{ .Success }}
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>
    {{ end }}

    <div class="d-flex justify-content-between align-items-center mb-3">
        <h2 class="mb-0">Yazılar</h2>
        <div class="d-flex gap-2 align-items-center">
            <form class="d-flex" action="/admin/content/posts" method="GET">
                <input type="search" name="search" class="form-control form-control-sm me-2" placeholder="Ara..." value="{{ .Search }}">
                <button class="btn btn-sm btn-outline-secondary" type="submit"><i class="bi bi-search"></i></button>
            </form>
            <a href="/admin/posts/new" class="btn btn-sm btn-primary">Yeni Yazı</a>
            <div class="btn-group">
                <a href="/admin/content/posts" class="btn btn-sm btn-outline-primary {{ if not .ShowDeleted }}active{{ end }}">Aktif</a>
                <a href="/admin/content/posts?deleted=true" class="btn btn-sm btn-outline-danger {{ if .ShowDeleted }}active{{ end }}">Silinenler</a>
            </div>
        </div>
    </div>

    <div class="card border-0 shadow-sm">
        <div class="card-body p-3">
            <div class="table-responsive">
                <table class="table table-hover table-sm align-middle">
                    <thead class="bg-transparent text-muted small">
                        <tr>
                            <th>Başlık</th>
                            <th>Kategoriler</th>
                            <th>Taglar</th>
                            <th class="text-muted">Oluşturma</th>
                            <th class="text-end text-muted">İşlemler</th>
                        </tr>
                    </thead>
                    <tbody>
                        {{ if .Posts }}
                        {{ range .Posts }}
                        <tr>
                            <td style="width:56px;">
                                {{ with index $.ImageMap .ID }}
                                <img src="{{ . }}" alt="thumb" class="rounded" style="width:48px;height:48px;object-fit:cover;">
                                {{ else }}
                                <div class="bg-secondary rounded" style="width:48px;height:48px;"></div>
                                {{ end }}
                            </td>
                            <td>{{ .Title }}</td>
                            <td>
                                {{ range .Categories }}
                                <span class="badge bg-secondary me-1">{{ .Title }}</span>
                                {{ end }}
                            </td>
                            <td>
                                {{ range .Tags }}
                                <span class="badge bg-info text-dark me-1">{{ .Name }}</span>
                                {{ end }}
                            </td>
                            <td class="text-muted small">{{ .CreatedAt.Format "2006-01-02" }}</td>
                            <td class="text-end">
                                <div class="btn-group" role="group">
                                    {{ if $.ShowDeleted }}
                                    <form action="/admin/posts/{{ .ID }}/restore" method="POST">
                                        <button class="btn btn-sm btn-success" title="Geri Yükle"><i class="bi bi-arrow-counterclockwise"></i></button>
                                    </form>
                                    {{ else }}
                                    <a href="/admin/posts/{{ .ID }}/edit" class="btn btn-sm btn-outline-secondary" title="Düzenle"><i class="bi bi-pencil"></i></a>
                                    <form action="/admin/posts/{{ .ID }}/delete" method="POST" onsubmit="return confirmDelete(event, this);">
                                        <button class="btn btn-sm btn-outline-danger" title="Sil"><i class="bi bi-trash"></i></button>
                                    </form>
                                    {{ end }}
                                </div>
                            </td>
                        </tr>
                        {{ end }}
                        {{ else }}
                        <tr>
                            <td colspan="5" class="text-center text-muted py-4">Kayıt yok</td>
                        </tr>
                        {{ end }}
                    </tbody>
                </table>
            </div>
            {{ if gt .TotalPages 1 }}
            <div class="d-flex justify-content-end mt-3">
                <nav>
                    <ul class="pagination pagination-sm mb-0">
                        <li class="page-item {{ if eq .Page 1 }}disabled{{ end }}"><a class="page-link" href="/admin/content/posts?page={{ .PrevPage }}">&laquo; Önceki</a></li>
                        <li class="page-item disabled"><span class="page-link">Sayfa {{ .Page }} / {{ .TotalPages }}</span></li>
                        <li class="page-item {{ if eq .Page .TotalPages }}disabled{{ end }}"><a class="page-link" href="/admin/content/posts?page={{ .NextPage }}">Sonraki &raquo;</a></li>
                    </ul>
                </nav>
            </div>
            {{ end }}
        </div>
    </div>
</div>
