{#- Page des offres. Contexte : voir pages/liste.py (`page_liste`).
    Une requête htmx ne rend que le bloc `liste` (contenu de `#liste`) : les imports
    de macros sont donc faits à l'intérieur des blocs. Le bloc `bloc_onglets` se rend
    seul (échange hors bande des compteurs, `oob`). -#}
{% extends "base.html" %}
{% set nav_actif = "offres" %}
{% block titre %}Offres - job2apply{% endblock %}
{% block contenu %}
{% if copie_personnelle %}
<div class="bandeau bandeau-avertissement" role="status">
  Une ancienne copie personnelle de la skill <strong>veille-emploi</strong> masque celle
  de l'espace, tenue à jour par job2apply. Pour la retirer :
  <code>job2apply install-skill --retirer-personnelle</code>
</div>
{% endif %}
<h1>Offres</h1>
<form id="filtres" class="filtres" method="get" action="/" hx-get="/" hx-target="#liste" hx-push-url="true" hx-trigger="submit, input changed delay:300ms from:#q, change from:#source, change from:#tri">
  <input type="hidden" id="onglet-courant" name="onglet" value="{{ onglet }}">
  <input type="search" id="q" name="q" value="{{ q }}" placeholder="Rechercher (poste, entreprise, lieu…)" aria-label="Rechercher">
  <select id="source" name="source" aria-label="Source">
    <option value=""{% if not source %} selected{% endif %}>Source : toutes</option>
    {% for nom, libelle in sources %}
    <option value="{{ nom }}"{% if nom == source %} selected{% endif %}>{{ libelle }}</option>
    {% endfor %}
  </select>
  <select id="tri" name="tri" aria-label="Tri">
    {% for valeur, libelle in tris %}
    <option value="{{ valeur }}"{% if valeur == tri %} selected{% endif %}>{{ libelle }}</option>
    {% endfor %}
  </select>
  <span class="indicateur" role="status">Chargement…</span>
</form>
<div id="liste" aria-live="polite">
{% block liste %}
{% from "_composants.html" import vie_privee %}
{% if fragment %}
<input type="hidden" id="onglet-courant" name="onglet" value="{{ onglet }}" hx-swap-oob="true">
{% endif %}
{% block bloc_onglets %}
<nav id="onglets-liste" class="onglets-liste" aria-label="Onglets des offres"{% if oob %} hx-swap-oob="true"{% endif %}>
  {% for o in onglets %}
  <a href="{{ o.href }}" hx-get="/" hx-vals='{"onglet": "{{ o.cle }}"}' hx-include="#filtres" hx-target="#liste" hx-push-url="true"{% if o.actif %} aria-current="true"{% endif %}>{{ o.libelle }} <span class="nombre">{{ o.nombre }}</span></a>
  {% endfor %}
</nav>
{% endblock %}
{{ vie_privee("offres") }}
{% if cartes %}
{% for c in cartes %}
{% include "_carte.html" %}
{% endfor %}
{% elif catalogue_vide %}
<p class="vide">Aucune offre pour l'instant : lancez la veille (job2apply fetch).</p>
{% elif filtres_actifs %}
<p class="vide">Aucune offre ne correspond à ces filtres.</p>
{% else %}
<p class="vide">{{ message_vide }}</p>
{% endif %}
{% endblock %}
</div>
{% endblock %}