@extends('admin.layouts.app')
@section('title', 'Yorumlar')
@section('page-title', 'Yorumlar')

@push('styles')
<style>
.comment-row td { vertical-align: top; padding-top: 14px; padding-bottom: 14px; }
.cmt-user { font-size:13px; font-weight:700; color:var(--text); }
.cmt-meta-badge { font-size:10.5px; font-weight:700; padding:2px 7px; border-radius:99px; }
.cmt-where { font-size:12px; font-weight:700; color:var(--info); }
.cmt-ep-code { font-size:11px; color:var(--text2); font-family:monospace; }
.cmt-text { font-size:13px; color:var(--text2); line-height:1.5; word-break:break-word; }
.cmt-gif { max-width:120px; max-height:80px; border-radius:6px; cursor:pointer; transition:max-width .2s; }
.cmt-gif:hover { max-width:240px; max-height:160px; }
.reply-form { display:none; margin-top:8px; }
.reply-form.on { display:block; }
.action-icon-btn {
    width:30px; height:30px; border-radius:7px;
    display:inline-flex; align-items:center; justify-content:center;
    font-size:13px; cursor:pointer; border:1px solid;
    transition:all .12s; flex-shrink:0;
}
</style>
@endpush

@section('content')

<div class="page-header">
    <div>
        <h5 style="font-size:18px;font-weight:700;color:var(--text);margin:0">
            Yorumlar
            <span style="font-size:13px;font-weight:600;color:var(--text2);margin-left:6px">{{ number_format($comments->total()) }} toplam</span>
        </h5>
    </div>
    {{-- Quick filter tabs --}}
    <div style="display:flex;gap:6px;flex-wrap:wrap">
        <a href="{{ route('admin.comments.index') }}"
           class="btn btn-sm {{ !request('status') ? 'btn-primary' : 'btn-secondary' }}">Tümü</a>
        <a href="{{ route('admin.comments.index', ['status'=>'pending']) }}"
           class="btn btn-sm {{ request('status')=='pending' ? 'btn-primary' : 'btn-secondary' }}">
            Bekleyen
            @php try { $pc = \App\Models\Comment::where('status','pending')->count(); } catch(\Exception $e) { $pc = 0; } @endphp
            @if($pc > 0)<span class="badge bg-danger ms-1">{{ $pc }}</span>@endif
        </a>
        <a href="{{ route('admin.comments.index', ['status'=>'approved']) }}"
           class="btn btn-sm {{ request('status')=='approved' ? 'btn-primary' : 'btn-secondary' }}">Onaylı</a>
        <a href="{{ route('admin.comments.index', ['status'=>'rejected']) }}"
           class="btn btn-sm {{ request('status')=='rejected' ? 'btn-primary' : 'btn-secondary' }}">Reddedilmiş</a>
        <a href="{{ route('admin.comments.index', ['status'=>'spam']) }}"
           class="btn btn-sm {{ request('status')=='spam' ? 'btn-primary' : 'btn-secondary' }}">Spam</a>
    </div>
</div>

{{-- Filter --}}
<div class="filter-card mb-3">
    <form method="GET" class="d-flex gap-2 flex-wrap align-items-end">
        @if(request('status'))
            <input type="hidden" name="status" value="{{ request('status') }}">
        @endif
        <div class="search-input-wrap flex-grow-1" style="min-width:200px">
            <i class="bi bi-search"></i>
            <input type="text" name="search" class="form-control" placeholder="Yorum içeriği..." value="{{ request('search') }}">
        </div>
        <div class="d-flex gap-2">
            <button type="submit" class="btn btn-primary btn-sm"><i class="bi bi-funnel"></i> Ara</button>
            <a href="{{ route('admin.comments.index') }}" class="btn btn-secondary btn-sm"><i class="bi bi-x-lg"></i></a>
        </div>
    </form>
</div>

{{-- Table --}}
<div class="table-wrap">
    <div class="table-responsive">
        <table class="table">
            <thead>
                <tr>
                    <th style="padding-left:20px;min-width:130px">Kullanıcı</th>
                    <th style="min-width:150px">Nereye</th>
                    <th style="min-width:200px">İçerik</th>
                    <th style="text-align:center">Durum</th>
                    <th style="min-width:100px">Tarih</th>
                    <th style="text-align:right;padding-right:20px;min-width:180px">İşlemler</th>
                </tr>
            </thead>
            <tbody>
                @forelse($comments as $comment)
                @php
                    $commentable = $comment->commentable;
                    $isEpisode   = $commentable instanceof \App\Models\Episode;
                    $isAnime     = $commentable instanceof \App\Models\Anime;
                @endphp
                <tr class="comment-row">
                    {{-- Kullanıcı --}}
                    <td style="padding-left:20px">
                        <div class="d-flex align-items-center gap-2 mb-1">
                            <div class="user-avatar sm">{{ strtoupper(substr($comment->user?->name ?? '?', 0, 1)) }}</div>
                            <span class="cmt-user">{{ $comment->user?->name ?? 'Silinmiş' }}</span>
                        </div>
                        <div class="d-flex flex-wrap gap-1">
                            @if($comment->parent_id)
                                <span class="badge bg-secondary" style="font-size:10px">↩ Yanıt</span>
                            @endif
                            @if($comment->is_pinned)
                                <span class="badge bg-info" style="font-size:10px;color:#000"><i class="bi bi-pin-fill" style="font-size:9px"></i> Sabit</span>
                            @endif
                        </div>
                    </td>

                    {{-- Nereye --}}
                    <td>
                        @if($isEpisode && $commentable->anime)
                            <div class="cmt-where">{{ Str::limit($commentable->anime->title, 20) }}</div>
                            <a href="{{ url('/watch/'.$commentable->anime->slug.'/'.($commentable->season->season_number ?? 1).'/'.$commentable->episode_number) }}"
                               target="_blank" class="cmt-ep-code text-decoration-none">
                                S{{ str_pad($commentable->season->season_number ?? 1,2,'0',STR_PAD_LEFT) }}E{{ str_pad($commentable->episode_number,2,'0',STR_PAD_LEFT) }}
                                <i class="bi bi-box-arrow-up-right" style="font-size:9px"></i>
                            </a>
                        @elseif($isAnime)
                            <a href="{{ route('admin.animes.show', $commentable->slug) }}"
                               class="cmt-where text-decoration-none">
                                {{ Str::limit($commentable->title, 22) }}
                            </a>
                        @else
                            <span style="color:var(--text3);font-size:12px">{{ class_basename($comment->commentable_type) }}</span>
                        @endif
                    </td>

                    {{-- İçerik --}}
                    <td>
                        @if($comment->content)
                            <div class="cmt-text">{{ Str::limit($comment->content, 100) }}</div>
                        @endif
                        @if($comment->gif_url)
                            <img src="{{ $comment->gif_url }}" class="cmt-gif mt-1" alt="gif">
                        @endif

                        {{-- Yanıt formu --}}
                        <div class="reply-form" id="rf-{{ $comment->id }}">
                            <form method="POST" action="{{ route('admin.comments.reply', $comment) }}" class="d-flex gap-2 mt-2">
                                @csrf
                                <input type="text" name="content" class="form-control form-control-sm"
                                       placeholder="Yanıtınızı yazın..." required>
                                <button type="submit" class="btn btn-primary btn-sm text-nowrap">
                                    <i class="bi bi-send"></i>
                                </button>
                            </form>
                        </div>
                    </td>

                    {{-- Durum --}}
                    <td style="text-align:center">
                        @php
                            $sb = match($comment->status) {
                                'approved' => ['bg-success','Onaylı'],
                                'pending'  => ['bg-warning','Bekliyor'],
                                'spam'     => ['bg-secondary','Spam'],
                                default    => ['bg-danger','Reddedilmiş'],
                            };
                        @endphp
                        <span class="badge {{ $sb[0] }}" style="{{ $comment->status==='pending'?'color:#000':'' }}">{{ $sb[1] }}</span>
                    </td>

                    {{-- Tarih --}}
                    <td style="font-size:12px;color:var(--text2)">
                        {{ $comment->created_at->format('d.m.Y') }}<br>
                        <span style="color:var(--text3)">{{ $comment->created_at->format('H:i') }}</span>
                    </td>

                    {{-- İşlemler --}}
                    <td style="text-align:right;padding-right:20px">
                        <div class="d-flex gap-1 justify-content-end flex-wrap">
                            @if($comment->status !== 'approved')
                            <form method="POST" action="{{ route('admin.comments.approve', $comment) }}">
                                @csrf
                                <button type="submit" class="action-icon-btn"
                                        style="border-color:var(--success);color:var(--success);background:var(--success-dim)"
                                        title="Onayla">
                                    <i class="bi bi-check-lg"></i>
                                </button>
                            </form>
                            @endif
                            @if($comment->status !== 'rejected')
                            <form method="POST" action="{{ route('admin.comments.reject', $comment) }}">
                                @csrf
                                <button type="submit" class="action-icon-btn"
                                        style="border-color:var(--warning);color:var(--warning);background:var(--warning-dim)"
                                        title="Reddet">
                                    <i class="bi bi-x-lg"></i>
                                </button>
                            </form>
                            @endif
                            <form method="POST" action="{{ route('admin.comments.pin', $comment) }}">
                                @csrf
                                <button type="submit" class="action-icon-btn"
                                        style="border-color:var(--info);color:var(--info);background:var(--info-dim)"
                                        title="{{ $comment->is_pinned ? 'Sabiti Kaldır' : 'Sabitle' }}">
                                    <i class="bi bi-pin{{ $comment->is_pinned ? '-angle-fill' : '' }}"></i>
                                </button>
                            </form>
                            <button onclick="toggleReply({{ $comment->id }})"
                                    class="action-icon-btn"
                                    style="border-color:var(--accent);color:var(--accent-lt);background:var(--accent-dim)"
                                    title="Yanıtla">
                                <i class="bi bi-reply-fill"></i>
                            </button>
                            <form method="POST" action="{{ route('admin.comments.destroy', $comment) }}"
                                  onsubmit="return confirm('Yorumu silmek istediğinize emin misiniz?')">
                                @csrf @method('DELETE')
                                <button type="submit" class="action-icon-btn"
                                        style="border-color:var(--danger);color:var(--danger);background:var(--danger-dim)"
                                        title="Sil">
                                    <i class="bi bi-trash3"></i>
                                </button>
                            </form>
                        </div>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="6">
                        <div class="empty-state">
                            <i class="bi bi-chat-dots"></i>
                            <h6>Yorum bulunamadı</h6>
                            <p>Seçili filtreler için yorum bulunmuyor.</p>
                        </div>
                    </td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>

<div class="mt-3">
    {{ $comments->links('admin.partials.pagination') }}
</div>

@endsection

@push('scripts')
<script>
function toggleReply(id) {
    const el = document.getElementById('rf-' + id);
    if (!el) return;
    el.classList.toggle('on');
    if (el.classList.contains('on')) el.querySelector('input')?.focus();
}
</script>
@endpush