{{define "title"}}App Passwords - Email Server{{end}}
{{define "page_title"}}App Passwords{{end}}

{{define "content"}}
<div class="d-flex justify-content-between align-items-center mb-4">
    <h2><i class="bi bi-key me-2"></i>App Passwords <small class="text-muted fs-6">{{.mailbox.Email}}</small></h2>
    <a href="/pymta-manager/mailboxes" class="btn btn-secondary"><i class="bi bi-arrow-left me-2"></i>Back to Mailboxes</a>
</div>

<div class="alert alert-info">
    <i class="bi bi-info-circle me-2"></i>Use an app password (never the mailbox's own password) to set this mailbox up in Thunderbird or any other IMAP/SMTP client. Each one is shown only once, right after you create it.
</div>

<div class="card mb-4">
    <div class="card-header"><h5 class="mb-0"><i class="bi bi-plus-circle me-2"></i>Create App Password</h5></div>
    <div class="card-body">
        <form method="POST" action="/pymta-manager/mailboxes/{{.mailbox.ID}}/apppasswords/add" class="row g-2 align-items-end">
            <div class="col-auto">
                <label for="label" class="form-label">Label</label>
                <input type="text" class="form-control" id="label" name="label" placeholder="e.g. Thunderbird laptop">
            </div>
            <div class="col-auto">
                <button type="submit" class="btn btn-success"><i class="bi bi-key me-2"></i>Generate</button>
            </div>
        </form>
    </div>
</div>

<div class="card">
    <div class="card-header"><h5 class="mb-0"><i class="bi bi-list-ul me-2"></i>Existing App Passwords</h5></div>
    <div class="card-body p-0">
        {{if .passwords}}
            <div class="table-responsive">
                <table class="table table-dark table-hover mb-0">
                    <thead><tr><th>Label</th><th>Created</th><th>Last Used</th><th>Status</th><th>Actions</th></tr></thead>
                    <tbody>
                        {{range .passwords}}
                        <tr>
                            <td>{{.Label}}</td>
                            <td><small class="text-muted">{{strftime "%Y-%m-%d %H:%M" .CreatedAt}}</small></td>
                            <td><small class="text-muted">{{if .LastUsedAt}}{{strftime "%Y-%m-%d %H:%M" .LastUsedAt}}{{else}}Never{{end}}</small></td>
                            <td>{{if .IsActive}}<span class="badge bg-success">Active</span>{{else}}<span class="badge bg-danger">Revoked</span>{{end}}</td>
                            <td>
                                <form method="post" action="/pymta-manager/mailboxes/{{$.mailbox.ID}}/apppasswords/{{.ID}}/revoke" class="d-inline">
                                    <button type="submit" class="btn btn-outline-danger btn-sm" title="Revoke" data-confirm="Revoke app password &quot;{{.Label}}&quot;? Any client using it will stop working."><i class="bi bi-trash"></i></button>
                                </form>
                            </td>
                        </tr>
                        {{end}}
                    </tbody>
                </table>
            </div>
        {{else}}
            <div class="text-center py-5">
                <i class="bi bi-key text-muted" style="font-size: 4rem;"></i>
                <h4 class="text-muted mt-3">No app passwords yet</h4>
                <p class="text-muted">Create one above to connect a mail client to this mailbox.</p>
            </div>
        {{end}}
    </div>
</div>
{{end}}