{% extends "base.html" %}
{% block title_suffix %} - Issues{% endblock %}
{% block content %}
<h2>Issues</h2>
<div class="filter-toggle">
    <button class="outline" data-filter="mine" data-filter-page="issues"
            hx-get="/fragment/issues?filter=mine"
            hx-target="#issues-content"
            hx-swap="innerHTML"
            hx-on:click="localStorage.setItem('filter_issues','mine'); window.tableSorted=false; updateFilterButtons()">Mine</button>
    <button class="outline" data-filter="all" data-filter-page="issues"
            hx-get="/fragment/issues?filter=all"
            hx-target="#issues-content"
            hx-swap="innerHTML"
            hx-on:click="localStorage.setItem('filter_issues','all'); window.tableSorted=false; updateFilterButtons()">All</button>
</div>
<div id="issues-content"
     hx-get="/fragment/issues"
     hx-trigger="load, every 10s[document.visibilityState === 'visible' && !window.tableSorted]"
     hx-swap="innerHTML"
     hx-vals='js:{"filter": localStorage.getItem("filter_issues") || "all"}'>
</div>
{% endblock %}