{% extends "base.html" %}

{% block title %}{{ project_name }} — Fenn Dashboard{% endblock %}

{% block breadcrumb %}
<a href="/">Overview</a>
<span class="breadcrumb-sep">›</span>
<span class="breadcrumb-current">{{ project_name }}</span>
{% endblock %}

{% block content %}

<div class="page-header">
  <span class="page-tag">// project</span>
  <h1 class="page-title">{{ project_name }}</h1>
  <p class="page-subtitle">{{ total_sessions }} session{% if total_sessions != 1 %}s{% endif %} recorded</p>
</div>

<!-- Stats -->
<div class="stats-grid" style="margin-bottom:28px;">
  <div class="stat-card info">
    <div class="stat-label">Sessions</div>
    <div class="stat-value">{{ total_sessions }}</div>
  </div>
  <div class="stat-card success">
    <div class="stat-label">Running</div>
    <div class="stat-value">{{ running_sessions }}</div>
  </div>
  <div class="stat-card warning">
    <div class="stat-label">Crashed</div>
    <div class="stat-value">{{ crashed_sessions }}</div>
  </div>
  <div class="stat-card warning">
    <div class="stat-label">Warnings</div>
    <div class="stat-value">{{ total_warnings }}</div>
  </div>
  <div class="stat-card error">
    <div class="stat-label">Exceptions</div>
    <div class="stat-value">{{ total_exceptions }}</div>
  </div>
</div>

{% if sessions %}
<div class="section-header">
  <span class="section-title">Sessions</span>
</div>

<div class="card">
  <div class="table-wrap">
    <table>
      <thead>
        <tr>
          <th>Session ID</th>
          <th>Started</th>
          <th>Duration</th>
          <th>Status</th>
          <th>Entries</th>
          <th>Warnings</th>
          <th>Exceptions</th>
          <th>Size</th>
        </tr>
      </thead>
      <tbody>
        {% for s in sessions %}
        <tr data-searchable="{{ s.session_id }} {{ s.started }}">
          <td>
            <a href="/session/{{ s.project | urlencode }}/{{ s.session_id | urlencode }}"
               class="td-mono"
               title="{{ s.session_id }}">{{ s.session_id }}</a>
          </td>
          <td class="td-mono">{{ s.started }}</td>
          <td class="td-mono">{{ s.duration_s | duration }}</td>
          <td>
            {% if s.status == 'running' %}
            <span class="badge badge-running">
              <span class="pulse-dot"></span>running
            </span>
            {% elif s.status == 'crashed' %}
            <span class="badge badge-crashed">crashed</span>
            {% elif s.status == 'failed' %}
            <span class="badge badge-failed">failed</span>
            {% else %}
            <span class="badge badge-completed">completed</span>
            {% endif %}
          </td>
          <td class="td-mono">{{ s.entry_count }}</td>
          <td class="td-mono" style="{% if s.warning_count > 0 %}color:var(--warning){% endif %}">
            {{ s.warning_count if s.warning_count else '—' }}
          </td>
          <td class="td-mono" style="{% if s.exception_count > 0 %}color:var(--error){% endif %}">
            {{ s.exception_count if s.exception_count else '—' }}
          </td>
          <td class="td-mono">{{ s.file_size | filesize }}</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
</div>

{% else %}
<div class="empty">
  <div class="empty-icon">🗂</div>
  <div class="empty-title">No sessions yet</div>
  <div class="empty-desc">Run an experiment with <code>logger.fnxml: true</code> to populate this project.</div>
</div>
{% endif %}

{% endblock %}