{% extends "profile_base.html" %}

{% set profile_nav_active = "timers" %}
{% block profile_content %}
      <div class="d-flex flex-wrap align-items-center justify-content-between gap-2 mb-3">
        <div>
          {% set breadcrumbs = [
            {"name": current_user.name | display_name(current_user.username), "href": "/profile"},
            {"name": "Timers", "href": "/profile/timers"},
            {"name": "New" if is_new else "Edit"}
          ] %}
          {% include "partials/breadcrumbs.html" %}
        </div>
      </div>
  {% include "partials/flash.html" %}
      <div class="row g-3">
        <div class="col-12 col-lg-8">
          <div class="card shadow-sm">
            <div class="card-body">
              <div class="text-uppercase text-muted small fw-semibold mb-2">
                {% if is_new %}New Timer{% else %}Edit Timer{% endif %}
              </div>
              <form method="post" action="{{ form_action }}">
                <input type="hidden" name="csrf_token" value="{{ csrf_token }}" />
                <div class="row g-3">
                  {% include "partials/timer_form_fields.html" %}
                </div>

                <div class="mt-4 d-flex gap-2">
                  <button class="btn btn-primary" type="submit">{% if is_new %}Create Timer{% else %}Save Changes{% endif %}</button>
                  <a class="btn btn-outline-secondary" href="/profile/timers">Cancel</a>
                </div>
              </form>
            </div>
          </div>
        </div>

        {% if not is_new and timer %}
          <div class="col-12 col-lg-4">
            <div class="card shadow-sm">
              <div class="card-body">
                <div class="text-uppercase text-muted small fw-semibold mb-2">Current Schedule</div>
                <p class="mb-2">{{ timer.schedule }}</p>
                <dl class="row mb-0 small">
                  <dt class="col-5 text-body-secondary">Next run</dt>
                  <dd class="col-7">{% if timer.next_run_at %}{{ timer.next_run_at }}{% else %}&mdash;{% endif %}</dd>
                  <dt class="col-5 text-body-secondary">Last run</dt>
                  <dd class="col-7">{% if timer.last_run_at %}{{ timer.last_run_at }}{% else %}&mdash;{% endif %}</dd>
                  <dt class="col-5 text-body-secondary">Times fired</dt>
                  <dd class="col-7">{{ timer.run_count }}</dd>
                </dl>
              </div>
            </div>
          </div>
        {% endif %}
      </div>
{% endblock %}