{# Vendored from packages/web/src/governor_web/templates/opportunities/_table.html.
   Audit changes:
   - Column-header click → plain <a> with ?sort=...&direction=... so
     the table sorts via standard GET round-trip (no SSE).
   - Local-runtime branches kept (audit IS local) - so the
     Occurrences column doesn't render and the workload chip falls
     back to "Unclassified" when the kind is unknown.
   - Row click target: /opportunities/{id} (audit has no /projects/...
     namespace; everything is single-tenant).
   - State column: derived from severity bucket (audit has no
     solution_risk_level / recommendation_state). Same chip grammar
     (ui-signal-chip + ui-legend-dot). #}
<div id="explorer-content">
  {% from "components/_sort_header.html" import sort_header %}
  {% if opportunities and opportunities | length > 0 %}
    {% set _qs = pagination.query_string_without_sort_or_page %}
    <div class="ui-table-wrap">
      <table class="ui-table">
        <thead>
          {# Audit always renders local_runtime_mode. The 'Savings' and
             'Occurrences' columns are cloud-only and never show here. #}
          <tr class="ui-table-head-row">
            {{ sort_header("dataset", "Dataset", signals.sort, signals.direction, base_qs=_qs) }}
            {{ sort_header("table", "Object", signals.sort, signals.direction, base_qs=_qs) }}
            {{ sort_header("author", "Author", signals.sort, signals.direction, base_qs=_qs) }}
            {{ sort_header("type", "Issue", signals.sort, signals.direction, base_qs=_qs) }}
            {{ sort_header("workload", "Workload", signals.sort, signals.direction, base_qs=_qs) }}
            {{ sort_header("cost", "Query Cost", signals.sort, signals.direction, align="right", base_qs=_qs,
                           tooltip="Cost from the most recent BigQuery job execution, dry-run estimate, or detection heuristic.") }}
            {{ sort_header("age", "Last Detected", signals.sort, signals.direction, align="right", base_qs=_qs) }}
            {{ sort_header("layout", "Partition / Cluster", signals.sort, signals.direction, align="center", base_qs=_qs) }}
            {{ sort_header("suggestions", "Suggestions", signals.sort, signals.direction, align="center", base_qs=_qs) }}
          </tr>
        </thead>
        <tbody>
          {% for opp in opportunities %}
            {# Each row represents ONE destination_table, aggregated
               across every Opportunity that fired on it. Click goes
               to the representative opportunity's detail page
               (/opportunities/{id}) - same recommendation layout
               users are familiar with. The detail page itself links
               onward to the cohort view (/jobs/{table}) for the full
               per-rule history if they want to dive deeper. #}
            <tr class="ui-table-row cursor-pointer"
                tabindex="0"
                role="link"
                aria-label="Open recommendation for {{ opp.affected_table.split('.')[-1] if '.' in opp.affected_table else opp.affected_table }}"
                onclick="window.location='/opportunities/{{ opp.id }}'"
                onkeydown="if (event.key === 'Enter' || event.key === ' ') { event.preventDefault(); window.location='/opportunities/{{ opp.id }}'; }">
              <td class="ui-table-td max-w-[180px]">
                <span class="block truncate text-sm text-slate-800 dark:text-slate-200">{{ opp.affected_dataset }}</span>
              </td>
              <td class="ui-table-td max-w-[260px]" title="{{ opp.affected_table }}">
                <span class="block truncate text-sm text-slate-800 dark:text-slate-200">
                  {{ opp.affected_object }}
                </span>
              </td>
              <td class="ui-table-td max-w-[200px]" title="{{ opp.author_email or 'unknown' }}">
                {% if opp.author_email %}
                  <span class="block truncate text-sm text-slate-700 dark:text-slate-300 font-mono">{{ opp.author_email }}</span>
                {% else %}
                  <span class="ui-table-caption mt-0">-</span>
                {% endif %}
              </td>
              <td class="ui-table-td min-w-[220px] max-w-[320px]">
                {# Issue cell mirrors the Failures table's Reason chip
                   styling (ui-signal-chip + dot) but in amber instead
                   of rose, so detection findings read with the same
                   visual grammar as BigQuery error reasons while the
                   colour still signals "performance issue, not failure".
                   Shows first issue + ``+N`` overflow indicator when
                   the table fires more than one rule; the full list
                   lives in the wrapper's ``title`` tooltip. #}
                {% set _issue_count = opp.table_issue_count or 0 %}
                {% set _issue_types = opp.table_issue_types or [] %}
                {% from "components/_signal_chip.html" import signal_chip %}
                {% if _issue_count == 0 %}
                  <span class="ui-table-caption mt-0" title="No issue detected on this table's queries - only SQL-rewrite suggestions apply. See the Suggestions column.">-</span>
                {% else %}
                  <div class="flex items-center gap-1.5"
                       title="{{ _issue_types | map('replace', '_', ' ') | join(', ') }}">
                    {{ signal_chip(
                         _issue_types[0] | replace('_', ' '),
                         color="amber",
                         overflow=("+" ~ (_issue_count - 1)) if _issue_count > 1 else None
                    ) }}
                  </div>
                {% endif %}
              </td>
              <td class="ui-table-td">
                {% if opp.query_workload_kind == 'build' %}
                  {{ signal_chip("Build", color="brand", title="Latest job classified as build") }}
                {% elif opp.query_workload_kind == 'consumption' %}
                  {{ signal_chip("Consumption", color="teal", title="Latest job classified as consumption") }}
                {% else %}
                  {{ signal_chip("Unclassified", color="slate", title="No exact local run job match was found for this opportunity, so Governor does not infer a workload type") }}
                {% endif %}
              </td>
              <td class="ui-table-td ui-table-td-right whitespace-nowrap">
                {% if opp.query_cost_value is not none %}
                  <span class="text-sm text-slate-800 dark:text-slate-200">{{ opp.query_cost_value | format_usd }}</span>
                {% else %}
                  <span class="ui-table-caption mt-0">-</span>
                {% endif %}
              </td>
              <td class="ui-table-td ui-table-td-right whitespace-nowrap">
                {{ opp.last_detected_at.strftime("%d/%m/%Y") if opp.last_detected_at else (opp.created_at.strftime("%d/%m/%Y") if opp.created_at else "-") }}
              </td>
              <td class="ui-table-td ui-table-td-center whitespace-nowrap">
                {# Spec 148 - Partition / Cluster column. Yes chip
                   when a recommendation card would render on the
                   detail page; empty cell otherwise. Same empty-
                   state convention as the Suggestions column -
                   keeps the table chrome clean when most rows
                   have no recommendation. #}
                {% if opp.has_layout_recommendation %}
                  {{ signal_chip("Yes", color="brand", title="Partition / cluster recommendation available - click into the row.") }}
                {% endif %}
              </td>
              <td class="ui-table-td ui-table-td-center whitespace-nowrap">
                {# Suggestions count - aggregated per table. When
                   zero, render an empty cell rather than a "None"
                   chip - keeps the table chrome clean and visually
                   matches the empty-state convention used in the
                   Issue column. #}
                {% set _sugg = opp.table_suggestion_count or 0 %}
                {% if _sugg > 0 %}
                  {{ signal_chip(_sugg ~ " suggested", color="emerald", title=_sugg ~ " suggestion rule(s) fired across this table - open the row to see each diff") }}
                {% endif %}
              </td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>

    {% include "components/_pagination.html" %}
  {% else %}
    <p class="ui-type-body-sm text-slate-500 dark:text-slate-400 py-8 text-center">
      No opportunities match your filters
    </p>
  {% endif %}
</div>