{% extends "library/_layout.html" %}
{% from "_macros.html" import icon %}
{% set section = "notes" %}

{% block title %}Notes - {{ brand.name }}{% endblock %}
{% block heading %}Notes{% endblock %}
{% block actions %}
<a class="btn btn--primary btn--sm" href="/library/notes/new">{{ icon("plus", "icon--sm") }} New note</a>
{% endblock %}

{% block library_content %}
<p class="admin-lede">
  Longer things worth keeping between conversations. A model writes these itself
  when it works something out, and you can edit or delete any of them — they are
  yours, not its.
</p>

{#
  Two views, as links, so a filtered list is a real URL you can keep -- the same
  shape the admin lists use. A badge on a row answers "is this mine?"; the question somebody has is
  "what have people given me?", which a mixed list of two hundred cannot answer.
#}
<div class="filter-tabs" style="margin-bottom: var(--sp-4)">
  <a class="filter-tab {{ 'is-active' if not shared }}" href="/library/notes">All notes</a>
  <a class="filter-tab {{ 'is-active' if shared }}" href="/library/notes?shared=1">Shared with me</a>
</div>
<form method="get" action="/library/notes" class="btn-row" style="margin-bottom: var(--sp-5)">
  <input class="input" type="search" name="q" value="{{ q }}" style="flex: 1"
         placeholder="Search notes…">
  <button class="btn" type="submit">{{ icon("search", "icon--sm") }} Search</button>
  {% if q %}<a class="btn btn--sm" href="/library/notes">Clear</a>{% endif %}
</form>

{% if not notes %}
<div class="empty">
  {{ icon("pencil", "empty__mark") }}
  <h2 class="empty__title">{{ "Nothing found" if q else "No notes yet" }}</h2>
  <p class="empty__text">
    {% if q %}
      No note matches “{{ q }}”.
    {% else %}
      Give a model the notes tool and it will start keeping them, or write the
      first one yourself.
    {% endif %}
  </p>
</div>
{% else %}
<ul class="model-list">
  {% for note in notes %}
  <li class="model-list__item">
    <div style="min-width: 0">
      <a href="/library/notes/{{ note.id }}"><strong>{{ note.title }}</strong></a>
      <div class="text-xs faint">{{ note.body[:160] }}{{ "…" if note.body|length > 160 }}</div>
    </div>
    <div class="btn-row">
      {% if note.author == "model" %}<span class="badge badge--leaf">written by a model</span>{% endif %}
      {% if note.owner_id != user.id %}<span class="badge">shared</span>{% endif %}
    </div>
  </li>
  {% endfor %}
</ul>
{% include "library/_pager.html" %}
{% endif %}
{% endblock %}