{% extends "base.html" %}
{% block content %}
<div class="page-head">
  <div>
    <h1>{{ month_name }} {{ year }}</h1>
    <p class="muted">Night duty every day, plus separate Saturday and Sunday lunch rotas.</p>
  </div>
  <div class="month-nav">
    <a class="button secondary" href="/?year={{ prev[0] }}&month={{ prev[1] }}">← Previous</a>
    <a class="button secondary" href="/?year={{ nxt[0] }}&month={{ nxt[1] }}">Next →</a>
  </div>
</div>

<div class="calendar-list">
{% for day, assignments in month_days %}
  <section class="day-card {% if day == today %}today{% endif %}">
    <div class="day-label">
      <strong>{{ day.strftime('%a') }}</strong>
      <span>{{ day.day }}</span>
    </div>
    <div class="day-assignments">
      {% for assignment in assignments %}
      <article class="assignment {% if assignment.id in my_assignment_ids %}mine{% endif %}">
        <div>
          <div class="assignment-title">{{ assignment.schedule.name }}</div>
          <div class="assignment-person">
            {% if assignment.user %}{{ assignment.user.name }}{% else %}<span class="unassigned">Unassigned</span>{% endif %}
          </div>
        </div>
        {% if assignment.id in my_assignment_ids and day >= today %}
          <div class="assignment-action">
          {% if assignment.id in open_swap_assignment_ids %}
            <span class="badge">Change requested</span>
          {% else %}
            <details>
              <summary>Request change</summary>
              <form method="post" action="/assignments/{{ assignment.id }}/swap" class="swap-form">
                <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
                <label>Ask
                  <select name="target_user_id">
                    <option value="">Anyone available</option>
                    {% for person in active_users %}
                      {% if person.id != current_user.id %}<option value="{{ person.id }}">{{ person.name }}</option>{% endif %}
                    {% endfor %}
                  </select>
                </label>
                <label>Message <span class="muted">(optional)</span>
                  <input name="message" maxlength="500" placeholder="I cannot do this day…">
                </label>
                <button class="primary small" type="submit">Send request</button>
              </form>
            </details>
          {% endif %}
          </div>
        {% endif %}
      </article>
      {% endfor %}
    </div>
  </section>
{% endfor %}
</div>
{% endblock %}