eric / rustwarden

{% extends "base.html" %}

{% block title %}{{ page_title }}{% endblock %}

{% block navbar %}
{% include "components/navbar.html" %}
{% endblock %}

{% block content %}
<div class="container mx-auto px-4 py-8" x-data="fediversePage" data-saved="{% if saved_flash %}true{% else %}false{% endif %}">

    <nav class="text-sm breadcrumbs mb-6" aria-label="breadcrumb">
        <ul>
            <li><a href="/">{{ breadcrumb_home }}</a></li>
            <li><a href="/admin">{{ breadcrumb_admin }}</a></li>
            <li><a href="/admin/fediverse">{{ breadcrumb_federation }}</a></li>
            <li aria-current="page">{{ breadcrumb_self }}</li>
        </ul>
    </nav>

    {% include "components/admin_tabs.html" %}

    <header class="mb-8">
        <h1 class="text-3xl font-bold mb-2">{{ heading }}</h1>
        <p class="text-base-content/70">{{ subtitle }}</p>
    </header>

    {# Toast on save #}
    <div
        x-show="saved"
        x-transition
        role="status"
        aria-live="polite"
        class="alert alert-success mb-6"
    >
        <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>
        <span>{{ saved_toast }}</span>
    </div>

    {# Kill switch by domain (Plan UI §3 P1: one primary action per card) #}
    {% if has_rows %}
    <section class="card bg-base-100 shadow-xl mb-8 border-l-4 border-error" aria-labelledby="kill-legend">
        <div class="card-body">
            <h2 id="kill-legend" class="card-title text-xl mb-4 text-error">{{ kill_switch_legend }}</h2>
            <div class="form-control">
                <label class="label" for="kill-domain">
                    <span class="label-text font-semibold">{{ kill_switch_label }}</span>
                </label>
                <div class="flex gap-2 max-w-md">
                    <select id="kill-domain" x-model="killDomain" class="select select-bordered flex-1">
                        <option value=""></option>
                        {% for d in distinct_domains %}
                        <option value="{{ d }}">{{ d }}</option>
                        {% endfor %}
                    </select>
                    <button
                        type="button"
                        class="btn btn-error"
                        :disabled="!killDomain"
                        @click="openKillModal()"
                    >
                        {{ kill_switch_button }}
                    </button>
                </div>
            </div>
        </div>
    </section>
    {% endif %}

    {# Sessions table #}
    {% if has_rows %}
    <section class="card bg-base-100 shadow-xl">
        <div class="card-body">
            <div class="overflow-x-auto">
                <table class="table table-zebra">
                    <thead>
                        <tr>
                            <th>{{ table_handle }}</th>
                            <th>{{ table_display_name }}</th>
                            <th>{{ table_domain }}</th>
                            <th>{{ table_last_seen }}</th>
                            <th class="text-right">{{ table_actions }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for row in rows %}
                        <tr>
                            <td class="font-mono">{{ row.handle }}</td>
                            <td>{% if row.has_display_name %}{{ row.display_name }}{% else %}—{% endif %}</td>
                            <td><span class="badge badge-ghost">{{ row.domain }}</span></td>
                            <td class="text-base-content/70">{{ row.last_seen }}</td>
                            <td class="text-right">
                                <button
                                    type="button"
                                    class="btn btn-sm btn-ghost text-error"
                                    @click="revokeTarget = '{{ row.id }}|{{ row.handle }}'"
                                    aria-haspopup="dialog"
                                >
                                    {{ revoke_button }}
                                </button>
                            </td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </section>
    {% else %}
    <section class="card bg-base-200 shadow-inner" aria-label="empty-state">
        <div class="card-body items-center text-center py-16">
            <svg xmlns="http://www.w3.org/2000/svg" class="h-16 w-16 text-base-content/30 mb-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z" /></svg>
            <h3 class="text-lg font-semibold">{{ empty_title }}</h3>
            <p class="text-base-content/70 max-w-md">{{ empty_body }}</p>
        </div>
    </section>
    {% endif %}

    {# Revoke individual session modal (Plan UI §3 P2) #}
    <dialog
        class="modal"
        :class="{ 'modal-open': revokeTarget !== null }"
        role="alertdialog"
        aria-labelledby="revoke-title"
    >
        <div class="modal-box">
            <h3 id="revoke-title" class="font-bold text-lg">{{ revoke_confirm_title }}</h3>
            <p class="py-4">
                {{ revoke_confirm_body }}
                <span class="font-mono block mt-2" x-text="revokeHandle()"></span>
            </p>
            <form method="POST" action="/admin/fediverse/sessions_remote/revoke" class="modal-action">
                <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                <input type="hidden" name="id" :value="revokeTarget ? revokeTarget.split('|')[0] : ''">
                <button type="button" class="btn btn-ghost" @click="revokeTarget = null">{{ modal_cancel }}</button>
                <button type="submit" class="btn btn-error">{{ modal_confirm }}</button>
            </form>
        </div>
        <form method="dialog" class="modal-backdrop">
            <button type="button" @click="revokeTarget = null" aria-label="close">close</button>
        </form>
    </dialog>

    {# Kill switch domain modal (extra-destructive — DaisyUI native dialog) #}
    <dialog id="kill-domain-modal" class="modal" role="alertdialog" aria-labelledby="kill-modal-title">
        <div class="modal-box">
            <h3 id="kill-modal-title" class="font-bold text-lg text-error">{{ kill_switch_confirm_title }}</h3>
            <p class="py-4">
                {{ kill_switch_confirm_body }}
                <span class="font-mono block mt-2" x-text="killDomain"></span>
            </p>
            <form method="POST" action="/admin/fediverse/sessions_remote/kill_domain" class="modal-action">
                <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                <input type="hidden" name="domain" :value="killDomain">
                <button type="button" class="btn btn-ghost" @click="closeKillModal()">{{ modal_cancel }}</button>
                <button type="submit" class="btn btn-error">{{ modal_confirm }}</button>
            </form>
        </div>
        <form method="dialog" class="modal-backdrop">
            <button type="button" aria-label="close">close</button>
        </form>
    </dialog>
</div>
{% endblock %}