{% extends "web/base.html" %}

{% block title %}Workflow Map | tcx{% endblock %}
{% block page_label %}Workflow Map{% endblock %}

{% block content %}
{% include "web/fragments/topology_canvas.html" %}

<section class="tc-section-grid">
  <article class="tc-panel">
    <div class="tc-panel-head">
      <span class="tc-eyebrow">Health checks</span>
      <h2>Workflow status</h2>
    </div>
    <div class="tc-check-grid">
      {% for check in health.checks %}
      <div>
        <span class="tc-pill tc-pill--{{ check.status }}">{{ check.status }}</span>
        <strong>{{ check.label }}</strong>
        <small>{{ check.value }}</small>
      </div>
      {% endfor %}
    </div>
  </article>

  <aside class="tc-panel">
    <div class="tc-panel-head">
      <span class="tc-eyebrow">Approved action path</span>
      <h2>Action gate</h2>
    </div>
    <ul class="tc-plain-list">
      <li>Web does not spawn subagents.</li>
      <li>Web does not approve or submit orders.</li>
      <li>Non-live submissions stay behind policy, approval, duplicate-request, connection, and audit checks.</li>
    </ul>
  </aside>
</section>

<details class="tc-details tc-diagnostics">
  <summary>System internals</summary>
  <div class="tc-details-body">
<section class="tc-panel">
  <div class="tc-panel-head">
    <span class="tc-eyebrow">System model</span>
    <h2>Guardrails and Improvement sit under the workspace workflow</h2>
  </div>
  <div class="tc-harness-system-grid">
    {% for system in topology.systems %}
    <section class="tc-harness-system tc-harness-system--{{ system.key }}">
      <div>
        <strong>{{ system.label }}</strong>
        <span>{{ system.summary }}</span>
      </div>
      <div class="tc-harness-list">
        {% for item in system.items %}
        <div><strong>{{ item.label }}</strong><span>{{ item.summary }}</span></div>
        {% endfor %}
      </div>
    </section>
    {% endfor %}
  </div>
</section>

<section class="tc-panel">
  <div class="tc-panel-head">
    <span class="tc-eyebrow">Maintenance map</span>
    <h2>Implementation units</h2>
  </div>
  <div class="tc-record-list">
    {% for component in topology.components %}
    <article class="tc-record-row">
      <div class="tc-chip-list">
        <span class="tc-pill tc-pill--neutral">{{ component.status }}</span>
        {% for tag in component.tags %}
        <span class="tc-chip">{{ tag }}</span>
        {% endfor %}
      </div>
      <strong>{{ component.label }}</strong>
      <small>{{ component.summary }}</small>
      <small><code>{{ component.id }}</code>{% if component.depends_on %} depends on {{ component.depends_on|join:", " }}{% endif %}</small>
    </article>
    {% endfor %}
  </div>
</section>
  </div>
</details>
{% endblock %}