{% extends "ui/panels/_base.html" %}
{% load i18n %}

{% block panel_content %}
  {% if object.kind == "drift" %}
    {% if drift_rows %}
      <table class="table table-sm">
        <thead><tr><th>{% trans "Drift" %}</th><th>{% trans "Type" %}</th><th>{% trans "Key" %}</th><th>{% trans "Fields" %}</th></tr></thead>
        <tbody>
          {% for row in drift_rows %}
            <tr>
              <td>{{ row.category }}</td>
              <td><code>{{ row.type_name }}</code></td>
              <td><code>{{ row.key }}</code></td>
              <td>{% for c in row.changes %}<div><code>{{ c.field }}</code>: <code>{{ c.from }}</code> &rarr; <code>{{ c.to }}</code></div>{% endfor %}</td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
    {% else %}
      <div class="card-body text-muted">{% trans "No drift." %}</div>
    {% endif %}
  {% elif op_groups %}
    <table class="table table-sm">
      <thead><tr><th>{% trans "Op" %}</th><th>{% trans "Type" %}</th><th>{% trans "Key" %}</th><th>{% trans "Changes" %}</th></tr></thead>
      <tbody>
        {% for kind, types in op_groups %}
          {% for type_name, ops in types %}
            {% for op in ops %}
              <tr>
                <td><span class="badge text-bg-{% if kind == 'delete' %}red{% elif kind == 'update' %}orange{% else %}green{% endif %}">{{ kind }}</span></td>
                <td><code>{{ type_name }}</code></td>
                <td><code>{{ op.key }}</code></td>
                <td>{% for c in op.changes %}<div><code>{{ c.field }}</code>: <code>{{ c.from }}</code> &rarr; <code>{{ c.to }}</code></div>{% endfor %}</td>
              </tr>
            {% endfor %}
          {% endfor %}
        {% endfor %}
      </tbody>
    </table>
  {% else %}
    <div class="card-body text-muted">{% trans "No operations." %}</div>
  {% endif %}
{% endblock panel_content %}