{#
  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>Profiles</h2><span>{{ page.profiles.len() }}</span></div>
    <div class="pane-list">
      {% if page.profiles.is_empty() %}
        <p class="empty">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.name.as_str()) %}selected{% endif %}"
                    type="submit" name="profile" value="{{ profile.name }}">
              <span>{{ profile.name }}</span>
              <small>{{ profile.table_count }} tables</small>
            </button>
          </form>
        {% endfor %}
      {% endif %}
    </div>
  </section>

  <section class="pane">
    <div class="pane-title"><h2>Tables</h2><span>{{ page.tables.len() }}</span></div>
    <div class="pane-list">
      {% if page.selected_profile.is_none() %}
        <p class="empty">Select a profile to see its tables.</p>
      {% else if page.tables.is_empty() %}
        <p class="empty">This profile has no tables.</p>
      {% 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() %}No dependencies{% else %}Depends on {{ table.depends_on|join(", ") }}{% endif %}
                · display: {{ table.row_display_columns|join(", ") }}
              </small>
            </button>
          </form>
        {% endfor %}
      {% endif %}
    </div>
  </section>

  <section class="pane">
    <div class="pane-title">
      <h2>Columns</h2>
      <span>{{ page.user_columns().len() }} user · {{ page.system_columns().len() }} system</span>
    </div>
    <div class="pane-list">
      {% if page.selected_table.is_none() %}
        <p class="empty">Select a table to inspect its columns.</p>
      {% else if page.columns.is_empty() %}
        <p class="empty">This table has 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()|join(" · ") }}</small>
          </div>
        {% endfor %}
        {% let system_columns = page.system_columns() %}
        {% if !system_columns.is_empty() %}
          <p class="group-label">System columns · hidden from users</p>
          {% for column in system_columns %}
            <div class="column system">
              <span>{{ column.name }}</span>
              <code>{{ column.data_type }}</code>
              <small>{{ column.flags()|join(" · ") }}</small>
            </div>
          {% endfor %}
        {% endif %}
      {% endif %}
    </div>
  </section>
</div>