@extends('layouts.admin')
@section('title', 'Social posts')
@section('content')
@php
  $tone = fn (?string $status) => match ($status) {
      'published' => 'success',
      'scheduled', 'approved' => 'warning',
      'failed', 'rejected' => 'danger',
      default => 'muted',
  };
@endphp
<x-admin.page
    title="Posts"
    subtitle="Drafts, scheduled, pending approval, and published social posts."
>
    <x-slot:actions>
        @if($sandbox)
            <span class="admin-btn pointer-events-none">Sandbox mode</span>
        @endif
        <a href="{{ route('admin.social.calendar') }}" class="admin-btn">Calendar</a>
        <a href="{{ route('admin.social.composer') }}" class="admin-btn admin-btn-primary">
            <i data-lucide="plus" class="h-3.5 w-3.5"></i> Compose
        </a>
    </x-slot:actions>

    @if(session('status'))
        <div class="mb-4 rounded-lg border border-emerald-200 bg-emerald-50 px-4 py-3 text-sm text-emerald-900">{{ session('status') }}</div>
    @endif

    <div class="order-ops-stat-rail mb-5">
        <a href="{{ route('admin.social.posts.index') }}" class="order-ops-stat {{ ! request('status') ? 'is-active' : '' }}">
            <span class="order-ops-stat-label">All</span>
            <span class="order-ops-stat-value">{{ number_format($stats['total']) }}</span>
        </a>
        <a href="{{ route('admin.social.posts.index', ['status' => 'draft']) }}" class="order-ops-stat {{ request('status') === 'draft' ? 'is-active' : '' }}">
            <span class="order-ops-stat-label">Drafts</span>
            <span class="order-ops-stat-value">{{ number_format($stats['draft']) }}</span>
        </a>
        <a href="{{ route('admin.social.posts.index', ['status' => 'scheduled']) }}" class="order-ops-stat {{ request('status') === 'scheduled' ? 'is-active' : '' }}">
            <span class="order-ops-stat-label">Scheduled</span>
            <span class="order-ops-stat-value">{{ number_format($stats['scheduled']) }}</span>
        </a>
        <a href="{{ route('admin.social.posts.index', ['status' => 'published']) }}" class="order-ops-stat {{ request('status') === 'published' ? 'is-active' : '' }}">
            <span class="order-ops-stat-label">Published</span>
            <span class="order-ops-stat-value">{{ number_format($stats['published']) }}</span>
            <span class="order-ops-stat-meta">{{ number_format($stats['pending']) }} pending approval</span>
        </a>
    </div>

    <form method="get" class="mb-4 flex flex-wrap gap-2">
        <input type="search" name="q" value="{{ request('q') }}" placeholder="Search number or body…" class="rounded-lg border border-[var(--color-admin-border)] px-3 py-2 text-sm">
        <select name="network" class="rounded-lg border border-[var(--color-admin-border)] px-3 py-2 text-sm">
            <option value="">Any network</option>
            @foreach(['facebook','instagram','x','linkedin','tiktok','pinterest','youtube','reddit','gbp'] as $network)
                <option value="{{ $network }}" @selected(request('network') === $network)>{{ ucfirst($network) }}</option>
            @endforeach
        </select>
        @if(request('status'))
            <input type="hidden" name="status" value="{{ request('status') }}">
        @endif
        <button class="admin-btn" type="submit">Filter</button>
    </form>

    <div class="overflow-hidden rounded-xl border border-[var(--color-admin-border)] bg-white shadow-[var(--admin-shadow)]">
        <table class="min-w-full text-sm">
            <thead class="bg-[#fafbfb] text-left text-xs uppercase tracking-wide text-[#6d7175]">
                <tr>
                    <th class="px-4 py-3">Post</th>
                    <th>Status</th>
                    <th>Networks</th>
                    <th>When</th>
                    <th></th>
                </tr>
            </thead>
            <tbody class="divide-y divide-[var(--color-admin-border)]">
                @forelse($posts as $post)
                    <tr>
                        <td class="px-4 py-3">
                            <a href="{{ route('admin.social.posts.show', $post) }}" class="font-medium text-[#2c6ecb] hover:underline">{{ $post->number }}</a>
                            <div class="text-xs text-[#6d7175]">{{ \Illuminate\Support\Str::limit($post->body_text, 72) }}</div>
                        </td>
                        <td><x-admin.badge :tone="$tone($post->status)">{{ $post->status }}</x-admin.badge></td>
                        <td class="text-xs capitalize">{{ implode(', ', $post->networks ?? []) }}</td>
                        <td class="text-xs text-[#6d7175]">
                            {{ $post->published_at?->format('M j, g:ia') ?? $post->scheduled_at?->format('M j, g:ia') ?? '—' }}
                        </td>
                        <td class="px-4 py-3 text-right whitespace-nowrap">
                            <div class="inline-flex gap-1">
                                @if(in_array($post->status, ['scheduled', 'approved', 'draft'], true))
                                    <form method="post" action="{{ route('admin.social.posts.publish', $post) }}">@csrf
                                        <button class="admin-btn admin-btn-primary" type="submit">Publish</button>
                                    </form>
                                @endif
                                <form method="post" action="{{ route('admin.social.posts.duplicate', $post) }}">@csrf
                                    <button class="admin-btn" type="submit">Duplicate</button>
                                </form>
                            </div>
                        </td>
                    </tr>
                @empty
                    <tr><td colspan="5" class="px-4 py-10 text-center text-[#6d7175]">No posts yet — compose your first.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    <div class="mt-4">{{ $posts->links() }}</div>
</x-admin.page>
@endsection