{% extends "base.html" %}
{% block title %}{{ t('title_scans', request.state.lang) }}{% endblock %}
{% block breadcrumbs %}
<div class="breadcrumbs">
    <a href="/">{{ t('breadcrumb_home', request.state.lang) }}</a>
    <span class="separator">/</span>
    <span>{{ t('breadcrumb_scans', request.state.lang) }}</span>
</div>
{% endblock %}
{% block content %}
<h1>{{ t('heading_scans', request.state.lang) }}</h1>

<div class="filter-bar">
    <input type="hidden" name="flagged" value="{{ flagged_filter }}">
    <label for="search-scans" style="display:none;">{{ t('filter_search', request.state.lang) }}</label>
    <input type="search" id="search-scans" name="search" placeholder="{{ t('filter_search', request.state.lang) }}…" value="{{ search }}" hx-get="/scans" hx-trigger="input changed, keyup[entered] delay:300ms" hx-target="#scans-table-container" hx-swap="innerHTML" hx-include="#status-filter,[name=flagged]" autocomplete="off">
    <label for="status-filter" style="display:none;">Status</label>
    <select name="status" id="status-filter" hx-get="/scans" hx-trigger="change" hx-target="#scans-table-container" hx-swap="innerHTML" hx-include="[name=search],[name=flagged]">
        <option value="">{{ t('filter_all_statuses', request.state.lang) }}</option>
        <option value="pending" {% if status_filter == 'pending' %}selected{% endif %}>{{ t('filter_pending', request.state.lang) }}</option>
        <option value="scanning" {% if status_filter == 'scanning' %}selected{% endif %}>{{ t('filter_scanning', request.state.lang) }}</option>
        <option value="completed" {% if status_filter == 'completed' %}selected{% endif %}>{{ t('filter_completed', request.state.lang) }}</option>
        <option value="failed" {% if status_filter == 'failed' %}selected{% endif %}>{{ t('filter_failed', request.state.lang) }}</option>
    </select>
    <a href="?flagged={% if flagged_filter == '1' %}0{% else %}1{% endif %}" role="button" class="outline">
        {% if flagged_filter == '1' %}{{ t('btn_show_all', request.state.lang) }}{% else %}{{ t('btn_flagged_only', request.state.lang) }}{% endif %}
    </a>
    <a href="/api/v1/scans/export?flagged={{ flagged_filter }}&search={{ search }}&status={{ status_filter }}" role="button" class="outline">{{ t('btn_export_csv', request.state.lang) }}</a>
</div>

<div id="scans-table-container">
{% include "_scans_table.html" %}
</div>
{% endblock %}