@extends('admin.admin_dashboard')
@section('admin')

<div class="page-content">
    <x-chm.layout.page
        title="Email"
        subtitle="Internal staff messaging connected to your mail server."
        icon="bx bx-envelope"
    >
        <x-slot:breadcrumb>
            <x-chm.breadcrumb-item :href="route('admin.dashboard')">Home</x-chm.breadcrumb-item>
            <x-chm.breadcrumb-item :active="true">Email</x-chm.breadcrumb-item>
        </x-slot:breadcrumb>

        <x-slot:actions>
            @if($emailAccount?->isActive())
                <x-chm.button variant="primary" icon="bx bx-edit" :href="route('application.email.compose')">Compose</x-chm.button>
            @endif
        </x-slot:actions>

        @if($emailAccount?->isActive())
            <div class="alert alert-success d-flex align-items-center gap-2 py-2">
                <i class="bx bx-check-circle"></i>
                <span>Connected as <strong>{{ $emailAccount->from_address }}</strong>
                    @if($emailAccount->last_connected_at)
                        · Last connected {{ $emailAccount->last_connected_at->diffForHumans() }}
                    @endif
                </span>
            </div>
        @elseif($emailAccount?->isPending())
            <div class="alert alert-warning d-flex align-items-center gap-2 py-2">
                <i class="bx bx-time-five"></i>
                <span>Your email setup request is pending Super Admin approval.</span>
            </div>
        @else
            <div class="card mb-4">
                <div class="card-body">
                    <h6 class="mb-2">Request email setup</h6>
                    <p class="text-muted small mb-3">Your mail server login must be configured by a Super Admin before you can send email from CHM ERP.</p>
                    <form method="POST" action="{{ route('application.email.setup.request') }}">
                        @csrf
                        <div class="mb-3">
                            <label class="form-label">Request details</label>
                            <textarea class="form-control bg-light" rows="6" readonly>{{ old('request_note', $setupRequestPreview) }}</textarea>
                            <div class="form-text">These details are sent to the Super Admin so they know exactly who to configure.</div>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">Additional note (optional)</label>
                            <textarea name="additional_note" class="form-control" rows="2" maxlength="500" placeholder="e.g. Please use my celebratehope.org mailbox">{{ old('additional_note') }}</textarea>
                        </div>
                        <button type="submit" class="btn btn-primary"><i class="bx bx-send"></i> Request email setup</button>
                    </form>
                </div>
            </div>
        @endif

        <ul class="nav nav-tabs chm-tabs mb-4">
            @if($emailAccount?->isActive())
                <li class="nav-item">
                    <a class="nav-link {{ $tab === 'inbox' ? 'active' : '' }}" href="{{ route('application.email.index', ['tab' => 'inbox']) }}">
                        Inbox
                        @if($unreadCount > 0)
                            <span class="badge bg-danger ms-1">{{ $unreadCount }}</span>
                        @endif
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link {{ $tab === 'sent' ? 'active' : '' }}" href="{{ route('application.email.index', ['tab' => 'sent']) }}">Sent</a>
                </li>
            @endif
            @if(auth()->user()->isSuperAdmin())
                <li class="nav-item">
                    <a class="nav-link {{ $tab === 'setup' ? 'active' : '' }}" href="{{ route('application.email.index', ['tab' => 'setup']) }}">
                        Setup requests
                        @if($setupRequests->count())
                            <span class="badge bg-danger ms-1">{{ $setupRequests->count() }}</span>
                        @endif
                    </a>
                </li>
            @endif
        </ul>

        @if($tab === 'setup' && auth()->user()->isSuperAdmin())
            @if($setupRequests->isEmpty())
                <x-chm.empty-state icon="bx bx-cog" title="No setup requests" message="Staff email setup requests will appear here for you to configure server login details." />
            @else
                <div class="row g-3">
                    @foreach($setupRequests as $setup)
                        <div class="col-lg-6">
                            <div class="card h-100">
                                <div class="card-body">
                                    <div class="d-flex justify-content-between align-items-start mb-2">
                                        <div>
                                            <h6 class="mb-1">{{ $setup->user->name ?? 'User' }}</h6>
                                            <p class="small text-muted mb-0">
                                                @if($setup->user->username)
                                                    Username: {{ $setup->user->username }} ·
                                                @endif
                                                {{ $setup->user->email ?? '' }}
                                            </p>
                                        </div>
                                        <span class="badge bg-warning text-dark">Pending</span>
                                    </div>
                                    @if($setup->request_note)
                                        <pre class="small bg-light border rounded p-2 mb-3" style="white-space: pre-wrap;">{{ $setup->request_note }}</pre>
                                    @endif
                                    <p class="small text-muted mb-3">Requested {{ $setup->requested_at?->diffForHumans() ?? 'recently' }}</p>
                                    <button type="button" class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#setupModal-{{ $setup->id }}">
                                        <i class="bx bx-cog"></i> Configure mail server
                                    </button>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>

                @foreach($setupRequests as $setup)
                    <div class="modal fade" id="setupModal-{{ $setup->id }}" tabindex="-1" aria-hidden="true">
                        <div class="modal-dialog modal-lg">
                            <div class="modal-content">
                                <form method="POST" action="{{ route('application.email.setup.configure', $setup->id) }}">
                                    @csrf
                                    <div class="modal-header">
                                        <h5 class="modal-title">Configure email for {{ $setup->user->name }}</h5>
                                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                                    </div>
                                    <div class="modal-body">
                                        <div class="row g-3">
                                            <div class="col-md-4">
                                                <label class="form-label">Mailer</label>
                                                <input type="text" name="mailer" class="form-control" value="{{ old('mailer', $setup->mailer ?: 'smtp') }}" required>
                                            </div>
                                            <div class="col-md-8">
                                                <label class="form-label">Host</label>
                                                <input type="text" name="host" class="form-control" value="{{ old('host', $setup->host) }}" placeholder="smtp.example.com" required>
                                            </div>
                                            <div class="col-md-4">
                                                <label class="form-label">Port</label>
                                                <input type="text" name="port" class="form-control" value="{{ old('port', $setup->port ?: '587') }}" required>
                                            </div>
                                            <div class="col-md-4">
                                                <label class="form-label">Encryption</label>
                                                <select name="encryption" class="form-select">
                                                    <option value="">None</option>
                                                    <option value="tls" @selected(old('encryption', $setup->encryption) === 'tls')>TLS</option>
                                                    <option value="ssl" @selected(old('encryption', $setup->encryption) === 'ssl')>SSL</option>
                                                </select>
                                            </div>
                                            <div class="col-md-4">
                                                <label class="form-label">Username</label>
                                                <input type="text" name="username" class="form-control" value="{{ old('username', $setup->username ?: $setup->user->email) }}" placeholder="full email address" required>
                                                <div class="form-text">Use the full mailbox address.</div>
                                            </div>
                                            <div class="col-md-6">
                                                <label class="form-label">Password</label>
                                                <input type="password" name="password" class="form-control" required autocomplete="new-password">
                                                <div class="form-text">Enter the mailbox password from your email host (required each time you save).</div>
                                            </div>
                                            <div class="col-md-6">
                                                <label class="form-label">From address</label>
                                                <input type="email" name="from_address" class="form-control" value="{{ old('from_address', $setup->from_address ?: $setup->user->email) }}" required>
                                                <div class="form-text">Must match the SMTP username exactly.</div>
                                            </div>
                                            <div class="col-12">
                                                <label class="form-label">From name</label>
                                                <input type="text" name="from_name" class="form-control" value="{{ old('from_name', $setup->from_name ?: $setup->user->name) }}">
                                            </div>
                                        </div>
                                        <p class="small text-muted mt-3 mb-0">
                                            Saving will test the connection before activating this account.
                                            Typical hosting settings: host <code>mail.celebratehope.org</code>, port <code>587</code> with TLS, or port <code>465</code> with SSL.
                                        </p>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
                                        <button type="submit" class="btn btn-primary"><i class="bx bx-plug"></i> Save &amp; connect</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                @endforeach
            @endif
        @elseif(!$emailAccount?->isActive())
            <x-chm.empty-state icon="bx bx-envelope" title="Email not connected" message="Request setup above. Once an administrator configures your mail server, inbox and compose will appear here." />
        @elseif($tab === 'sent')
            @forelse($sent as $email)
                <div class="card chm-app-list-item mb-2">
                    <div class="card-body d-flex justify-content-between align-items-start gap-3">
                        <div>
                            <a href="{{ route('application.email.show', $email->id) }}" class="fw-semibold text-decoration-none stretched-link">
                                {{ $email->subject }}
                            </a>
                            <p class="small text-muted mb-0 mt-1">
                                To {{ $email->recipient->name ?? 'User' }} · {{ $email->created_at->diffForHumans() }}
                            </p>
                        </div>
                        <form method="POST" action="{{ route('application.email.destroy', $email->id) }}" class="position-relative chm-confirm-delete-form" style="z-index:2" data-confirm-text="Delete this email?">
                            @csrf @method('DELETE')
                            <button type="submit" class="btn btn-sm btn-outline-danger"><i class="bx bx-trash"></i></button>
                        </form>
                    </div>
                </div>
            @empty
                <x-chm.empty-state icon="bx bx-envelope" title="No sent mail" message="Compose a message to a colleague." />
            @endforelse
            <div class="mt-3">{{ $sent->appends(['tab' => 'sent'])->links() }}</div>
        @else
            @forelse($inbox as $email)
                <div class="card chm-app-list-item mb-2 {{ $email->read_at ? '' : 'chm-app-list-item-unread' }}">
                    <div class="card-body d-flex justify-content-between align-items-start gap-3">
                        <div>
                            <a href="{{ route('application.email.show', $email->id) }}" class="fw-semibold text-decoration-none stretched-link {{ $email->read_at ? '' : 'text-dark' }}">
                                {{ $email->subject }}
                            </a>
                            <p class="small text-muted mb-0 mt-1">
                                From {{ $email->sender->name ?? 'User' }} · {{ $email->created_at->diffForHumans() }}
                            </p>
                        </div>
                        <form method="POST" action="{{ route('application.email.destroy', $email->id) }}" class="position-relative chm-confirm-delete-form" style="z-index:2" data-confirm-text="Delete this email?">
                            @csrf @method('DELETE')
                            <button type="submit" class="btn btn-sm btn-outline-danger"><i class="bx bx-trash"></i></button>
                        </form>
                    </div>
                </div>
            @empty
                <x-chm.empty-state icon="bx bx-envelope" title="Inbox is empty" message="You have no messages yet." />
            @endforelse
            <div class="mt-3">{{ $inbox->appends(['tab' => 'inbox'])->links() }}</div>
        @endif
    </x-chm.layout.page>
</div>

@endsection