{#
  The heading and action switcher shared by the five table-definition pages.
  Every one of them carries a `page` (crate::pages::admin::table_definition::
  state::TableDefinitionPageState), whose `active` says which is open.

  These are deliberately separate pages, for the same reason the permission
  sections are: adding a column, dropping a table, copying a profile and
  reading its rename history are four different decisions, and stacking them
  on one screen was what made the old workspace impossible to find anything
  in. Which links appear follows how much has been selected — the table-wide
  ones need a table, the profile-wide ones only a profile.
#}
<section class="heading">
  <div>
    <p class="eyebrow">
      {%- if page.selection.has_table() %}{{ page.selection.scope_label() }}{% else %}Table definition{% endif -%}
    </p>
    <h1>
      {%- if page.selection.has_table() %}{{ page.selection.table }}{% else %}{{ page.selection.scope_label() }}{% endif -%}
    </h1>
    <p>
      {%- if let Some(detail) = page.detail -%}
        {{ detail.columns.len() }} columns · identified by
        {%- if detail.row_display_columns.is_empty() %} its id
        {%- else %} {{ detail.row_display_columns|join(", ") }}{% endif -%}
        {%- if let Some(summary) = page.selected_table() -%}
          {%- if !summary.depends_on.is_empty() %} · depends on {{ summary.depends_on|join(", ") }}{% endif -%}
        {%- endif -%}
        .
      {%- else -%}
        Everything on this page acts on this profile.
      {%- endif -%}
    </p>
  </div>
  <div class="actions">
    <a href="/admin{% if page.selection.has_table() %}{{ page.selection.query() }}{% else %}{{ page.selection.profile_query() }}{% endif %}">← Admin panel</a>
  </div>
</section>

<nav class="tabs" aria-label="table actions">
  {% if page.selection.has_table() %}
    {% if page.table_is_writable() %}
      <a href="/admin/tables/columns{{ page.selection.query() }}" class="tab {% if page.is("columns") %}selected{% endif %}" {% if page.is("columns") %}aria-current="page"{% endif %}>
        <span>Columns</span><small>Append columns and rename them</small>
      </a>
      <a href="/admin/tables/delete{{ page.selection.query() }}" class="tab {% if page.is("delete") %}selected{% endif %}" {% if page.is("delete") %}aria-current="page"{% endif %}>
        <span>Delete</span><small>Drop this table</small>
      </a>
    {% endif %}
    <a href="/permissions/grants" class="tab">
      <span>Access</span><small>Which roles may read and write it</small>
    </a>
  {% endif %}
  {% if page.selection.has_profile() && !page.selection.is_global() %}
    <a href="/admin/profiles/copy{{ page.selection.profile_query() }}" class="tab {% if page.is("copy") %}selected{% endif %}" {% if page.is("copy") %}aria-current="page"{% endif %}>
      <span>Copy profile</span><small>Duplicate its structure</small>
    </a>
    <a href="/admin/tables/from-template{{ page.selection.profile_query() }}" class="tab {% if page.is("template") %}selected{% endif %}" {% if page.is("template") %}aria-current="page"{% endif %}>
      <span>From template</span><small>Create tables from a Typst invoice</small>
    </a>
    <a href="/admin/profiles/history{{ page.selection.profile_query() }}" class="tab {% if page.is("history") %}selected{% endif %}" {% if page.is("history") %}aria-current="page"{% endif %}>
      <span>Rename history</span><small>How columns got their names</small>
    </a>
  {% endif %}
</nav>

{% if page.selection.has_table() && !page.table_is_writable() %}
  <section class="panel">
    <h2>Backend-managed</h2>
    <p class="hint">
      This table is the backend's own. Its definition is visible in the
      <a href="/admin{{ page.selection.query() }}">admin panel</a>, but it can only be
      changed through the backend's own APIs, so none of the write actions apply to it.
    </p>
  </section>
{% endif %}