{% extends "base_template.html" %}

{% block title %}{{ _('Captcha') }}{% endblock %}

{% block content %}
<div class="d-flex flex-column align-items-start gap-2 mb-4">
    <div>
        <h1 class="h3 mb-0">{{ _('Cloudflare Turnstile captcha') }}</h1>
        <p class="text-muted mb-0">{{ _('Keys used to protect forms from spam. Editable here, no .env edit needed.') }}</p>
    </div>
</div>

{% with messages = get_flashed_messages(with_categories=true) %}
    {% for category, message in messages %}
        <div class="alert alert-{{ 'danger' if category == 'danger' else 'success' }} py-2">{{ message }}</div>
    {% endfor %}
{% endwith %}

{% if open_in_effect == 'empty' %}
    {# Without a secret the check lets every submission through. #}
    <div class="alert alert-warning py-2" role="alert" data-secret-warning="empty">
        {{ _("No secret key is in effect, so the captcha checks nothing and the forms accept every submission. Store the real secret key here or set it in the product configuration.") }}
    </div>
{% elif open_in_effect == 'test-key' %}
    {# The test secret accepts only the public dummy token, which any bot can send. #}
    <div class="alert alert-warning py-2" role="alert" data-secret-warning="test-key">
        {{ _("The secret key in effect is Cloudflare's test key, which accepts only Cloudflare's public test token, one any bot can send, and refuses real ones, so the captcha does not protect the forms. Store the real secret key here or set it in the product configuration.") }}
    </div>
{% endif %}

<form method="POST" class="card">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
    <div class="card-body">
        <div class="row g-3">
            <div class="col-12">
                <label class="form-label" for="site_key">{{ _('Site key') }}</label>
                <input id="site_key" name="site_key" class="form-control" value="{{ setting('turnstile_site_key', '') }}" placeholder="1x00000000000000000000AA" autocomplete="off">
                <div class="form-text">{{ _('Public key, rendered in the page next to the widget.') }}</div>
            </div>
            <div class="col-12">
                <label class="form-label" for="secret_key">{{ _('Secret key') }}</label>
                {# The stored secret is never written into the page. #}
                <input id="secret_key" name="secret_key" type="password" class="form-control" value="" autocomplete="new-password">
                <div class="form-text">{{ _('Private key, used server-side to verify submissions. Once stored it is never shown again.') }}</div>
                {% if secret_stored %}
                    <div class="form-text" data-secret-state="stored">{{ _('A secret key is stored. Leave the field empty to keep it, or type a new one to replace it.') }}</div>
                    <div class="form-check mt-2">
                        <input class="form-check-input" type="checkbox" name="remove_secret_key" id="remove_secret_key" value="1">
                        <label class="form-check-label" for="remove_secret_key">{{ _('Remove the stored secret key and use the one in the product configuration') }}</label>
                    </div>
                    {% if open_after_removal == 'empty' %}
                        <div class="form-text text-warning" data-remove-hands-back="empty">{{ _("The product configuration holds no secret key, so removing the stored one leaves the forms unprotected.") }}</div>
                    {% elif open_after_removal == 'test-key' %}
                        <div class="form-text text-warning" data-remove-hands-back="test-key">{{ _("The product configuration holds Cloudflare's test key, so removing the stored one leaves the forms unprotected.") }}</div>
                    {% endif %}
                {% else %}
                    <div class="form-text" data-secret-state="none">{{ _('No secret key is stored here, so the one in the product configuration is used. Type one to store it.') }}</div>
                {% endif %}
            </div>
            <div class="col-12">
                <div class="alert alert-info mb-0 py-2">
                    {{ _("Cloudflare's official test keys are used by default, so development works out of the box (they always pass).") }}
                    <a href="https://dash.cloudflare.com/?to=/:account/turnstile" target="_blank" rel="noopener">{{ _('Get real keys for production from the Cloudflare Turnstile dashboard.') }}</a>
                </div>
            </div>
        </div>
    </div>
    <div class="card-footer text-end">
        <button class="btn btn-primary" type="submit">{{ _('Save') }}</button>
    </div>
</form>
{% endblock %}