Refactor worklog handling and table rendering in templates for improved clarity and performance

routes.py

@@ -131,7 +131,6 @@ def render_paginated_table(
 
 @main.route("/")
 def index():
-    stale_worklog_page = request.args.get('stale_worklog_page', 1, int)
     cutoff = datetime.utcnow() - timedelta(days=14)
 
     worklog_query = eager_load_worklog_relationships(
@@ -140,8 +139,9 @@ def index():
         (WorkLog.start_time < cutoff) & (WorkLog.complete == False)
     )
     
-    stale_pagination = make_paginated_data(worklog_query, stale_worklog_page, 3)
+    stale_worklogs = worklog_query.all()
-    stale_count = len(worklog_query.all())
+
+    stale_count = len(stale_worklogs)
     stale_worklog_headers = {
         k: v for k, v in worklog_headers.items()
         if k not in ['End Time', 'Quick Analysis?', 'Complete?', 'Follow Up?']
@@ -182,13 +182,12 @@ def index():
     return render_template(
         "index.html", 
         title="Inventory Manager", 
-        stale_pagination=stale_pagination, 
         stale_count=stale_count, 
         stale_worklog_headers=stale_worklog_headers,
         stale_worklog_rows=[{
             "id": log.id,
             "cells": [fn(log) for fn in stale_worklog_headers.values()]
-        } for log in stale_pagination['items']],
+        } for log in stale_worklogs],
         labels=labels,
         datasets=datasets
     )
@@ -236,17 +235,15 @@ def list_inventory():
         else:
             return "Invalid filter_by parameter", 400
 
+    inventory = query.all()
 
-    return render_paginated_table(
+    return render_template(
-        query=query,
+        'table.html', 
-        page=page,
         title=f"Inventory Listing ({filter_name})" if filter_by else "Inventory Listing",
-        headers=inventory_headers,
-        row_fn=lambda i: [fn(i) for fn in inventory_headers.values()],
-        endpoint="main.list_inventory",
-        entry_route="inventory_item",
         breadcrumb=[{'label': 'Inventory', 'url': url_for('main.inventory_index')}],
-        extra_args={'filter_by': filter_by, 'id': id}
+        header=inventory_headers,
+        rows=[{"id": item.id, "cells": [row_fn(item) for row_fn in inventory_headers.values()]} for item in inventory],
+        entry_route = 'inventory_item'
     )
 
 @main.route("/inventory/index")

templates/fragments/_table_fragment.html

@@ -1,8 +1,7 @@
-{% macro render_table(headers, rows, entry_route=None, title=None) %}
+{% macro render_table(headers, rows, id, entry_route=None, title=None, per_page=15) %}
 {% if rows %}
 <div class="table-responsive">
-    <table
+    <table id="datatable-{{ id|default('table')|replace(' ', '-')|lower }}"
-        id="datatable-{{ title|default('table')|replace(' ', '-')|lower }}"
         class="table table-bordered table-sm table-hover table-striped table-light m-0{% if title %} caption-top{% endif %}">
         {% if title %}
         <caption>{{ title }}</caption>
@@ -34,13 +33,29 @@
         </tbody>
     </table>
 </div>
+
+<script>
+    document.addEventListener("DOMContentLoaded", function () {
+        {# console.log($('table[id="datatable-{{ id|default('table')|replace(' ', '-')|lower }}"]'))
+        $('table[id="datatable-{{ id|default('table')|replace(' ', '-')|lower }}"]').DataTable({
+            pageLength: {{ per_page }},
+            lengthChange: false,
+            ordering: true,
+            stateSave: true
+        }) #}
+        new DataTable('#datatable-{{ id|default('table')|replace(' ', '-')|lower }}', {
+            pageLength: {{ per_page }},
+            colReorder: true
+        })
+    })
+</script>
 {% else %}
 <div class="container text-center">No data.</div>
 {% endif %}
 {% endmacro %}
 
 {% macro render_pagination(endpoint, page, has_prev, has_next, total_pages, page_variable='page', extra_args={}) %}
-{% set prev_args = extra_args.copy() %}
+{# % set prev_args = extra_args.copy() %}
 {% set next_args = extra_args.copy() %}
 {% set first_args = extra_args.copy() %}
 {% set last_args = extra_args.copy() %}
@@ -78,5 +93,5 @@
             class="btn btn-primary{% if not has_next %} disabled{% endif %}">Last &raquo;</a>
     </div>
 </div>
-{% endif %}
+{% endif % #}
 {% endmacro %}

templates/index.html

@@ -8,7 +8,7 @@
     <h1 class="display-4">Welcome to Inventory Manager</h1>
     <p class="lead">Find out about all of your assets.</p>
     <div class="row">
-        {% if stale_pagination['items'] %}
+        {% if stale_worklog_rows %}
         <div class="col">
             <div class="card">
                 <div class="card-body">
@@ -16,17 +16,11 @@
                     <h6 class="card-subtitle mb-2 text-body-secondary">You have {{ stale_count }} worklogs
                         that need attention!</h6>
                     {{ tables.render_table(
-                    stale_worklog_headers,
+                        headers = stale_worklog_headers,
-                    stale_worklog_rows,
+                        rows = stale_worklog_rows,
-                    'worklog_entry'
+                        id = 'Stale Worklog',
-                    )}}
+                        entry_route = 'worklog_entry',
-                    {{ tables.render_pagination(
+                        per_page = 3
-                    'index',
-                    stale_pagination['page'],
-                    stale_pagination['has_prev'],
-                    stale_pagination['has_next'],
-                    stale_pagination['total_pages'],
-                    page_variable='stale_worklog_page'
                     )}}
                 </div>
             </div>

templates/inventory.html

@@ -124,18 +124,7 @@ submit_button=True) }}
             </div>
             {% if worklog %}
             <div class="col-6">
-                {{ tables.render_table(worklog_headers, worklog_rows, 'worklog_entry', 'Work Log') }}
+                {{ tables.render_table(headers=worklog_headers, rows=worklog_rows, id='worklog', entry_route='worklog_entry', title='Work Log') }}
-                {% if worklog_pagination['total_pages'] > 1 %}
-                {{ tables.render_pagination(
-                page=worklog_pagination['page'],
-                has_prev=worklog_pagination['has_prev'],
-                has_next=worklog_pagination['has_next'],
-                total_pages=worklog_pagination['total_pages'],
-                endpoint='main.inventory_item',
-                page_variable='worklog_page',
-                extra_args={'id': item.id, 'worklog_page': worklog_page, 'filter_by': filter_by, 'id': id}
-                ) }}
-                {% endif %}
             </div>
             {% endif %}
         </div>

templates/layout.html

@@ -18,9 +18,7 @@
         rel="stylesheet" integrity="sha384-gdnBcErvPbrURVoR9w3NhVMliw+ZmcTCmq+64xj2Ksx21nRJFX3qW0zFvBotL5rm"
         crossorigin="anonymous">
     <style>
-        {
+        {% block style %}
-            % block style %
-        }
 
         .sticky-top {
             position: sticky;
@@ -47,9 +45,7 @@
             background-color: white;
         }
 
-            {
+            {% endblock %}
-            % endblock %
-        }
     </style>
 </head>
 
@@ -96,15 +92,6 @@
         searchInput.addEventListener('input', () => {
             searchButton.disabled = searchInput.value.trim() === '';
         });
-
-        document.addEventListener("DOMContentLoaded", function () {
-            $('table[id^="datatable-"]').DataTable({
-                pageLength: 25,
-                lengthChange: false,
-                ordering: true,
-                stateSave: true
-            })
-        })
         {% block script %} {% endblock %}
     </script>
 </body>

templates/table.html

@@ -10,6 +10,6 @@
     breadcrumbs=breadcrumb
 ) }}
 
-{{ tables.render_table(header, rows, entry_route) }}
+{{ tables.render_table(headers=header, rows=rows, id=title, entry_route=entry_route) }}
 {# { tables.render_pagination(endpoint, page, has_prev, has_next, total_pages, extra_args=extra_args) } #}
 {% endblock %}