irdb/ui/resources/views/pages/settings/index.twig

{% extends 'layout.twig' %}

{% block title %}Settings — IRDB{% endblock %}

{% block content %}
<div class="mx-auto max-w-5xl space-y-6">
    <div class="flex items-center justify-between">
        <h1 class="text-2xl font-semibold tracking-tight">Settings</h1>
        <span class="text-xs text-slate-500 dark:text-slate-400">Admin only · read-only · masked secrets</span>
    </div>

    {% if error %}
        <div class="rounded-md border border-red-300 bg-red-50 px-4 py-2 text-sm text-red-800 dark:border-red-800 dark:bg-red-950 dark:text-red-300">{{ error }}</div>
    {% endif %}

    {# ------------------------- Configuration ------------------------- #}
    {% if config and config.sections %}
        <section class="rounded-2xl border border-slate-200 bg-white p-5 shadow-sm dark:border-slate-800 dark:bg-slate-900">
            <h2 class="text-sm font-semibold uppercase tracking-wider text-slate-500 dark:text-slate-400">Configuration</h2>
            <p class="mt-1 text-xs text-slate-500 dark:text-slate-400">Effective values from the api's environment. Secrets are masked (<code>***</code>) or previewed (first 8 chars + …).</p>

            <div class="mt-4 grid gap-5 md:grid-cols-2">
                {% for section_name, items in config.sections %}
                    <div class="rounded-lg border border-slate-100 dark:border-slate-800">
                        <div class="border-b border-slate-100 bg-slate-50 px-4 py-2 text-xs font-semibold uppercase tracking-wider text-slate-500 dark:border-slate-800 dark:bg-slate-950 dark:text-slate-400">{{ section_name }}</div>
                        <dl class="divide-y divide-slate-100 dark:divide-slate-800 text-sm">
                            {% for key, value in items %}
                                <div class="grid grid-cols-2 gap-2 px-4 py-2">
                                    <dt class="font-mono text-xs text-slate-500 dark:text-slate-400">{{ key }}</dt>
                                    <dd class="break-all font-mono text-xs text-slate-700 dark:text-slate-200">
                                        {%- if value is null -%}<span class="text-slate-400">—</span>
                                        {%- elseif value is same as(true) -%}true
                                        {%- elseif value is same as(false) -%}false
                                        {%- else -%}{{ value }}{%- endif -%}
                                    </dd>
                                </div>
                            {% endfor %}
                        </dl>
                    </div>
                {% endfor %}
            </div>
        </section>
    {% endif %}

    {# ------------------------------ Jobs ----------------------------- #}
    {% if jobs and jobs.jobs %}
        <section class="rounded-2xl border border-slate-200 bg-white p-5 shadow-sm dark:border-slate-800 dark:bg-slate-900">
            <h2 class="text-sm font-semibold uppercase tracking-wider text-slate-500 dark:text-slate-400">Jobs</h2>
            <p class="mt-1 text-xs text-slate-500 dark:text-slate-400">Latest run, lock state, and manual-trigger buttons. Manual triggers run synchronously — wait for the response.</p>

            <div class="mt-4 overflow-hidden rounded-lg border border-slate-100 dark:border-slate-800">
                <table class="w-full text-sm">
                    <thead class="border-b border-slate-100 bg-slate-50 text-left text-xs uppercase tracking-wider text-slate-500 dark:border-slate-800 dark:bg-slate-950 dark:text-slate-400">
                        <tr>
                            <th class="px-4 py-2 font-medium">Name</th>
                            <th class="px-4 py-2 font-medium">Last status</th>
                            <th class="px-4 py-2 font-medium">Last finished</th>
                            <th class="px-4 py-2 font-medium">Items</th>
                            <th class="px-4 py-2 text-right font-medium">Trigger</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-slate-100 dark:divide-slate-800">
                        {% for name, info in jobs.jobs %}
                            <tr>
                                <td class="px-4 py-2 align-top font-mono text-xs">
                                    {{ name }}
                                    {% if info.overdue %}
                                        <span class="ml-1 rounded bg-red-100 px-1.5 py-0.5 text-[0.65rem] font-mono uppercase text-red-800 dark:bg-red-950 dark:text-red-300">overdue</span>
                                    {% endif %}
                                </td>
                                <td class="px-4 py-2 align-top">
                                    {% if info.last_run %}
                                        {% set s = info.last_run.status %}
                                        {% set classes = {
                                            'success':        'bg-emerald-100 text-emerald-900 dark:bg-emerald-900 dark:text-emerald-100',
                                            'failure':        'bg-red-100 text-red-900 dark:bg-red-900 dark:text-red-100',
                                            'skipped_locked': 'bg-amber-100 text-amber-900 dark:bg-amber-900 dark:text-amber-100',
                                            'running':        'bg-blue-100 text-blue-900 dark:bg-blue-900 dark:text-blue-100',
                                        } %}
                                        <span class="rounded px-2 py-0.5 font-mono text-[0.65rem] uppercase {{ classes[s]|default('bg-slate-100 text-slate-700 dark:bg-slate-800 dark:text-slate-300') }}">{{ s }}</span>
                                    {% else %}
                                        <span class="text-xs text-slate-400">never run</span>
                                    {% endif %}
                                </td>
                                <td class="px-4 py-2 align-top font-mono text-xs text-slate-500">
                                    {{ info.last_run.finished_at|default('—') }}
                                </td>
                                <td class="px-4 py-2 align-top font-mono text-xs text-slate-500">
                                    {{ info.last_run.items_processed|default('—') }}
                                </td>
                                <td class="px-4 py-2 align-top text-right">
                                    {% if name != 'tick' %}
                                        <form method="post" action="/app/settings/jobs/trigger/{{ name }}" class="inline" x-data="{ submitting: false }" x-on:submit="submitting = true">
                                            <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                                            <button type="submit" x-bind:disabled="submitting"
                                                    class="rounded-md border border-slate-300 px-2 py-1 text-xs hover:bg-slate-50 disabled:opacity-50 dark:border-slate-700 dark:hover:bg-slate-800">
                                                <span x-show="!submitting">Run now</span>
                                                <span x-show="submitting" x-cloak>Running…</span>
                                            </button>
                                        </form>
                                    {% else %}
                                        <span class="text-xs text-slate-400">scheduled</span>
                                    {% endif %}
                                </td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </section>
    {% endif %}

    {# ------------------------------ GeoIP ----------------------------- #}
    {% if config and config.sections.geoip %}
        <section class="rounded-2xl border border-slate-200 bg-white p-5 shadow-sm dark:border-slate-800 dark:bg-slate-900">
            <h2 class="text-sm font-semibold uppercase tracking-wider text-slate-500 dark:text-slate-400">GeoIP</h2>
            <p class="mt-1 text-xs text-slate-500 dark:text-slate-400">Provider, on-disk paths, and credential state. DB freshness comes from healthz; the trigger button on <code>refresh-geoip</code> is in the Jobs section above.</p>
            <dl class="mt-3 grid grid-cols-3 gap-2 text-sm">
                <dt class="text-slate-500 dark:text-slate-400">Provider</dt>
                <dd class="col-span-2 font-mono text-xs">{{ config.sections.geoip.GEOIP_PROVIDER|default('—') }}</dd>
                <dt class="text-slate-500 dark:text-slate-400">Country DB</dt>
                <dd class="col-span-2 font-mono text-xs">{{ config.sections.geoip.GEOIP_COUNTRY_DB|default('—') }}</dd>
                <dt class="text-slate-500 dark:text-slate-400">ASN DB</dt>
                <dd class="col-span-2 font-mono text-xs">{{ config.sections.geoip.GEOIP_ASN_DB|default('—') }}</dd>
                <dt class="text-slate-500 dark:text-slate-400">MaxMind key</dt>
                <dd class="col-span-2 font-mono text-xs">{{ config.sections.geoip.MAXMIND_LICENSE_KEY ? config.sections.geoip.MAXMIND_LICENSE_KEY : '(unset)' }}</dd>
                <dt class="text-slate-500 dark:text-slate-400">IPinfo token</dt>
                <dd class="col-span-2 font-mono text-xs">{{ config.sections.geoip.IPINFO_TOKEN ? config.sections.geoip.IPINFO_TOKEN : '(unset)' }}</dd>
            </dl>
        </section>
    {% endif %}
</div>
{% endblock %}