{% extends "default.html" %}
{% block title %}
    {% trans %}Notifications{% endtrans %}
{% endblock %}
{% block breadcrumbs %}
    <li><a href="/notifications">{% trans %}Notifications{% endtrans %}</a></li>
{% endblock %}
{% block content %}
    <x-vbox>
        <x-frame style="--width: 896px;" class="flexible-space">
            <x-vbox>
                {% if notifications %}
                    <form method="post" action="/notifications/mark-all-read">
                        <button type="submit">{% trans %}Mark all as read{% endtrans %}</button>
                    </form>
                    {% for notification in notifications %}
                        <article class="card card-horizontal">
                            <section class="card-main flexible-space">
                                {% if notification.notification %}
                                    {{ notification.notification.timestamp | strftime("%A, %e %B %Y, %H:%M:%S") }}
                                    {% if notification.notification.data["type"] == "welcome" %}
                                        <h2>{% trans %}Welcome{% endtrans %}</h2>
                                    {% elif notification.notification.data["type"] == "commit" %}
                                        {% set commit = db.session.get(Commit, notification.notification.data["repo"] + "/" + notification.notification.data["commit"]) %}
                                        <h2><a href="{{ notification.notification.data['repo'] + '/commit/' + notification.notification.data['commit'] }}">{{ commit.message | split("\n\n", 1) | first }}</a></h2>
                                        <p>
                                            {% trans %}Commited by{% endtrans %} <a href="/{{ commit.owner.username }}">{{ commit.owner.username }}</a>
                                            {% trans %}in{% endtrans %} <a href="{{ commit.repo.route }}">{{ commit.repo.owner.username }}/{{ commit.repo.name }}</a>
                                        </p>
                                    {% elif notification.notification.data["type"] == "post" %}
                                        {% set post = db.session.get(Post, notification.notification.data["post"]) %}
                                        <h2><a href="{{ notification.notification.data['repo'] + '/forum/' + post.number|string }}">{{ post.subject }}</a></h2>
                                        <p>
                                            {% trans %}Posted by{% endtrans %} <a href="/{{ post.owner.username }}">{{ post.owner.username }}</a>
                                            {% trans %}in{% endtrans %} <a href="{{ post.repo.route }}">{{ post.repo.owner.username }}/{{ post.repo.name }}</a>
                                        </p>
                                    {% elif notification.notification.data["type"] == "pr" %}
                                        {% set pr = db.session.get(PullRequest, notification.notification.data["pr"]|int) %}
                                        <h2><a href="{{ notification.notification.data['base'] + '/prs/' }}">{{ pr.head_route }}:{{ pr.head_branch }} → {{ pr.base_route }}:{{ pr.base_branch }}</a></h2>
                                        <p>
                                            {% trans %}Requested by{% endtrans %} <a href="/{{ pr.owner.username }}">{{ pr.owner.username }}</a>
                                            {% trans %}in{% endtrans %} <a href="{{ pr.base_route }}">{{ pr.base.username }}/{{ pr.base.name }}</a>
                                        </p>
                                    {% elif notification.notification.data["type"] == "follow" %}
                                        {% set author = db.session.get(User, notification.notification.data["author"]) %}
                                        <h2><a href="/{{ author.username }}">{{ author.username }}</a></h2>
                                        <p>
                                            {% trans %}is now following you{% endtrans %}
                                        </p>
                                    {% endif %}
                                {% endif %}
                            </section>
                            <section>
                                {% if notification.attention_level %}
                                    <button hx-post="/notifications/{{ notification.id }}/read" hx-swap="outerHTML">
                                        {% trans %}Mark as read{% endtrans %}
                                    </button>
                                {% else %}
                                    <button hx-post="/notifications/{{ notification.id }}/unread" hx-swap="outerHTML">
                                        {% trans %}Mark as unread{% endtrans %}
                                    </button>
                                {% endif %}
                            </section>
                        </article>
                    {% endfor %}
                {% else %}
                    <p>{% trans %}When you get notifications, they'll be shown here.{% endtrans %}</p>
                {% endif %}
                {% include "pagination.html" %}
            </x-vbox>
        </x-frame>
    </x-vbox>
{% endblock %}