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

{% block title %}Reservation {{ reservation.id }} - Pychestrate Resources{% endblock %}

{% block content %}
<div class="page-header">
    <h1>Reservation #{{ reservation.id }}</h1>
    <p>Reservation details for {{ reservation.resource_name }}</p>
</div>

<div class="detail-grid">
    <div>
        <div class="card">
            <h2 class="card-header">Reservation Information</h2>
            <div class="table-scroll" tabindex="0"><table class="data-table">
                <tr>
                    <th scope="row" class="w-sm">ID</th>
                    <td>{{ reservation.id }}</td>
                </tr>
                <tr>
                    <th scope="row">Resource</th>
                    <td><a href="{{ url_for('resources.resource_detail', resource_id=reservation.resource_id) }}">{{ reservation.resource_name }}</a></td>
                </tr>
                <tr>
                    <th scope="row">User</th>
                    <td>{{ reservation.username or '—' }}</td>
                </tr>
                <tr>
                    <th scope="row">Job ID</th>
                    <td>{{ reservation.job_id or '—' }}</td>
                </tr>
                <tr>
                    <th scope="row">Start Time</th>
                    <td>{{ reservation.start_time | local_datetime(true, '—') }}</td>
                </tr>
                <tr>
                    <th scope="row">End Time</th>
                    <td>{{ reservation.end_time | local_datetime(true, '—') }}</td>
                </tr>
                <tr>
                    <th scope="row">Mode</th>
                    <td>
                        {% set mode = reservation.mode %}
                        {% if mode == 'exclusive' %}
                        <span class="badge badge-info">Exclusive</span>
                        {% else %}
                        <span class="badge badge-info">Shared</span>
                        {% endif %}
                    </td>
                </tr>
                <tr>
                    <th scope="row">Status</th>
                    <td>
                        {% if reservation.status == 'pending' %}
                        <span class="badge badge-warning">Pending</span>
                        {% elif reservation.status == 'active' %}
                        <span class="badge badge-success">Active</span>
                        {% elif reservation.status == 'completed' %}
                        <span class="badge badge-secondary">Completed</span>
                        {% elif reservation.status == 'cancelled' %}
                        <span class="badge badge-danger">Cancelled</span>
                        {% else %}
                        <span class="badge badge-secondary">{{ reservation.status }}</span>
                        {% endif %}
                    </td>
                </tr>
                <tr>
                    <th scope="row">Reason</th>
                    <td data-role="reservation-reason">{{ reservation.reason or '—' }}</td>
                </tr>
                <tr>
                    <th scope="row">Created</th>
                    <td>{{ reservation.created_at | local_datetime(true, '—') }}</td>
                </tr>
            </table></div>
        </div>
    </div>
    
    <div>
        {% set is_owner = (reservation.user_id | string) == (current_user_id | string) %}
        {% if reservation.status == 'pending' and (is_owner or can_manage) %}
        <div class="card">
            <h2 class="card-header">Actions</h2>
            <div class="stack">
                <a href="{{ url_for('resources.reservation_edit', reservation_id=reservation.id) }}" class="btn btn-secondary">
                    {{ ui.icon("edit") }} Edit Reservation
                </a>
                <form action="{{ url_for('resources.reservation_cancel', reservation_id=reservation.id) }}" method="post" data-confirm="{% if is_owner %}Cancel this reservation?{% else %}Cancel this person's reservation? Your reason is recorded in the audit log; they are not notified.{% endif %}">
                    <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                    {% if not is_owner %}
                    <div class="form-group">
                        <label for="cancel_reason">Reason for cancelling {{ reservation.username or "another person" }}&rsquo;s reservation</label>
                        <input type="text" id="cancel_reason" name="reason" class="form-control" required>
                    </div>
                    {% endif %}
                    <button type="submit" class="btn btn-danger btn-block">
                        {{ ui.icon("cancel") }} Cancel Reservation
                    </button>
                </form>
            </div>
        </div>
        {% endif %}
        
        <div class="card">
            <h2 class="card-header">Navigation</h2>
            <div class="stack">
                <a href="{{ url_for('resources.resource_detail', resource_id=reservation.resource_id) }}" class="btn btn-secondary">
                    {{ ui.icon("devices") }} View Resource
                </a>
                <a href="{{ url_for('resources.reservation_list') }}" class="btn btn-secondary">
                    {{ ui.icon("event") }} All Reservations
                </a>
            </div>
        </div>
    </div>
</div>
{% include "site_shell/_local_times.html" %}
{% endblock %}