{% extends "layouts/with_toolbar.html" %}

{% block main %}
<nav class="workspace-nav" style="position: relative; margin: 0 auto; max-width: 540px;">
  <section class="workspace-nav__section">
    <div class="workspace-nav__heading">
      <h1>My Workspaces</h1>
      <form method="post" action="add">
        <button class="button--secondary button--small" type="submit">
          <i class="ti ti-plus"><div class="sr-only">Add workspace</div></i>
        </button>
      </form>
    </div>
    <menu class="workspace-nav__menu">
      {% for workspace_perm in workspace_perms %}
      <li class="workspace-nav__menu-item">
        <div class="workspace-nav__menu-leaf">
          <a href="
          {{- navigator
            .workspace_page()
            .workspace_id(*workspace_perm.workspace_id)
            .build()?
            .get_path() -}}
          " class="workspace-nav__menu-link">
            {% if workspace_perm.workspace_display_name.is_empty() %}
            [Untitled Workspace]
            {% else %}
            {{ workspace_perm.workspace_display_name }}
            {% endif %}
          </a>
        </div>
      </li>
      {% endfor %}
    </menu>
  </section>
</nav>
{% endblock %}