{% extends "base.html" %}
{% block title %}Articles{% endblock %}
{% block content %}
<h1>Articles</h1>

<form method="get" action="/articles" class="grid">
    <label>
        Week
        <input type="week" name="week" value="{{ week_filter }}">
    </label>
    <label>
        Category
        <select name="category">
            <option value="">All</option>
            {% for cat in categories %}
            <option value="{{ cat }}" {% if cat == category_filter %}selected{% endif %}>{{ cat }}</option>
            {% endfor %}
        </select>
    </label>
    <label>
        &nbsp;
        <button type="submit">Filter</button>
    </label>
</form>

<p>{{ articles|length }} articles found.</p>

<table>
    <thead>
        <tr>
            <th>Date</th>
            <th>Title</th>
            <th>Author</th>
            <th>Categories</th>
        </tr>
    </thead>
    <tbody>
        {% for article in articles %}
        <tr>
            <td>{{ article.pub_date.strftime('%b %d, %Y') }}</td>
            <td><a href="{{ article.link }}" target="_blank">{{ article.title }}</a></td>
            <td>{{ article.author }}</td>
            <td>{{ article.categories | replace('[', '') | replace(']', '') | replace('"', '') }}</td>
        </tr>
        {% endfor %}
    </tbody>
</table>
{% endblock %}