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

{% block title %}Create Reservation - Pychestrate Resources{% endblock %}

{% block content %}
<div class="page-header">
    <h1>Create Reservation</h1>
    <p>Reserve a resource for future use {{ ui.learn_more("15-00-lab-administration", "reserve-a-device-for-later") }}</p>
</div>

<div class="card narrow">
    {#- The resource-list filter is its own GET form, outside the
        reservation form: applying it puts only the pool and type in the
        URL, never the CSRF token or the typed reservation (audit finding
        RES-32). The reservation form posts back to the filtered URL, so a
        failed submit keeps the narrowed list. #}
    <form method="get" id="reservation-resource-filter">
        <fieldset class="pyc-filter-fieldset">
            <legend>Narrow the resource list</legend>
            <div class="actions-row">
                <label for="pool_id" class="visually-hidden">Pool</label>
                <select id="pool_id" name="pool_id" class="form-control w-sm">
                    <option value="">All Pools</option>
                    {% for pool in pools %}
                    <option value="{{ pool.id }}" {% if selector_pool_id == pool.id %}selected{% endif %}>{{ pool.name }}</option>
                    {% endfor %}
                </select>
                <label for="resource_type" class="visually-hidden">Resource type</label>
                <select id="resource_type" name="resource_type" class="form-control w-sm" aria-describedby="resource_type-help">
                    <option value="">All Types</option>
                    <option value="device" {% if selector_resource_type == 'device' %}selected{% endif %}>Device</option>
                    <option value="ip_address" {% if selector_resource_type == 'ip_address' %}selected{% endif %}>IP Address</option>
                    <option value="port" {% if selector_resource_type == 'port' %}selected{% endif %}>Port</option>
                    <option value="credential" {% if selector_resource_type == 'credential' %}selected{% endif %}>Credential</option>
                    <option value="generic" {% if selector_resource_type == 'generic' %}selected{% endif %}>Generic</option>
                </select>
                <button type="submit" class="btn btn-sm btn-secondary">Apply filter</button>
            </div>
            <p id="resource_type-help" class="form-text">Narrow the list before filling in the reservation: applying the filter starts a fresh form.</p>
        </fieldset>
    </form>

    <form method="post" id="reservation-form">
        <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
        {{ ui.error_summary(errors, error_labels) }}

        {% if resource_total > resources | length %}
        <div class="alert alert-warning">
            Showing the first {{ resources | length }} of {{ resource_total }} resources
            &mdash; narrow the list by pool or type above to reach the rest.
        </div>
        {% endif %}
        <div class="form-group">
            <label for="resource_id">Resource *</label>
            <select id="resource_id" name="resource_id" class="form-control" required{{ ui.invalid_attrs(errors, 'resource_id') }}>
                <option value="">Select a resource</option>
                {% for resource in resources %}
                <option value="{{ resource.id }}" {% if form_data and form_data.resource_id|string == resource.id|string %}selected{% endif %}>{{ resource.name }}</option>
                {% endfor %}
            </select>
            {{ ui.field_error(errors, 'resource_id') }}
        </div>

        <div class="form-group">
            <label for="start_time">Start Time *</label>
            <input type="datetime-local" id="start_time" name="start_time" class="form-control" required
                   value="{{ form_data.start_time if form_data else '' }}"{{ ui.invalid_attrs(errors, 'start_time', 'reservation-zone-note') }}>
            {{ ui.field_error(errors, 'start_time') }}
        </div>

        <div class="form-group">
            <label for="end_time">End Time *</label>
            <input type="datetime-local" id="end_time" name="end_time" class="form-control" required
                   value="{{ form_data.end_time if form_data else '' }}"{{ ui.invalid_attrs(errors, 'end_time', 'reservation-zone-note') }}>
            {{ ui.field_error(errors, 'end_time') }}
            {% include "resources/reservations/_viewer_zone.html" %}
        </div>

        <div class="form-group">
            <label for="mode">Allocation Mode</label>
            <select id="mode" name="mode" class="form-control">
                <option value="exclusive" {% if not form_data or form_data.mode == 'exclusive' %}selected{% endif %}>Exclusive</option>
                <option value="shared" {% if form_data and form_data.mode == 'shared' %}selected{% endif %}>Shared</option>
            </select>
        </div>

        <div class="form-group">
            <label for="job_id">Job ID (optional)</label>
            <input type="text" id="job_id" name="job_id" class="form-control"
                   value="{{ form_data.job_id if form_data else '' }}">
        </div>

        <div class="form-group">
            <label for="reason">Reason</label>
            <textarea id="reason" name="reason" class="form-control" rows="3">{{ form_data.reason if form_data else '' }}</textarea>
        </div>

        <div class="actions-row">
            <button type="submit" class="btn btn-primary">
                {{ ui.icon("save") }} Create Reservation
            </button>
            <a href="{{ url_for('resources.reservation_list') }}" class="btn btn-secondary">Back to reservations</a>
        </div>
    </form>
</div>
{% endblock %}