{% load vantage i18n %}
{% comment %}
  The saved-views strip. Rendered only when `saved_view_write_url` is in the context,
  so a page whose view did not opt in costs nothing.

  Three controls, and one rule for all of them: **Save degrades to Save as when the
  view is immutable to you.** `saved_view_mode` has already worked out which of the
  four reasons applies — not the owner, not a named editor, the view is locked, or
  there is no view open — and every one of them produces the same affordance, so
  nobody has to learn the difference before they can write their filter down.

  Every control is a form, not a script. A saved view is a write, and a write that
  only happens when JavaScript loaded is a write that sometimes does not happen.
{% endcomment %}
{% if saved_view_write_url %}
<div class="v-views" data-saved-views>

  {% if saved_view_broken %}
    {% comment %}
      Validated on load, never on save. Fields get renamed long after a view is
      written, and the honest failure is to say so: dropping the predicate silently
      would show more rows than the view asked for and tell nobody.
    {% endcomment %}
    <div class="v-views-broken" role="status">
      {% if saved_view_widened %}
        <p class="v-views-broken-title">
          {% icon "shield" %}
          {% translate "Part of this view no longer applies, so the results may be broader than intended." %}
        </p>
      {% else %}
        <p class="v-views-broken-title">{% icon "shield" %}{% translate "Part of this view no longer applies." %}</p>
      {% endif %}
      <ul class="v-views-broken-list">
        {% for broken in saved_view_broken %}
          <li>
            <span class="v-pill v-pill-broken">
              <span class="v-pill-name">{{ broken.parameter }}</span>
              <span class="v-pill-value">{{ broken.values|join:", " }}</span>
            </span>
            <span class="v-views-broken-why">{{ broken.reason }}</span>
          </li>
        {% endfor %}
      </ul>
    </div>
  {% endif %}

  <div class="v-views-bar">
    {% comment %}
      The picker was a tab rail across the full width of the page. One line of
      chrome to say which view is open is one line the table does not get, so the
      rail moved inside the control that already states the answer: the summary is
      the current view's name, and every other view is one click below it. The nav
      landmark and the aria-current tab are unchanged — only their container is.
    {% endcomment %}
    {% if saved_views %}
      <details class="v-views-menu v-views-picker">
        <summary class="v-btn v-btn-secondary v-btn-sm v-listbar-trigger">
          <span class="v-views-current">
            {% if saved_view %}{{ saved_view.name }}{% else %}{% translate "All" %}{% endif %}
          </span>
          {% if saved_view_diverged %}<span class="v-views-modified">{% translate "Modified" context "saved view has unsaved changes" %}</span>{% endif %}
        </summary>
        <nav class="v-views-panel v-views-rail" aria-label="{% translate "Saved views" %}">
          <a class="v-views-tab{% if not saved_view %} v-views-tab-current{% endif %}"
             href="{{ request.path }}"{% if not saved_view %} aria-current="page"{% endif %}>{% translate "All" %}</a>
          {% for item in saved_views %}
            <a class="v-views-tab{% if item.current %} v-views-tab-current{% endif %}"
               href="{{ item.url }}"{% if item.current %} aria-current="page"{% endif %}>
              {{ item.view.name }}
              {% if item.view.locked %}<span class="v-views-lock" title="{% translate "Locked" %}">{% icon "shield" %}</span>{% endif %}
              {% if item.view.is_shared %}<span class="v-views-shared" title="{% translate "Shared" %}">{% icon "users" %}</span>{% endif %}
            </a>
          {% endfor %}
        </nav>
      </details>
    {% elif saved_view %}
      <span class="v-views-current">
        <strong>{{ saved_view.name }}</strong>
        {% if saved_view_diverged %}<span class="v-views-modified">{% translate "Modified" context "saved view has unsaved changes" %}</span>{% endif %}
      </span>
    {% endif %}

    {% if saved_view and saved_view_diverged %}
      {# Reset is a plain link back through the apply route: the view as saved. #}
      <a class="v-btn v-btn-ghost v-btn-sm" href="{{ saved_view_reset_url }}">{% translate "Reset" %}</a>
    {% endif %}

    {% if saved_view_mode == "save" and saved_view_diverged %}
      <form method="post" action="{{ saved_view_write_url }}" class="v-views-form">
        {% csrf_token %}
        <input type="hidden" name="intent" value="save">
        <input type="hidden" name="view" value="{{ saved_view.pk }}">
        {# Optimistic locking: a stale number is refused rather than overwriting someone. #}
        <input type="hidden" name="version" value="{{ saved_view.version }}">
        <input type="hidden" name="next" value="{{ request.get_full_path }}">
        <button class="v-btn v-btn-primary v-btn-sm">{% translate "Save" %}</button>
      </form>
    {% endif %}

    <details class="v-views-menu">
      <summary class="v-btn v-btn-secondary v-btn-sm">
        {% if saved_view_mode == "save" and saved_view_diverged %}{% translate "Save as" %}{% else %}{% translate "Save view" %}{% endif %}
      </summary>
      <form method="post" action="{{ saved_view_write_url }}" class="v-views-panel">
        {% csrf_token %}
        <input type="hidden" name="intent" value="save_as">
        <input type="hidden" name="model" value="{{ saved_view_model }}">
        <input type="hidden" name="next" value="{{ request.get_full_path }}">

        <label class="v-views-label" for="v-view-name">{% translate "Name" %}</label>
        <input class="v-input" id="v-view-name" name="name" maxlength="120" required
               placeholder="{% translate "Unpaid this month" %}" autocomplete="off">

        {% comment %}
          Two questions, never one. Who can see it and who can change it are separate
          axes — conflating them is what forces a product to warn its users that a
          "personal" view is not a security feature.
        {% endcomment %}
        <label class="v-views-label" for="v-view-visibility">{% translate "Who can see it" %}</label>
        <select class="v-select" id="v-view-visibility" name="visibility">
          <option value="private" selected>{% translate "Only me" %}</option>
          <option value="shared">{% translate "Everyone who can see this model" %}</option>
        </select>

        <label class="v-views-label" for="v-view-scope">{% translate "Who can change it" %}</label>
        <select class="v-select" id="v-view-scope" name="edit_scope">
          <option value="owner" selected>{% translate "Only me" %}</option>
          <option value="editors">{% translate "Me and named editors" %}</option>
          <option value="everyone">{% translate "Anyone who can see it" %}</option>
        </select>

        <p class="v-views-note">
          {% blocktranslate trimmed %}
            A shared view is never saved automatically — someone else's screen should
            never change because you narrowed a filter.
          {% endblocktranslate %}
        </p>

        <button class="v-btn v-btn-primary v-btn-sm">{% translate "Save view" %}</button>
      </form>
    </details>

    {% if saved_view %}
      <details class="v-views-menu">
        <summary class="v-btn v-btn-ghost v-btn-sm v-btn-icon" aria-label="{% translate "More actions for this view" %}">
          {% icon "sliders" %}
        </summary>
        <div class="v-views-panel">
          <form method="post" action="{{ saved_view_write_url }}">
            {% csrf_token %}
            <input type="hidden" name="intent" value="default">
            <input type="hidden" name="view" value="{{ saved_view.pk }}">
            <input type="hidden" name="next" value="{{ request.get_full_path }}">
            <button class="v-btn v-btn-ghost v-btn-sm">{% translate "Open this by default" %}</button>
          </form>
          {% if saved_view_can_save or saved_view.owner_id == user.pk %}
            <form method="post" action="{{ saved_view_write_url }}">
              {% csrf_token %}
              <input type="hidden" name="intent" value="delete">
              <input type="hidden" name="view" value="{{ saved_view.pk }}">
              <input type="hidden" name="next" value="{{ request.get_full_path }}">
              <button class="v-btn v-btn-ghost v-btn-sm v-views-delete">{% translate "Delete this view" %}</button>
            </form>
          {% endif %}
          {% if saved_view.locked %}
            <p class="v-views-note">
              {% blocktranslate trimmed %}
                This view is locked. Locking freezes the configuration, not the data, and
                it binds the person who made it too.
              {% endblocktranslate %}
            </p>
          {% endif %}
        </div>
      </details>
    {% endif %}
  </div>
</div>
{% endif %}