@extends('admin.layouts.app')

@section('title', __('admin.admin_notes.list_title') . ' — ' . __('admin.brand.name'))
@section('page_title', __('admin.admin_notes.list_title'))

@php
    use App\Models\AdminNote;
    $filterKeys    = ['view', 'priority'];
    $activeFilters = collect($filterKeys)->filter(fn ($k) => filled(request($k)))->count();
@endphp

@push('styles')
<style>
    /* Priority pill. The Pending / Seen / Read / Dismissed status
       chips use a different palette below — priorities are about the
       note's urgency, status is about the receiver's progress. */
    .nt-prio { display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:999px; font-size:11.5px; font-weight:800; letter-spacing:.02em; text-transform:uppercase; }
    .nt-prio--high   { background:#fef2f2; color:#b91c1c; border:1px solid #fecaca; }
    .nt-prio--medium { background:#fef3c7; color:#a16207; border:1px solid #fde68a; }
    .nt-prio--low    { background:#eff6ff; color:#1e40af; border:1px solid #bfdbfe; }
    .nt-prio .dot { width:7px; height:7px; border-radius:999px; background:currentColor; }

    .nt-status { display:inline-flex; align-items:center; gap:6px; padding:3px 10px; border-radius:999px; font-size:11.5px; font-weight:700; }
    .nt-status--pending   { background:#f1f5f9; color:#475569; border:1px solid #e2e8f0; }
    .nt-status--seen      { background:#ecfeff; color:#0e7490; border:1px solid #a5f3fc; }
    .nt-status--confirmed { background:#ecfdf5; color:#047857; border:1px solid #a7f3d0; }
    .nt-status--dismissed { background:#fef3c7; color:#92400e; border:1px solid #fde68a; }

    .nt-snippet { max-width: 380px; color:#0f172a; font-size:13.5px; line-height:1.55; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }

    .nt-from { font-size:12px; color:#64748b; }
    .nt-from strong { color:#0f172a; font-weight:700; }

    .nt-when { font-size:12px; color:#64748b; }
    .nt-when--empty { color:#cbd5e1; font-style:italic; }

    .nt-toolbar { display:flex; align-items:flex-start; gap:10px; flex-wrap:wrap; margin:0 0 12px; }
    .nt-toolbar > .nt-toolbar__search { flex:1 1 320px; min-width:220px; }

    .pp-wrap { display:inline-flex; align-items:center; gap:8px; height:42px; padding:0 14px 0 16px; background:#fff; border:1px solid #e2e8f0; border-radius:8px; box-shadow:0 1px 2px rgba(15,23,42,.04); color:#475569; font:inherit; font-size:13.5px; font-weight:600; white-space:nowrap; }
    .pp-wrap select { appearance:auto; background:transparent; border:0; font:inherit; font-size:13.5px; font-weight:700; color:#0f172a; cursor:pointer; padding:0 4px; }
    .pp-wrap select:focus { outline:none; }
</style>
@endpush

@section('content')
    <x-admin.page-header
        :title="__('admin.admin_notes.list_title')"
        :subtitle="__('admin.admin_notes.list_subtitle', ['count' => $notes->total()])">
        <x-slot:actions>
            <x-admin.btn-create :href="route('admin.admin-notes.create')" :label="__('admin.admin_notes.create')" />
        </x-slot:actions>
    </x-admin.page-header>

    @include('admin.partials.flash')

    <div class="nt-toolbar">
        <div class="nt-toolbar__search">
            <x-admin.list-toolbar
                :activeFilters="$activeFilters"
                filterTargetId="notes-filter-bar" />
        </div>

        <form method="GET" action="{{ url()->current() }}" class="pp-wrap" id="notes-per-page-form">
            @foreach (request()->except(['per_page', 'page']) as $k => $v)
                @if (is_array($v))
                    @foreach ($v as $vv)
                        <input type="hidden" name="{{ $k }}[]" value="{{ $vv }}">
                    @endforeach
                @else
                    <input type="hidden" name="{{ $k }}" value="{{ $v }}">
                @endif
            @endforeach
            <label for="notes-per-page">{{ __('admin.pagination.per_page') }}</label>
            <select name="per_page" id="notes-per-page" onchange="document.getElementById('notes-per-page-form').submit()">
                @foreach ($perPageOptions as $opt)
                    <option value="{{ $opt }}" @selected($perPage === $opt)>{{ $opt }}</option>
                @endforeach
            </select>
        </form>
    </div>

    <x-admin.filter-bar id="notes-filter-bar">
        @foreach (request()->only(['q', 'sort', 'dir']) as $key => $value)
            <input type="hidden" name="{{ $key }}" value="{{ $value }}">
        @endforeach

        <x-admin.form-select name="view" :label="__('admin.admin_notes.fields.view')"
            :options="[
                'mine_sent'     => __('admin.admin_notes.views.sent'),
                'mine_received' => __('admin.admin_notes.views.received'),
            ]"
            :selected="$view" :placeholder="__('admin.filters.all')" />

        <x-admin.form-select name="priority" :label="__('admin.admin_notes.fields.priority')"
            :options="[
                AdminNote::PRIORITY_HIGH   => __('admin.admin_notes.priorities.high'),
                AdminNote::PRIORITY_MEDIUM => __('admin.admin_notes.priorities.medium'),
                AdminNote::PRIORITY_LOW    => __('admin.admin_notes.priorities.low'),
            ]"
            :selected="$priority" :placeholder="__('admin.filters.all')" />
    </x-admin.filter-bar>

    <div class="card card-table">
        @if ($notes->isEmpty())
            <x-admin.empty-state :title="__('admin.admin_notes.empty_title')" :subtitle="__('admin.admin_notes.empty_hint')" />
        @else
            <div class="card-table-wrap">
                <table class="data-table">
                    <thead>
                        <tr>
                            <th>{{ __('admin.admin_notes.fields.note') }}</th>
                            <th>{{ __('admin.admin_notes.fields.priority') }}</th>
                            <th>{{ __('admin.admin_notes.fields.created_by') }}</th>
                            <th>{{ __('admin.admin_notes.fields.assigned_to') }}</th>
                            <th>{{ __('admin.admin_notes.fields.created_at') }}</th>
                            <th>{{ __('admin.admin_notes.fields.first_seen_at') }}</th>
                            <th>{{ __('admin.admin_notes.fields.confirmed_at') }}</th>
                            <th>{{ __('admin.admin_notes.fields.dismissed_at') }}</th>
                            <th>{{ __('admin.fields.status') }}</th>
                            <th class="actions">{{ __('admin.fields.actions') }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($notes as $n)
                            @php
                                $status = $n->statusKey();
                                $isMineAsAssignee = (int) $n->assigned_to_admin_id === $currentAdminId;
                            @endphp
                            <tr>
                                <td>
                                    <a href="{{ route('admin.admin-notes.show', $n) }}" class="nt-snippet" style="text-decoration:none;">
                                        {{ $n->note }}
                                    </a>
                                </td>
                                <td>
                                    <span class="nt-prio nt-prio--{{ $n->priority }}">
                                        <span class="dot"></span>{{ __('admin.admin_notes.priorities.' . $n->priority) }}
                                    </span>
                                </td>
                                <td>
                                    <div class="nt-from">
                                        <strong>{{ $n->creator?->name ?? '—' }}</strong>
                                    </div>
                                </td>
                                <td>
                                    <div class="nt-from">
                                        <strong>{{ $n->assignee?->name ?? '—' }}</strong>
                                    </div>
                                </td>
                                <td>
                                    <div class="nt-when">{{ $n->created_at?->format('Y-m-d H:i') }}</div>
                                </td>
                                <td>
                                    @if ($n->first_seen_at)
                                        <div class="nt-when">{{ $n->first_seen_at->format('Y-m-d H:i') }}</div>
                                    @else
                                        <div class="nt-when nt-when--empty">—</div>
                                    @endif
                                </td>
                                <td>
                                    @if ($n->confirmed_at)
                                        <div class="nt-when">{{ $n->confirmed_at->format('Y-m-d H:i') }}</div>
                                    @else
                                        <div class="nt-when nt-when--empty">—</div>
                                    @endif
                                </td>
                                <td>
                                    @if ($n->dismissed_at)
                                        <div class="nt-when">{{ $n->dismissed_at->format('Y-m-d H:i') }}</div>
                                    @else
                                        <div class="nt-when nt-when--empty">—</div>
                                    @endif
                                </td>
                                <td>
                                    <span class="nt-status nt-status--{{ $status }}">
                                        {{ __('admin.admin_notes.status.' . $status) }}
                                    </span>
                                </td>
                                <td class="actions">
                                    <a href="{{ route('admin.admin-notes.show', $n) }}" class="btn-secondary btn-sm">{{ __('admin.actions.view') }}</a>
                                    @if ($isMineAsAssignee && $n->dismissed_at === null && $n->confirmed_at === null)
                                        {{-- Two distinct receiver-side intents.
                                             Done = active completion (confirmed_at).
                                             Dismiss = passive acknowledgement (dismissed_at).
                                             Both remove the alert from the dashboard. --}}
                                        <form method="POST" action="{{ route('admin.admin-notes.confirm', $n) }}" style="display:inline;"
                                              onsubmit="return confirm({{ Js::from(__('admin.admin_notes.confirm_done')) }});">
                                            @csrf
                                            <button type="submit" class="btn-primary btn-sm">{{ __('admin.admin_notes.actions.mark_done') }}</button>
                                        </form>
                                        <form method="POST" action="{{ route('admin.admin-notes.dismiss', $n) }}" style="display:inline;"
                                              onsubmit="return confirm({{ Js::from(__('admin.admin_notes.confirm_dismiss')) }});">
                                            @csrf
                                            <button type="submit" class="btn-secondary btn-sm">{{ __('admin.admin_notes.actions.dismiss') }}</button>
                                        </form>
                                    @endif
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            <div class="pagination-wrap">{{ $notes->links() }}</div>
        @endif
    </div>
@endsection