{#
  GET /admin/workspace — crate::pages::admin::admin::ui::AdminWorkspace
  Also included by pages/admin.html for the first paint. Both structs expose
  the same `page: AdminPageState` field.
#}
<div class="workspace" aria-live="polite">
  <section class="pane">
    <div class="pane-title"><h2>{{ nav.tr("admin-profiles") }}</h2><span>{{ page.profiles.len() }}</span></div>
    <div class="pane-list">
      {% if page.profiles.is_empty() %}
        <p class="empty">{{ nav.tr("admin-no-profiles-available") }}</p>
      {% else %}
        {% for profile in page.profiles %}
          <form hx-get="/admin/workspace" hx-target="#admin-workspace" hx-swap="innerHTML">
            <button class="browser-item {% if page.selected_profile.as_deref() == Some(profile.scope.as_str()) %}selected{% endif %}"
                    type="submit" name="profile" value="{{ profile.scope }}">
              <span>{{ profile.label }}</span>
              <small>
                {{ profile.table_count_label(nav.locale) }}
                {%- if profile.global %} · {{ nav.tr("admin-shared-by-every-profile") }}{% endif %}
              </small>
            </button>
          </form>
        {% endfor %}
      {% endif %}
    </div>
  </section>

  <section class="pane">
    <div class="pane-title"><h2>{{ nav.tr("admin-tables-heading") }}</h2><span>{{ page.tables.len() }}</span></div>
    <div class="pane-list">
      {% if page.selected_profile.is_none() %}
        <p class="empty">{{ nav.tr("admin-select-profile-first") }}</p>
      {% else if page.tables.is_empty() %}
        {% if page.is_global() %}
          <p class="empty">{{ nav.tr("admin-no-global-tables") }}</p>
        {% else %}
          <p class="empty">{{ nav.tr("admin-no-profile-tables") }}</p>
        {% endif %}
      {% else %}
        {% for table in page.tables %}
          <form hx-get="/admin/workspace" hx-target="#admin-workspace" hx-swap="innerHTML">
            <input type="hidden" name="profile" value="{{ page.selected_profile.as_deref().unwrap_or_default() }}">
            <button class="browser-item {% if page.selected_table.as_deref() == Some(table.name.as_str()) %}selected{% endif %}"
                    type="submit" name="table" value="{{ table.name }}">
              <span>{{ table.name }}</span>
              <small>
                {%- if table.depends_on.is_empty() %}{{ nav.tr("admin-no-dependencies") }}{% else %}{{ nav.tr("admin-depends-on-prefix") }} {{ table.depends_on|join(", ") }}{% endif %}
                · {{ nav.tr("admin-row-display-prefix") }} {{ table.row_display_columns|join(", ") }}
              </small>
            </button>
          </form>
          {#
            The actions for the table you are pointed at, next to the table
            itself. Each one is a page of its own; this pane is where you
            choose what to act on, so it is also where you say what to do.
          #}
          {% if page.selected_table.as_deref() == Some(table.name.as_str()) %}
            <div class="browser-actions">
              {% if page.can_manage_tables && !table.is_system() %}
                <a href="/admin/tables/columns/add?profile={{ page.selected_profile.as_deref().unwrap_or_default() }}&table={{ table.name }}">{{ nav.tr("admin-add-columns") }}</a>
                <a href="/admin/tables/presentation?profile={{ page.selected_profile.as_deref().unwrap_or_default() }}&table={{ table.name }}">{{ nav.tr("admin-column-presentation") }}</a>
                <a class="danger-action" href="/admin/tables/delete?profile={{ page.selected_profile.as_deref().unwrap_or_default() }}&table={{ table.name }}">{{ nav.tr("admin-delete-table") }}</a>
              {% endif %}
              <a href="/permissions/grants">{{ nav.tr("admin-who-may-use-it") }}</a>
            </div>
          {% endif %}
        {% endfor %}
        {% if page.selected_table.is_none() %}
          <p class="empty">{{ nav.tr("admin-pick-table-hint") }}</p>
        {% endif %}
      {% endif %}
    </div>
    {% if page.can_manage_tables && page.selected_profile.is_some() %}
      <div class="browser-actions pane-footer">
        {% if page.is_global() %}
          <a href="/admin/tables/new?global=true">+ {{ nav.tr("admin-new-global-table") }}</a>
        {% else %}
          <a href="/admin/tables/new?profile={{ page.selected_profile.as_deref().unwrap_or_default() }}">+ {{ nav.tr("admin-new-table") }}</a>
          <a href="/admin/tables/from-template?profile={{ page.selected_profile.as_deref().unwrap_or_default() }}">{{ nav.tr("admin-from-template") }}</a>
          <a href="/admin/profiles/copy?profile={{ page.selected_profile.as_deref().unwrap_or_default() }}">{{ nav.tr("admin-copy-profile") }}</a>
          <a href="/admin/profiles/history?profile={{ page.selected_profile.as_deref().unwrap_or_default() }}">{{ nav.tr("admin-rename-history") }}</a>
        {% endif %}
      </div>
    {% endif %}
  </section>

  <section class="pane">
    <div class="pane-title">
      <h2>{{ nav.tr("admin-columns") }}</h2>
      <span>{{ page.column_counts_label(nav.locale) }}</span>
    </div>
    <div class="pane-list">
      {% if page.selected_table.is_none() %}
        <p class="empty">{{ nav.tr("admin-select-table-inspect") }}</p>
      {% else if page.columns.is_empty() %}
        <p class="empty">{{ nav.tr("admin-no-visible-columns") }}</p>
      {% else %}
        {% for column in page.user_columns() %}
          <div class="column">
            <span>{{ column.name }}</span>
            <code>{{ column.data_type }}</code>
            <small>{{ column.flags(nav.locale)|join(" · ") }}</small>
          </div>
        {% endfor %}
        {% let system_columns = page.system_columns() %}
        {% if !system_columns.is_empty() %}
          <p class="group-label">{{ nav.tr("admin-system-columns-label") }}</p>
          {% for column in system_columns %}
            <div class="column system">
              <span>{{ column.name }}</span>
              <code>{{ column.data_type }}</code>
              <small>{{ column.flags(nav.locale)|join(" · ") }}</small>
            </div>
          {% endfor %}
        {% endif %}
      {% endif %}
    </div>
  </section>
</div>