{% extends "base.html" %}
{% block title %}{{ t('notifications') }} | {{ app_name }}{% endblock %}
{% block content %}
    <section class="panel">
        <div class="panel-header panel-header-inline">
            <div>
                <h1>{{ t('notifications') }}</h1>
                <p>{{ t('notifications_subtitle') }}</p>
            </div>
            <form method="post" action="{{ url_for('notifications.mark_all_read') }}">
                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                <button type="submit" class="button button-secondary">{{ t('mark_all_read') }}</button>
            </form>
        </div>
        <div class="list-stack">
            {% for notification in notifications.items %}
                <article class="list-card {% if not notification.is_read %}unread{% endif %}">
                    <div>
                        <strong>{{ notification.title }}</strong>
                        <p>{{ notification.message }}</p>
                        <small>{{ notification.created_at.strftime('%Y-%m-%d %H:%M') }}</small>
                    </div>
                    <div class="button-row">
                        {% if notification.link %}
                            <a href="{{ notification.link }}" class="button button-secondary">{{ t('open') }}</a>
                        {% endif %}
                        {% if not notification.is_read %}
                            <form method="post" action="{{ url_for('notifications.mark_read', notification_id=notification.id) }}">
                                <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                                <button type="submit" class="button">{{ t('mark_read') }}</button>
                            </form>
                        {% endif %}
                    </div>
                </article>
            {% else %}
                <p>{{ t('no_notifications') }}</p>
            {% endfor %}
        </div>
        {% set pagination = notifications %}
        {% include "partials/pagination.html" %}
    </section>
{% endblock %}