{% extends 'user/layout.html' %}
{% load i18n %}
{% load utilities %}

{% block title %}{{ user.display_name }}{% endblock %}

{% block header %}
<div class="columns is-mobile">
    <div class="column">
        <h1 class="title">{% trans "User Profile" %}</h1>
    </div>
    {% if is_self %}
    <div class="column is-narrow">
        <a href="{% url 'prefs-profile' %}">
            <span class="icon icon-pencil" title="Edit profile" aria-hidden="true"></span>
            <span class="is-hidden-mobile">{% trans "Edit profile" %}</span>
        </a>
    </div>
    {% endif %}
</div>
{% endblock %}

{% block panel %}
{% if user.bookwyrm_user %}
<div class="block">
    <h2 class="title">
        {% include 'user/shelf/books_header.html' %}
    </h2>
    <div class="columns is-mobile scroll-x">
        {% for shelf in shelves %}
        <div class="column is-narrow">
            <h3>{{ shelf.name }}
                {% if shelf.size > 3 %}<small>(<a href="{{ shelf.local_path }}">{% blocktrans with size=shelf.size %}View all {{ size }}{% endblocktrans %}</a>)</small>{% endif %}</h3>
            <div class="is-mobile field is-grouped">
            {% for book in shelf.books %}
            <div class="control">
                <a href="{{ book.local_path }}">
                {% include 'snippets/book_cover.html' with book=book cover_class='is-h-m is-h-s-mobile' size_mobile='small' size='medium' %}
                </a>
            </div>
            {% endfor %}
            </div>
        </div>
        {% endfor %}
    </div>
    <small><a href="{% url 'user-shelves' user|username %}">{% trans "View all books" %}</a></small>
</div>
{% endif %}

{% if goal %}
<div class="block">
    <h2 class="title">{% now 'Y' %} Reading Goal</h2>
    {% include 'snippets/goal_progress.html' with goal=goal %}
</div>
{% endif %}

<div>
    <div class="columns is-mobile">
        <h2 class="title column">{% trans "User Activity" %}</h2>
        <div class="column is-narrow">
            <a target="_blank" href="{{ user.local_path }}/rss">
                <span class="icon icon-rss" aria-hidden="true"></span>
                <span class="is-hidden-mobile">{% trans "RSS feed" %}</span>
            </a>
        </div>
    </div>
    {% for activity in activities %}
    <div class="block" id="feed_{{ activity.id }}">
        {% include 'snippets/status/status.html' with status=activity %}
    </div>
    {% endfor %}
    {% if not activities %}
    <div class="block">
        <p>{% trans "No activities yet!" %}</p>
    </div>
    {% endif %}

    {% include 'snippets/pagination.html' with page=activities path=user.local_path anchor="#feed" %}
</div>

{% endblock %}