@extends('setting.nav')

@section('title', 'Follow-ups')

@section('content')
    <div class="container-fluid mt-4">
        @include('follow_ups._tabs')

        @php
            // Tab labels in the order the controller lists its views. Overdue
            // first because it is the only one that is actually a problem.
            $tabs = [
                // The tone is a chip modifier from the design system, so a
                // follow-up filter and a mail filter are the same object.
                'overdue' => ['label' => 'Overdue', 'icon' => 'bi-exclamation-triangle', 'tone' => 'action'],
                'today' => ['label' => 'Due today', 'icon' => 'bi-clock', 'tone' => 'reply'],
                'upcoming' => ['label' => 'Upcoming', 'icon' => 'bi-calendar3', 'tone' => 'group'],
                'open' => ['label' => 'All open', 'icon' => 'bi-list-task', 'tone' => 'all'],
                'done' => ['label' => 'Done', 'icon' => 'bi-check2-circle', 'tone' => 'read'],
                'dismissed' => ['label' => 'Dismissed', 'icon' => 'bi-slash-circle', 'tone' => 'all'],
                'all' => ['label' => 'Everything', 'icon' => 'bi-archive', 'tone' => 'all'],
            ];

            $query = fn(array $extra = []) => array_merge(
                array_filter([
                    'view' => $view,
                    'q' => $search ?: null,
                    'mailbox' => $mailboxFilter ?: null,
                ]),
                $extra,
            );
        @endphp

        @unless ($configured)
            {{-- Opt-in, like auto-reply. Say so plainly rather than showing an
                 empty queue that looks like a broken feature. --}}
            <div class="alert alert-info d-flex flex-wrap align-items-center justify-content-between gap-2">
                <div>
                    <strong>Follow-ups are not switched on for this account.</strong>
                    No tasks are being raised and no reminders are being sent. Nothing has been missed in the
                    meantime — mail is read from the messages table when you turn it on, not from the moment
                    you do.
                </div>
                @if ($isAdmin)
                    {{-- Turns it on and sweeps in the same request. It used to
                         link to the settings form, where the switch still had to
                         be ticked and saved — so the banner stayed up and looked
                         like it had ignored the click. --}}
                    <div class="d-flex flex-column align-items-start gap-1">
                        <form action="{{ route('follow_ups.enable') }}" method="POST" class="m-0">
                            @csrf
                            <button type="submit" class="btn btn-sm btn-primary">
                                <i class="bi bi-power me-1"></i>Turn follow-ups on
                            </button>
                        </form>
                        <a href="{{ route('follow_ups.settings') }}" style="font-size:.75rem;">
                            or set the windows first
                        </a>
                    </div>
                @endif
            </div>
        @endunless

        {{-- The same chip toolbar the mail list filters with. A segmented
             button group broke into stretched half-rows as soon as it wrapped;
             chips wrap as chips. --}}
        <div class="emi-toolbar">
            @foreach ($tabs as $key => $tab)
                <a class="emi-chip emi-chip--{{ $tab['tone'] }} {{ $view === $key ? 'is-active' : '' }}"
                    href="{{ route('follow_ups.index', $query(['view' => $key])) }}">
                    <i class="bi {{ $tab['icon'] }}"></i>
                    <span>{{ $tab['label'] }}</span>
                    <span class="emi-chip__count {{ ($counts[$key] ?? 0) === 0 ? 'emi-chip__count--zero' : '' }}">
                        {{ $counts[$key] ?? 0 }}
                    </span>
                </a>
            @endforeach

            <div class="emi-toolbar__end">
                @if ($isAdmin && count($mailboxNames) > 1)
                    {{-- An admin sees the whole account by default; this narrows
                         it to one person's queue. --}}
                    <form action="{{ route('follow_ups.index') }}" method="GET" class="emi-sort m-0">
                        <input type="hidden" name="view" value="{{ $view }}">
                        @if ($search)
                            <input type="hidden" name="q" value="{{ $search }}">
                        @endif
                        <select name="mailbox" onchange="this.form.submit()" style="max-width:230px;">
                            <option value="">Every mailbox</option>
                            @foreach ($mailboxNames as $id => $mailboxEmail)
                                <option value="{{ $id }}" @selected($mailboxFilter === (int) $id)>{{ $mailboxEmail }}</option>
                            @endforeach
                        </select>
                    </form>
                @endif

                <form action="{{ route('follow_ups.index') }}" method="GET" class="emi-search m-0">
                    <input type="hidden" name="view" value="{{ $view }}">
                    @if ($mailboxFilter)
                        <input type="hidden" name="mailbox" value="{{ $mailboxFilter }}">
                    @endif
                    <i class="bi bi-search"></i>
                    <input type="search" name="q" value="{{ $search }}" placeholder="Search sender or subject">
                </form>

                @if ($isAdmin && $configured)
                    {{-- The scheduled pass is the normal path; this one exists so
                         a queue can be filled while the admin is still looking at
                         it, rather than on the next cron tick. --}}
                    <form action="{{ route('follow_ups.scan') }}" method="POST" class="m-0">
                        @csrf
                        <button class="emi-chip" type="submit"
                            title="Look at recent mail now and raise anything that is owed an answer">
                            <i class="bi bi-arrow-repeat"></i>
                            <span>Check now</span>
                        </button>
                    </form>
                @endif
            </div>
        </div>

        @php
            // Bootstrap contextual names come off the model; the cards speak in
            // design-system tones, so translate once here rather than in six
            // places below.
            $statusTone = [
                'success' => 'green',
                'danger' => 'red',
                'warning' => 'amber',
                'secondary' => 'slate',
            ];
        @endphp

        <div class="emi-fu-list">
            @forelse ($tasks as $task)
                @php
                    $late = $task->isOverdue();
                    $senderEmail = trim((string) $task->sender_email);
                    $displayName = trim((string) $task->sender_name) ?: $senderEmail;
                    $showAddress = $senderEmail !== '' && strcasecmp($displayName, $senderEmail) !== 0;

                    // Drives the stripe down the card's edge: a problem, work in
                    // hand, or finished with.
                    $state = $late
                        ? 'late'
                        : ($task->isOpen()
                            ? 'open'
                            : ($task->status === \App\Models\FollowUp::STATUS_DONE ? 'done' : 'dismissed'));

                    $statusLabel = $late && $task->isOpen() ? 'overdue' : $task->status;
                @endphp
                <article class="emi-fu emi-fu--{{ $state }}">
                    {{-- Who it is from, and when it is owed. --}}
                    <div class="emi-fu__head">
                        <span class="emi-sender">
                            <span class="emi-sender__avatar" aria-hidden="true">
                                {{ mb_substr($displayName !== '' ? $displayName : '?', 0, 1) }}
                            </span>
                            <span class="emi-sender__meta">
                                <span class="emi-sender__name">
                                    <span class="emi-cell-strong"
                                        title="{{ $displayName }}">{{ $displayName ?: 'Unknown sender' }}</span>
                                </span>
                                @if ($showAddress)
                                    <a class="emi-sender__mail" href="mailto:{{ $senderEmail }}"
                                        title="{{ $senderEmail }}">{{ $senderEmail }}</a>
                                @endif
                            </span>
                        </span>

                        <span class="emi-fu__due">
                            @if ($task->isOpen())
                                {{-- "3 weeks late", and under it the time it was
                                     actually owed. --}}
                                <span class="emi-fu__due-label">{{ $task->dueLabel() }}</span>
                                @if ($task->due_at)
                                    <span class="emi-fu__due-abs">{{ $task->due_at->format('d M, H:i') }}</span>
                                @endif
                            @else
                                {{-- A closed task's label is already the absolute
                                     time, so naming it beats printing it twice. --}}
                                <span class="emi-fu__due-abs">was due</span>
                                <span class="emi-fu__due-label">{{ $task->dueLabel() }}</span>
                            @endif
                        </span>
                    </div>

                    {{-- The mail itself, and why it is in the queue at all. A
                         queue nobody trusts is a queue nobody works. --}}
                    <div>
                        <h3 class="emi-fu__subject">
                            {{ \Illuminate\Support\Str::limit($task->subject, 120) ?: '(no subject)' }}
                        </h3>
                        @if ($task->reason)
                            <p class="emi-fu__why">{{ $task->reason }}</p>
                        @endif
                        @if ($task->note)
                            <p class="emi-fu__note"><i class="bi bi-sticky"></i>{{ $task->note }}</p>
                        @endif
                    </div>

                    {{-- What it needs on the left, what you can do about it on
                         the right — the columns that used to fall off the edge. --}}
                    <div class="emi-fu__foot">
                        <div class="emi-fu__tags">
                            {{-- Same kind marks as the mail cards: two pills side by
                                 side gave no way to tell the action from the status. --}}
                            @if ($task->actionName())
                                <span class="emi-pill emi-pill--kind {{ $task->pillClass() }}"
                                    title="Next action — {{ $task->actionName() }}">
                                    <span class="emi-pill__kind"><i
                                            class="bi bi-lightning-charge-fill"></i>Action</span>{{ $task->actionName() }}</span>
                            @else
                                <span class="emi-pill emi-pill--kind emi-pill--slate"
                                    title="Next action — reply to this mail">
                                    <span class="emi-pill__kind"><i
                                            class="bi bi-lightning-charge-fill"></i>Action</span>Reply</span>
                            @endif

                            <span class="emi-pill emi-pill--kind emi-pill--{{ $statusTone[$task->statusColour()] ?? 'slate' }}"
                                title="Status — {{ $statusLabel }}">
                                <span class="emi-pill__kind"><i
                                        class="bi bi-flag-fill"></i>Status</span>{{ ucfirst($statusLabel) }}</span>

                            @if ($task->escalated)
                                <span class="emi-pill emi-pill--red">escalated</span>
                            @endif

                            <span class="emi-fu__fact" title="Reminders sent so far">
                                <i class="bi bi-bell"></i>
                                {{ $task->reminder_count }}
                                {{ \Illuminate\Support\Str::plural('reminder', $task->reminder_count) }}
                            </span>

                            @if ($task->isOpen() && !$task->remind_at && $task->reminder_count > 0)
                                {{-- Chasing stopped, the work did not. --}}
                                <span class="emi-fu__fact"><i class="bi bi-bell-slash"></i>no more due</span>
                            @endif

                            @if ($task->completion_source === \App\Models\FollowUp::COMPLETION_REPLY)
                                <span class="emi-fu__fact"><i class="bi bi-reply"></i>reply seen</span>
                            @endif

                            @if ($task->trigger_type === \App\Models\FollowUp::TRIGGER_MANUAL)
                                <span class="emi-fu__fact"><i class="bi bi-hand-index"></i>raised by hand</span>
                            @endif

                            @if (count($mailboxNames) > 1 && !$mailboxFilter)
                                <span class="emi-fu__fact" title="Mailbox">
                                    <i class="bi bi-inbox"></i>
                                    {{ $mailboxNames[$task->user_id] ?? '#' . $task->user_id }}
                                </span>
                            @endif
                        </div>

                        <div class="emi-actions">
                            @if ($task->message_ref)
                                <a class="emi-action emi-action--primary"
                                    href="{{ route('mails.reply', ['id' => $task->message_ref, 'user_id' => $task->user_id]) }}"
                                    title="Answer it now"><i class="bi bi-reply-fill"></i>Reply</a>
                            @endif
                            <a class="emi-action emi-action--icon"
                                href="{{ route('thread.summary', ['messageId' => $task->message_id, 'userId' => $task->user_id]) }}"
                                title="The whole conversation"><i class="bi bi-card-text"></i></a>

                            @if ($task->isOpen())
                                <form action="{{ route('follow_ups.complete', $task->id) }}" method="POST" class="m-0">
                                    @csrf
                                    <button class="emi-action emi-action--track" type="submit"
                                        title="Done — stop reminding me">
                                        <i class="bi bi-check2"></i>Done
                                    </button>
                                </form>

                                <div class="dropdown emi-more">
                                    <button type="button" class="emi-action emi-action--icon emi-more__toggle"
                                        data-bs-toggle="dropdown" aria-expanded="false" title="Later"
                                        aria-label="Remind me later">
                                        <i class="bi bi-alarm"></i>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li class="emi-more__label">Remind me</li>
                                        @foreach ($snoozeOptions as $minutes => $label)
                                            <li>
                                                <form action="{{ route('follow_ups.snooze', $task->id) }}" method="POST"
                                                    class="m-0">
                                                    @csrf
                                                    <input type="hidden" name="minutes" value="{{ $minutes }}">
                                                    <button class="dropdown-item" type="submit">
                                                        <i class="bi bi-alarm"></i>{{ $label }}
                                                    </button>
                                                </form>
                                            </li>
                                        @endforeach
                                    </ul>
                                </div>

                                <form action="{{ route('follow_ups.dismiss', $task->id) }}" method="POST" class="m-0">
                                    @csrf
                                    <button class="emi-action emi-action--icon emi-action--danger" type="submit"
                                        title="Not worth following up — do not raise this mail again">
                                        <i class="bi bi-x-lg"></i>
                                    </button>
                                </form>
                            @else
                                <form action="{{ route('follow_ups.reopen', $task->id) }}" method="POST" class="m-0">
                                    @csrf
                                    <button class="emi-action" type="submit" title="Put it back on the queue">
                                        <i class="bi bi-arrow-counterclockwise"></i>Reopen
                                    </button>
                                </form>
                            @endif
                        </div>
                    </div>
                </article>
            @empty
                <div class="emi-card">
                    <div class="emi-empty">
                        <i class="bi {{ $view === 'overdue' ? 'bi-check2-circle' : 'bi-inbox' }}"></i>
                        @if ($view === 'overdue')
                            <h3>Nothing is overdue</h3>
                            <p>That is the whole point.</p>
                        @elseif ($view === 'today')
                            <h3>Nothing else is due today</h3>
                            <p>Anything raised later will appear here.</p>
                        @else
                            <h3>No follow-ups here yet</h3>
                            <p>Mail that is owed an answer turns up on this queue on its own.</p>
                        @endif
                    </div>
                </div>
            @endforelse
        </div>

        @if ($tasks->hasPages())
            <div class="mt-3">
                {{ $tasks->links() }}
            </div>
        @endif

        <p class="text-muted mt-3" style="font-size:.8125rem;">
            A follow-up closes itself once the sync sees a reply on the conversation, so anything answered from a
            mail client drops off this queue on its own. Dismissing one is permanent in the sense that matters:
            the mail is never raised again.
        </p>
    </div>
@endsection