move code before and after recipe "for" loop to separate files #88

Keeping in line with the principle of DRY, the same code can be used on 2 pages (and on future Filter or Favourites pages as well)
blahosyl · Jun 17, 2024 · d756a84 · d756a84
1 parent a98882e
commit d756a84
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 53 deletions.
diff --git a/collection/templates/collection/index.html b/collection/templates/collection/index.html
@@ -3,32 +3,13 @@
 
 {% block content %}
 
-<div class="container-fluid">
-    <div class="row">
+{% include "./snippets/before_recipe_list.html" %}
 
-        <!-- Blog Entries Column -->
-        <div class="col-12 mt-3 left">
-            <div class="row">
-                {% for recipe in recipe_list %}
-                    {% include "./snippets/recipe_list.html" %}
-                {% endfor %}
+    {% for recipe in recipe_list %}
+        {% include "./snippets/recipe_list.html" %}
+    {% endfor %}
+
+{% include "./snippets/after_recipe_list.html" %}
 
-            </div>
-        </div>
-    </div>
-    {% if is_paginated %}
-    <nav aria-label="Page navigation">
-        <ul class="pagination justify-content-center">
-            {% if page_obj.has_previous %}
-            <li><a href="?page={{ page_obj.previous_page_number }}" class="page-link"> &laquo; PREV</a></li>
-            {% endif %}
-            {% if page_obj.has_next %}
-            <li><a href="?page={{ page_obj.next_page_number }}" class="page-link"> NEXT &raquo;</a></li>
-            {% endif %}
-        </ul>
-    </nav>
-    {% endif %}
-</div>
 
-<!-- index.html content ends here -->
 {% endblock %}
diff --git a/collection/templates/collection/search_results.html b/collection/templates/collection/search_results.html
@@ -7,36 +7,18 @@ <h1>Search Results for "{{ query }}"</h1>
 
 {% if object_list%}
 
-<div class="container-fluid">
-    <div class="row">
-
-        <!-- Blog Entries Column -->
-        <div class="col-12 mt-3 left">
-            <div class="row">
-                {% for recipe in object_list %}
-                <!-- based on https://learndjango.com/tutorials/django-search-tutorial -->
-                {% include "./snippets/recipe_list.html" %}
-                {% endfor %}
-
-            </div>
-        </div>
-    </div>
-    {% if is_paginated %}
-    <nav aria-label="Page navigation">
-        <ul class="pagination justify-content-center">
-            {% if page_obj.has_previous %}
-            <li><a href="?page={{ page_obj.previous_page_number }}" class="page-link"> &laquo; PREV</a></li>
-            {% endif %}
-            {% if page_obj.has_next %}
-            <li><a href="?page={{ page_obj.next_page_number }}" class="page-link"> NEXT &raquo;</a></li>
-            {% endif %}
-        </ul>
-    </nav>
-    {% endif %}
-</div>
+    {% include "./snippets/before_recipe_list.html" %}
+
+        {% for recipe in object_list %}
+        <!-- for loop based on https://learndjango.com/tutorials/django-search-tutorial -->
+            {% include "./snippets/recipe_list.html" %}
+        {% endfor %}
+
+    {% include "./snippets/after_recipe_list.html" %}
+
 
 {% else %}
-<p>There were no matches for your search.</p>
+    <p>There were no matches for your search.</p>
 {% endif %}
 
 

diff --git a/collection/templates/collection/snippets/after_recipe_list.html b/collection/templates/collection/snippets/after_recipe_list.html
@@ -0,0 +1,17 @@
+<!-- code that comes after the for loop creating the list of recipes on index.html and search_results.html -->
+            </div>
+        </div>
+    </div>
+    {% if is_paginated %}
+    <nav aria-label="Page navigation">
+        <ul class="pagination justify-content-center">
+            {% if page_obj.has_previous %}
+            <li><a href="?page={{ page_obj.previous_page_number }}" class="page-link"> &laquo; PREV</a></li>
+            {% endif %}
+            {% if page_obj.has_next %}
+            <li><a href="?page={{ page_obj.next_page_number }}" class="page-link"> NEXT &raquo;</a></li>
+            {% endif %}
+        </ul>
+    </nav>
+    {% endif %}
+</div>
diff --git a/collection/templates/collection/snippets/before_recipe_list.html b/collection/templates/collection/snippets/before_recipe_list.html
@@ -0,0 +1,8 @@
+<!-- code that comes before the for loop creating the list of recipes on index.html and search_results.html -->
+
+<div class="container-fluid">
+    <div class="row">
+
+        <!-- Blog Entries Column -->
+        <div class="col-12 mt-3 left">
+            <div class="row">