{% extends "base.html" %}

{% block content %}
<section class="hero">
  <div class="hero-copy">
    <p class="eyebrow">Edges</p>
    <h1>{{ edge_list.graph.display_name }}</h1>
    <p class="hero-text">
      Browse relationships in this graph, inspect connected node IDs, and create new
      edges with schema-validated JSON data.
    </p>
    <div class="button-row">
      <a class="button button-secondary" href="{{ mount_prefix }}{{ web_app.url_path_for('graph_overview_page', graph_id=edge_list.graph.id) }}">Back to overview</a>
      <a class="button button-secondary" href="{{ mount_prefix }}{{ web_app.url_path_for('graph_node_list_page', graph_id=edge_list.graph.id) }}">Nodes</a>
      {% if current_user.is_owner %}
      <a class="button" href="{{ mount_prefix }}{{ web_app.url_path_for('graph_edge_create_page', graph_id=edge_list.graph.id) }}">New edge</a>
      {% endif %}
    </div>
  </div>

  <div class="hero-panel">
    <h2>Browse summary</h2>
    <ul class="feature-list">
      <li>{{ edge_list.total }} edge{{ "" if edge_list.total == 1 else "s" }} matched.</li>
      <li>Instance: {{ edge_list.instance.display_name }}.</li>
      <li>Prefix: {{ edge_list.graph.table_prefix_label }}.</li>
      <li>Showing {{ edge_list.offset + 1 if edge_list.total else 0 }}-{{ [edge_list.offset + edge_list.limit, edge_list.total] | min }}.</li>
    </ul>
  </div>
</section>

{% set form_action = web_app.url_path_for('graph_edge_list_page', graph_id=edge_list.graph.id) %}
{% set filter_kind = 'edge' %}
{% include 'partials/list_filter_panel.html' %}

<section class="dashboard-section">
  <div class="section-heading">
    <div>
      <p class="eyebrow">Results</p>
      <h2>Edge list</h2>
    </div>
    {% if current_user.is_owner %}
    <a class="button" href="{{ mount_prefix }}{{ web_app.url_path_for('graph_edge_create_page', graph_id=edge_list.graph.id) }}">New edge</a>
    {% endif %}
  </div>

  <div class="card-grid">
    {% for edge in edge_list["items"] %}
    <article class="resource-card">
      <div class="resource-header">
        <div>
          <h3>{{ edge.type }}</h3>
          <p class="resource-subtitle">{{ edge.id }}</p>
        </div>
      </div>
      <dl class="resource-meta">
        <div>
          <dt>Source</dt>
          <dd>{{ edge.source_id }}</dd>
        </div>
        <div>
          <dt>Target</dt>
          <dd>{{ edge.target_id }}</dd>
        </div>
        <div>
          <dt>Schema</dt>
          <dd>{{ edge.schema_name or "none" }}</dd>
        </div>
        <div>
          <dt>Version</dt>
          <dd>{{ edge.version }}</dd>
        </div>
      </dl>
      {% if edge.tags %}
      <p class="resource-note">Tags: {{ edge.tags | join(", ") }}</p>
      {% endif %}
      <div class="button-row">
        <a class="button button-secondary" href="{{ mount_prefix }}{{ web_app.url_path_for('graph_edge_detail_page', graph_id=edge_list.graph.id, edge_id=edge.id) }}">Open</a>
      </div>
    </article>
    {% else %}
    <article class="resource-card resource-card-empty">
      <h3>No edges matched</h3>
      <p class="resource-note">
        Adjust the current filters or create the first edge for this graph.
      </p>
    </article>
    {% endfor %}
  </div>

  {% if previous_url or next_url %}
  <div class="button-row">
    {% if previous_url %}
    <a class="button button-secondary" href="{{ previous_url }}">Previous page</a>
    {% endif %}
    {% if next_url %}
    <a class="button button-secondary" href="{{ next_url }}">Next page</a>
    {% endif %}
  </div>
  {% endif %}
</section>
{% endblock %}

{% block scripts %}
{% include 'partials/filters_toggle_script.html' %}
{% endblock %}