{% extends "base.html" %}
{% block content %}
<section class="page-head">
  <div>
    <p class="eyebrow">Garmin Connect</p>
    <h1>Search</h1>
  </div>
</section>

{% if error %}<p class="alert">{{ error }}</p>{% endif %}

<section class="panel form-panel">
  <header><h2>Filters</h2></header>
  <form method="get" action="/search" class="grid-form">
    <label>Start
      <input name="start" type="date" value="{{ filters.start }}" required>
    </label>
    <label>End
      <input name="end" type="date" value="{{ filters.end }}" required>
    </label>
    <label>Sport
      <input name="sport" value="{{ filters.sport }}" placeholder="cycling">
    </label>
    <label>Text
      <input name="q" value="{{ filters.q }}" placeholder="Sprint, GCClone, plan">
    </label>
    <label>Source
      <select name="source">
        {% for value, label in [
          ("all", "All"),
          ("calendar", "Calendar"),
          ("workouts", "Normal workouts"),
          ("plans", "Plans"),
          ("coach", "Coach"),
          ("cloned", "Cloned")
        ] %}
        <option value="{{ value }}" {% if filters.source == value %}selected{% endif %}>{{ label }}</option>
        {% endfor %}
      </select>
    </label>
    <button type="submit">Search</button>
  </form>
</section>

<section class="panel">
  <header><h2>Results</h2></header>
  <table>
    <thead>
      <tr>
        <th>Source</th>
        <th>Date</th>
        <th>Sport</th>
        <th>Name</th>
        <th>Status</th>
        <th>Summary</th>
      </tr>
    </thead>
    <tbody>
      {% for item in items %}
      <tr>
        <td><span class="badge">{{ item.source }}</span></td>
        <td>{{ item.date or "-" }}</td>
        <td>{{ item.sport or "-" }}</td>
        <td>{{ item.name }}</td>
        <td>{{ item.status or "-" }}</td>
        <td><pre class="inline-pre">{{ item.summary or "" }}</pre></td>
      </tr>
      {% else %}
      <tr><td colspan="6" class="empty">No matching Garmin items found.</td></tr>
      {% endfor %}
    </tbody>
  </table>
</section>
{% endblock %}