{% extends "base.html" %}

{% block main %}
<div class="page-grid">
  <div class="page-grid__toolbar">
    {% include "toolbar_user.html" %}
  </div>
  <div class="page-grid__sidebar">
    <div style="padding: 1rem;">
      {{ workspace_nav | safe }}
    </div>
  </div>
  <main class="page-grid__main padded padded--lg">
    <form method="post" action="update-name">
      <section>
        <h1>Workspace Name</h1>
        <input
          type="text"
          autocomplete="off"
          class="form__input"
          data-1p-ignore
          data-bwignore="true"
          data-lpignore="true"
          data-protonpass-ignore="true"
          name="name"
          value="{{ workspace.display_name }}"
        >
        <div class="form__buttons">
          <button class="button button--primary" type="submit">Save</button>
        </div>
      </section>
    </form>
    <section>
      <h1>Sharing</h1>
      <div class="form__buttons">
        <button class="button button--primary" popovertarget="invite-dialog" type="button">
          Invite
        </button>
      </div>
      <dialog
        class="dialog padded padded--lg"
        id="invite-dialog"
        popover="auto"
      >
        <form action="grant-workspace-privilege" method="post">
          <div class="form-grid">
            <div class="form-grid-row">
              <label for="invite-dialog-email-input">Email</label>
              <input
                type="text"
                id="invite-dialog-email-input"
                autocomplete="off"
                data-1p-ignore
                data-bwignore="true"
                data-lpignore="true"
                data-protonpass-ignore="true"
                inputmode="email"
                name="email"
              >
            </div>
            <input type="hidden" name="csrf_token" value="FIXME">
            <button class="button button--primary" type="submit">
              Invite
            </button>
          </div>
        </form>
      </dialog>
      <table class="table" style="margin-top: var(--default-padding);">
        <thead>
          <tr>
            <th scope="col">Email</th>
            <th scope="col">Permissions</th>
            <th scope="col">Actions</th>
          </tr>
        </thead>
        <tbody>
          {% for permissions_editor in collaborators %}
          <tr>
            {% let collaborator = User::try_from(permissions_editor.target.clone())? %}
            <td class="text--data">{{ collaborator.email }}</td>
            <td>
              {{ permissions_editor | safe }}
            </td>
            <td>
              <form action="revoke-workspace-privileges" method="post">
                <input type="hidden" name="user_id" value="{{ collaborator.id.simple() }}">
                <input type="hidden" name="csrf_token" value="FIXME">
                <button type="submit" class="button button--secondary button--small">
                  Revoke
                </button>
              </form>
            </td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
      <div class="form__buttons">
        <button class="button button--primary" type="submit">Save</button>
      </div>
    </section>
  </main>
</div>
{% endblock %}