<a class="navbar-item" href="{% url 'compose_workspace' %}">
  <span class="icon is-small"><i class="fa-solid fa-table-cells-large"></i></span>
  <span style="margin-left: 0.35rem;">Compose Workspace</span>
</a>
<hr class="navbar-divider" style="margin: 0.2rem 0;">
{% if items %}
  {% for item in items %}
    <a class="navbar-item" href="{{ item.compose_url }}">
      <span>
        {{ item.person_name }} · {{ item.service|title }}
        {% if not item.linked_person %}
          <small class="has-text-grey"> · unlinked</small>
        {% endif %}
      </span>
    </a>
  {% endfor %}
{% else %}
  <a class="navbar-item is-disabled">No contacts found.</a>
{% endif %}
<hr class="navbar-divider" style="margin: 0.2rem 0;">
<a class="navbar-item" href="{{ match_url }}">
  <span class="icon is-small"><i class="fa-solid fa-link"></i></span>
  <span style="margin-left: 0.35rem;">Match Contacts</span>
</a>
{% if is_preview %}
  <hr class="navbar-divider" style="margin: 0.2rem 0;">
  <a
    class="navbar-item"
    hx-get="{{ fetch_contacts_url }}"
    hx-target="#nav-compose-contacts"
    hx-swap="innerHTML">
    <span class="icon is-small"><i class="fa-solid fa-users"></i></span>
    <span style="margin-left: 0.35rem;">Fetch Contacts</span>
  </a>
{% endif %}
