{% extends "base.html" %}
{% block title %}Organization settings - RadiusForge{% endblock %}
{% block content %}
    <div class="rf-page-head">
        <div>
            <h1>Organization settings</h1>
            <p class="rf-lede">For <strong>{{ organization.name }}</strong>. Only the Owner can change these.</p>
        </div>
    </div>

    <form method="post" class="rf-form-card">
        {% csrf_token %}
        <div class="checkbox-row">
            {{ form.apply_to_live_sessions }}
            <label for="{{ form.apply_to_live_sessions.id_for_label }}">{{ form.apply_to_live_sessions.label }}</label>
        </div>
        <div class="helptext">{{ form.apply_to_live_sessions.help_text }}</div>

        <div class="checkbox-row">
            {{ form.portal_enabled }}
            <label for="{{ form.portal_enabled.id_for_label }}">{{ form.portal_enabled.label }}</label>
        </div>
        <div class="helptext">{{ form.portal_enabled.help_text }}
            {% if organization.portal_enabled %}Your subscribers log in at <strong>{{ portal_address }}</strong>.{% endif %}
        </div>
        {% if organization.portal_enabled and not secure %}
        {% if portal_allow_http %}
        <p class="rf-message rf-message-error">This address is not secure (https). Test mode is on
            (RADIUSFORGE_PORTAL_ALLOW_HTTP=true), so the portal shows its login form anyway, with a warning. Use this
            only in a lab: subscribers' passwords cross the network unprotected.</p>
        {% else %}
        <p class="rf-message rf-message-error">This address is not secure (https). Subscribers' passwords would cross the
            network unprotected, so the portal refuses to show its login form until RadiusForge is reached over https.</p>
        {% endif %}
        {% endif %}

        <div class="checkbox-row">
            {{ form.usage_alerts_enabled }}
            <label for="{{ form.usage_alerts_enabled.id_for_label }}">{{ form.usage_alerts_enabled.label }}</label>
        </div>
        <div class="helptext">{{ form.usage_alerts_enabled.help_text }}</div>

        <div class="checkbox-row">
            {{ form.vouchers_enabled }}
            <label for="{{ form.vouchers_enabled.id_for_label }}">{{ form.vouchers_enabled.label }}</label>
        </div>
        <div class="helptext">{{ form.vouchers_enabled.help_text }}</div>

        <div class="checkbox-row">
            {{ form.require_2fa }}
            <label for="{{ form.require_2fa.id_for_label }}">{{ form.require_2fa.label }}</label>
        </div>
        <div class="helptext">{{ form.require_2fa.help_text }}</div>
        {% if organization.usage_alerts_enabled and mail_problem %}
        <p class="rf-message rf-message-error">Usage alerts are on, but cannot be sent yet: {{ mail_problem }}.</p>
        {% endif %}

        <div class="rf-form-actions">
            <button type="submit" name="section" value="settings">Save</button>
        </div>
    </form>

    {# Step A1 (2 Oct 2026): how this Organization's emails go out. #}
    <div class="rf-page-head">
        <div>
            <h2>Email</h2>
            <p class="rf-lede">How emails to your customers go out (for example usage alerts).
                {% if server_mail %}This server sends through {{ server_mail }}.{% else %}This server has no mail
                settings yet - ask whoever runs it, or use your own mail server.{% endif %}</p>
        </div>
    </div>
    {% if mail_problem %}
    <p class="rf-message rf-message-error">Emails cannot be sent yet: {{ mail_problem }}.</p>
    {% endif %}
    <form method="post" class="rf-form-card" autocomplete="off">
        {% csrf_token %}
        {% for field in mail_form.common_fields %}
        <label for="{{ field.id_for_label }}">{{ field.label }}</label>
        {{ field }}
        {% if field.help_text %}<div class="helptext">{{ field.help_text }}</div>{% endif %}
        {% for error in field.errors %}<div class="errorlist">{{ error }}</div>{% endfor %}
        {% endfor %}
        {# Only used with "Our own mail server": shown only then (found live, 2 Oct 2026: fields  #}
        {# shown in server mode looked as if they applied). Without JavaScript the group stays visible. #}
        <div id="rf-own-mail">
            <p class="rf-lede"><strong>Your own mail server</strong> - only used when "Our own mail server" is chosen above.</p>
            {% for field in mail_form.own_fields %}
            <label for="{{ field.id_for_label }}">{{ field.label }}</label>
            {{ field }}
            {% if field.help_text %}<div class="helptext">{{ field.help_text }}</div>{% endif %}
            {% for error in field.errors %}<div class="errorlist">{{ error }}</div>{% endfor %}
            {% endfor %}
        </div>
        {% for error in mail_form.non_field_errors %}<div class="errorlist">{{ error }}</div>{% endfor %}
        <div class="rf-form-actions">
            <button type="submit" name="section" value="mail">Save mail settings</button>
        </div>
    </form>

    <script>
        // Show the own-server group only when "Our own mail server" is chosen; hidden fields are
        // also disabled, so nothing in them is sent (or silently ignored).
        (function () {
            var mode = document.getElementById("id_mode"), own = document.getElementById("rf-own-mail");
            if (!mode || !own) { return; }
            function update() {
                var on = mode.value === "own";
                own.hidden = !on;
                own.querySelectorAll("input, select").forEach(function (el) { el.disabled = !on; });
            }
            mode.addEventListener("change", update);
            update();
        }());
    </script>

    <form method="post" class="rf-form-card">
        {% csrf_token %}
        <input type="hidden" name="section" value="test">
        <label for="id_test_to">Send a test email to</label>
        <input type="email" name="test_to" id="id_test_to" value="{{ user_email }}" required>
        <div class="helptext">Uses the saved settings above{% if mail_source == "own" %} (your own mail server){% else %} (this server's){% endif %}.</div>
        <div class="rf-form-actions">
            <button type="submit">Send a test email</button>
        </div>
    </form>
    {# Step API 1 (2 Oct 2026): API keys - for a billing system or your own scripts. #}
    <div class="rf-page-head">
        <div>
            <h2>API keys</h2>
            <p class="rf-lede">Let another system (for example billing) use RadiusForge's API at
                <strong>{{ api_address }}</strong>. A key is shown once, when it is created: store it in that
                system, then it cannot be seen again. Revoke a key the moment it is no longer needed.
                <a href="{% url 'api-docs' %}">Read the API documentation</a>.</p>
        </div>
    </div>
    {% if new_api_key %}
    <div class="rf-message rf-message-ok">
        <p><strong>Your new API key - copy it now, it will not be shown again:</strong></p>
        <p>Access: <strong>{{ new_api_key_access }}</strong></p>
        <code class="rf-status-command" id="rf-new-key">{{ new_api_key }}</code>
        {# API 1b (3 Oct 2026): copying by hand put OUR command lines on the clipboard instead of the key (3.BQ). #}
        {# Hidden until the script runs; it says "Copied" only once the browser confirms, and says what arrived. #}
        <button type="button" id="rf-copy-key" hidden>Copy key</button>
        <span id="rf-copy-status" role="status" aria-live="polite"></span>
    </div>
    <script>
        // The key is read from the page's own text (it is in the page once, never in an attribute).
        // If the browser refuses the clipboard, the key is selected instead, ready for Ctrl+C.
        (function () {
            var code = document.getElementById("rf-new-key"), button = document.getElementById("rf-copy-key"),
                status = document.getElementById("rf-copy-status");
            if (!code || !button || !status) { return; }
            var key = code.textContent.trim();
            if (!/^rfk_[0-9a-f]{8}_[A-Za-z0-9_-]{43}$/.test(key)) { return; }   // never copy anything else
            function selectKey() {
                var range = document.createRange(), selection = window.getSelection();
                range.selectNodeContents(code);
                selection.removeAllRanges();
                selection.addRange(range);
                status.textContent = " Could not copy by itself - the key is selected: press Ctrl+C.";
            }
            button.addEventListener("click", function () {
                status.textContent = "";
                if (!navigator.clipboard || !window.isSecureContext) { selectKey(); return; }
                navigator.clipboard.writeText(key).then(function () {
                    status.textContent = " Copied: " + key.length + " characters, starting " + key.slice(0, 4) +
                        ". Paste it into the other system now.";
                }, selectKey);
            });
            button.hidden = false;
        }());
    </script>
    {% endif %}
    {% if api_key_error %}<p class="rf-message rf-message-error">{{ api_key_error }}</p>{% endif %}
    {% if api_keys %}
    <table class="rf-cards">
        <thead>
            <tr><th>Name</th><th>Access</th><th>Key starts</th><th>Created</th><th>Last used</th><th><span class="rf-visually-hidden">Actions</span></th></tr>
        </thead>
        <tbody>
        {% for k in api_keys %}
            <tr>
                <td data-label="Name" class="rf-primary">{{ k.name }}</td>
                <td data-label="Access">{{ k.get_scope_display }}</td>
                <td data-label="Key starts" class="mono">rfk_{{ k.ident }}_…</td>
                <td data-label="Created">{{ k.created_at|date:"d M Y" }} by {{ k.created_by }}</td>
                <td data-label="Last used">{% if k.revoked_at %}revoked {{ k.revoked_at|date:"d M Y" }}{% else %}{{ k.last_used_at|date:"d M Y H:i"|default:"never" }}{% endif %}</td>
                <td class="rf-actions">{% if not k.revoked_at %}
                    <form method="post" class="rf-inline-form"
                          onsubmit="return confirm('Revoke {{ k.name|escapejs }}? Anything using it is refused at once.');">
                        {% csrf_token %}
                        <input type="hidden" name="section" value="api_revoke">
                        <input type="hidden" name="key_id" value="{{ k.pk }}">
                        <button type="submit" class="small-button">Revoke</button>
                    </form>{% endif %}
                </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
    {% endif %}
    <form method="post" class="rf-form-card">
        {% csrf_token %}
        <input type="hidden" name="section" value="api_create">
        <label for="id_api_name">Name</label>
        <input type="text" name="api_name" id="id_api_name" maxlength="100" placeholder="For example: Billing system" required>
        <label for="id_api_scope">Access</label>
        {# 3 Oct 2026: nothing preselected - "Read only" was, and a read-only key was made twice by mistake. #}
        <select name="api_scope" id="id_api_scope" required>
            <option value="" selected disabled>Choose what this key may do</option>
            <option value="read">Read only - look up subscribers, plans, sessions and usage</option>
            <option value="write">Read and write - also add, change, suspend and disconnect subscribers</option>
        </select>
        <div class="rf-form-actions">
            <button type="submit">Create API key</button>
        </div>
    </form>
    {# Backups (25 Oct 2026): status + a manual trigger. Backups run on every node nightly. #}
    <div class="rf-page-head">
        <div>
            <h2>Backups</h2>
            <p class="rf-lede">Your server backs itself up automatically every night - the database and
                configuration, on each node, kept for 14 days. You can also run one now.</p>
        </div>
    </div>
    <form method="post" class="rf-form-card">
        {% csrf_token %}
        <input type="hidden" name="section" value="backup_now">
        <div class="rf-form-actions">
            <button type="submit">Back up now</button>
        </div>
    </form>
    {% if recent_backups %}
    <table class="rf-cards">
        <thead>
            <tr><th>When</th><th>Node</th><th>Result</th><th>Tables</th><th>Size</th></tr>
        </thead>
        <tbody>
        {% for b in recent_backups %}
            <tr>
                <td data-label="When" class="rf-primary">{{ b.created_at|date:"d M Y H:i" }}</td>
                <td data-label="Node">{{ b.host }}</td>
                <td data-label="Result">{% if b.ok %}<span class="rf-pill rf-pill-active">OK</span>{% else %}<span class="rf-pill rf-pill-suspended">Failed</span>{% endif %}</td>
                <td data-label="Tables">{{ b.tables }}</td>
                <td data-label="Size">{{ b.size }}</td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
    {% else %}
    <p class="hint">No backups recorded yet. The first nightly run (or "Back up now") will appear here.</p>
    {% endif %}
{% endblock %}