{% extends "config/base.html" %}
{% import "site_shell/_macros.html" as ui %}

{% block title %}Create Role - Pychestrate Configuration{% endblock %}

{% block content %}
<div class="page-header">
    <h1>Create Role</h1>
    <p>Add a new role with specific permissions {{ ui.learn_more("01-00-overview", "concepts") }}</p>
</div>

{% if start_from_roles %}
<div class="card mb" data-role="start-from">
    <form method="get" action="{{ url_for('config.role_create') }}">
        <div class="form-group">
            <label for="copy_from">Start from an existing role</label>
            <select id="copy_from" name="copy_from" class="form-control" aria-describedby="copy_from-help">
                <option value="">An empty role</option>
                {% for candidate in start_from_roles %}
                <option value="{{ candidate.id }}"{% if copy_of and copy_of.id == candidate.id %} selected{% endif %}>{{ candidate.name }} ({{ candidate.permissions | length }} permission{{ '' if candidate.permissions | length == 1 else 's' }}{% if candidate.is_system %}, built-in{% endif %})</option>
                {% endfor %}
            </select>
            <p id="copy_from-help" class="form-text">Puts that role's permissions in the form below so you can adjust them. Nothing is saved until you choose Create Role.</p>
        </div>
        <button type="submit" class="btn btn-secondary">Use This Role</button>
    </form>
</div>
{% endif %}

<div class="card">
    {% if copy_of %}
    <p class="muted small" data-role="copy-note">Copy of {{ copy_of.name }}: its {{ copy_of.permissions | length }} permission{{ '' if copy_of.permissions | length == 1 else 's' }} are ticked below. Give the copy a name and adjust what it allows, then choose Create Role.</p>
    {% endif %}
    <form method="post">
        <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
        {{ ui.error_summary(errors, error_labels) }}

        <div class="form-group">
            <label for="name">Role Name *</label>
            <input type="text" id="name" name="name" class="form-control" required
                   value="{{ form_data.name if form_data else '' }}"{{ ui.invalid_attrs(errors, 'name') }}>
            {{ ui.field_error(errors, 'name') }}
        </div>
        
        <div class="form-group">
            <label for="description">Description</label>
            <textarea id="description" name="description" class="form-control" rows="3">{{ form_data.description if form_data else '' }}</textarea>
        </div>
        
        {% if permissions %}
        <div class="form-group">
            <label id="permission_keys-label">Permissions</label>
            <div id="permission_keys" role="group" aria-labelledby="permission_keys-label"{% if errors and 'permission_keys' in errors %} aria-describedby="permission_keys-error"{% endif %} tabindex="-1">
                {{ ui.permission_picker(permissions, form_data.getlist('permission_keys') if form_data else []) }}
            </div>
            {{ ui.field_error(errors, 'permission_keys') }}
        </div>
        {% endif %}
        
        <div class="actions-row">
            <button type="submit" class="btn btn-primary">
                {{ ui.icon("save") }} Create Role
            </button>
            <a href="{{ url_for('config.role_list') }}" class="btn btn-secondary">Cancel</a>
        </div>
    </form>
</div>
{% include "site_shell/_permission_filter.html" %}
{% endblock %}