{% extends "admin/base.html" %}

{% block title %}{{ "Edit" if client else "New" }} OAuth Client - Admin - {{ site_name() }}{% endblock %}

{% block admin_content %}
<hgroup>
    <h1>{{ "Edit" if client else "New" }} OAuth Client</h1>
    <p>{{ "Update client settings" if client else "Register a new OAuth2 client application" }}</p>
</hgroup>

{% if new_secret %}
<style nonce="{{ csp_nonce() }}">
.sk-secret-reveal {
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: #fff8e1;
    border: 1px solid #ffe082;
    border-radius: 0.5rem;
}
.sk-secret-reveal p { margin: 0 0 0.5rem; }
.sk-secret-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.sk-secret-masked {
    font-size: 0.95rem;
    padding: 0.25rem 0.5rem;
    background: var(--sk-color-bg-subtle, #f8f9fa);
    border-radius: 0.25rem;
}
</style>
<div class="sk-secret-reveal">
    <p><strong>Client Secret</strong> — save this now, it won't be shown again</p>
    <div class="sk-secret-row">
        <code class="sk-secret-masked">{{ new_secret[:8] }}••••••••••••</code>
        <span hidden id="sk-secret-full">{{ new_secret }}</span>
        <button type="button" class="sk-btn-outline sk-btn-small" onclick="copyValue(this, document.getElementById('sk-secret-full').textContent)">Copy</button>
    </div>
</div>
{% endif %}

{% if client %}
<div style="margin-bottom: 1.5rem; padding: 1rem; background: var(--sk-color-bg-subtle, #f8f9fa); border-radius: 0.5rem;">
    <p><strong>Client ID:</strong> <code>{{ client.client_id }}</code>
        <button type="button" class="sk-btn-outline sk-btn-small" onclick="copyValue(this, '{{ client.client_id }}')">Copy</button>
    </p>
    <p><strong>Client Secret:</strong> <code>{{ client.client_secret[:8] }}••••••••</code></p>
    <form method="post" action="/admin/oauth-clients/{{ client.id }}/regenerate-secret" style="display: inline;">
        {{ csrf_field() }}
        <button type="submit" class="sk-btn-outline sk-btn-small" onclick="return confirm('Regenerate secret? The old secret will stop working immediately.')">Regenerate Secret</button>
    </form>
</div>
<script nonce="{{ csp_nonce() }}">
function copyValue(btn, text) {
    navigator.clipboard.writeText(text).then(function() {
        var orig = btn.textContent;
        btn.textContent = 'Copied!';
        setTimeout(function() { btn.textContent = orig; }, 2000);
    });
}
</script>
{% endif %}

<form method="post" action="/admin/oauth-clients/{{ client.id ~ '/edit' if client else 'new' }}">
    {{ csrf_field() }}

    <label>
        Display Name
        <input type="text" name="display_name" value="{{ client.display_name if client else '' }}" required placeholder="My Application">
    </label>

    <label>
        Redirect URIs <small class="sk-text-muted">(one per line)</small>
        <textarea name="redirect_uris" rows="4" placeholder="https://example.com/callback">{{ client.redirect_uris if client else '' }}</textarea>
    </label>

    <fieldset>
        <legend>Allowed Scopes</legend>
        {% for scope_name, scope_def in available_scopes.items() %}
        <label>
            <input type="checkbox" name="scope_{{ scope_name }}" {% if client and scope_name in client.allowed_scope_list %}checked{% endif %}>
            <span>
                <strong>{{ scope_name }}</strong>
                <small class="sk-text-muted"> — {{ scope_def.description }}</small>
            </span>
        </label>
        {% endfor %}
    </fieldset>

    {% if client %}
    <label>
        <input type="checkbox" name="is_active" {% if client.is_active %}checked{% endif %}>
        Active
    </label>
    {% endif %}

    <div class="sk-form-actions">
        <button type="submit">{{ "Update Client" if client else "Create Client" }}</button>
        <a href="/admin/oauth-clients" role="button" class="sk-btn-outline">Cancel</a>
    </div>
</form>

{% if client %}
<hr>
<details>
    <summary>Danger Zone</summary>
    <form method="post" action="/admin/oauth-clients/{{ client.id }}/delete" style="margin-top: 1rem;">
        {{ csrf_field() }}
        <button type="submit" class="sk-btn-danger" onclick="return confirm('Delete this client? This cannot be undone.')">Delete Client</button>
    </form>
</details>
{% endif %}
{% endblock %}
