Snippets for book previews, username links, avatars

fedireads/templates/book.html

@@ -4,7 +4,7 @@
 <div id="content">
     <div>
         <div class="book-preview">
-            {% include 'book_snippet.html' with book=book size=large rating=rating description=True %}
+            {% include 'snippets/book.html' with book=book size=large rating=rating description=True %}
         </div>
     </div>
     <div class="reviews">
@@ -21,7 +21,7 @@
         {% for review in reviews %}
         <div class="review">
             <h4>{{ review.name }}
-                <small>{{ review.rating | stars }} stars, by {{ review.user.username }}</small>
+                <small>{{ review.rating | stars }} stars, by {% include 'snippets/username.html' with user=review.user %}</small>
             </h4>
             <blockquote>{{ review.review_content }}</blockquote>
         </div>

fedireads/templates/feed.html

@@ -9,7 +9,7 @@
         <p>Start a book!</p>
         {% for book in to_read.books.all %}
         <div class="book-preview">
-            {% include 'book_snippet.html' with book=book size="small" %}
+            {% include 'snippets/book.html' with book=book size="small" %}
             <form name="shelve" action="/shelve/{{ user.localname }}_currently-reading/{{ book.id }}" method="post">
                 {% csrf_token %}
                 <input type="hidden" name="book" value="book.id"></input>
@@ -21,7 +21,7 @@
 
         {% for book in reading.books.all %}
         <div class="book-preview">
-            {% include 'book_snippet.html' with book=book size="small" %}
+            {% include 'snippets/book.html' with book=book size="small" %}
             <form name="shelve" action="/shelve/{{ user.localname }}_read/{{ book.id }}" method="post">
                 {% csrf_token %}
                 <input type="hidden" name="book" value="book.id"></input>
@@ -35,7 +35,7 @@
         <h2>Recently Added Books</h2>
         {% for book in recent_books %}
         <div class="book-preview">
-            {% include 'book_snippet.html' with book=book size="small" %}
+            {% include 'snippets/book.html' with book=book size="small" %}
             {% if not book in user_books.all %}
             <form name="shelve" action="/shelve/{{ user.localname }}_to-read/{{ book.id }}" method="post">
                 {% csrf_token %}
@@ -53,10 +53,8 @@
     {% for activity in activities %}
     <div class="update">
         <h2>
-            <img class="user-pic" src="{% if activity.user.avatar %}/images/{{ activity.user.avatar }}{% else %}/static/images/default_avi.jpg{% endif %}">
-        {# TODO: a helper function for displaying a username #}
-        <a href="/user/{% if activity.user.localname %}{{ activity.user.localname }}{% else %}{{ activity.user.username }}{% endif %}" class="user">
-                {% if activity.user.localname %}{{ activity.user.localname }}{% else %}{{ activity.user.username }}{% endif %}</a>
+            {% include 'snippets/avatar.html' with user=activity.user %}
+            {% include 'snippets/username.html' with user=activity.user %}
         {% if activity.fedireads_type == 'Shelve' %}
             {# display a reading/shelving activity #}
             {% if activity.shelf.shelf_type == 'to-read' %}
@@ -69,9 +67,8 @@
                 shelved in "{{ activity.shelf.name }}"
             {% endif %}
         </h2>
-            {# TODO: wouldn't it rule if this was a reusable piece of markup? #}
             <div class="book-preview">
-                {% include 'book_snippet.html' with book=activity.book size=large description=True %}
+                {% include 'snippets/book.html' with book=activity.book size=large description=True %}
             </div>
             <div class="interaction"><button>⭐️ Like</button></div>
         {% elif activity.fedireads_type == 'Review' %}
@@ -79,7 +76,7 @@
             reviewed {{ activity.book.data.title }}
         </h2>
             <div class="book-preview review">
-                {% include 'book_snippet.html' with book=activity.book size=large %}
+                {% include 'snippets/book.html' with book=activity.book size=large %}
 
                 <h3>{{ activity.name }}</h3>
                 <p>{{ activity.rating | stars }}</p>

fedireads/templates/layout.html

@@ -28,7 +28,7 @@
                     {% if user.is_authenticated %}
                     <form name="logout" action="/logout/" method="post">
                         {% csrf_token %}
-                        Welcome, <a href="/user/{{ request.user.localname }}">{{ request.user.localname }}</a>
+                        Welcome, {% include 'snippets/username.html' %}
                         <input type="submit" value="Log out"></input>
                     </form>
                     {% else %}

fedireads/templates/snippets/avatar.html

@@ -0,0 +1,2 @@
+<img class="user-pic" src="{% if user.avatar %}/images/{{ user.avatar }}{% else %}/static/images/default_avi.jpg{% endif %}">
+

fedireads/templates/snippets/username.html

@@ -0,0 +1,2 @@
+<a href="/user/{% if user.localname %}{{ user.localname }}{% else %}{{ user.username }}{% endif %}" class="user">{% if user.localname %}{{ user.localname }}{% else %}{{ user.username }}{% endif %}</a>
+

fedireads/templates/user.html

@@ -5,7 +5,7 @@
 <div id="sidebar">
     <div class="user-profile">
         <h2>
-            <img class="user-pic" src="{% if user.avatar %}/images/{{ user.avatar }}{% else %}/static/images/default_avi.jpg{% endif %}">
+            {% include 'snippets/avatar.html' with user=user %}
             {% if user.name %}{{ user.name }}{% endif %}
             <small>{{ user.username }}</small>
         </h2>