message pagination

This commit is contained in:
Michael Woods
2025-12-28 19:28:56 -05:00
parent f2d6f8723a
commit f2242b4557
2 changed files with 102 additions and 84 deletions

View File

@@ -235,6 +235,6 @@ async def message_list_page(
"page": page, "page": page,
"per_page": per_page, "per_page": per_page,
"total_pages": total_pages, "total_pages": total_pages,
"current_user": current_user, "current_user": current_user.username,
}, },
) )

View File

@@ -1,89 +1,107 @@
<h1>Messages</h1> {% extends "base.html" %}
<div class="mb-4 d-flex justify-content-between align-items-start flex-wrap gap-3"> {% block title %}Messages{% endblock %}
<div>
<!-- Type tabs --> {% block content %}
<ul class="nav nav-tabs"> <div class="container mt-4">
<li class="nav-item"> <h1>Messages</h1>
<a class="nav-link {% if current_type == 'received' %}active{% endif %}"
href="?type=received{% if current_search %}&search={{ current_search }}{% endif %}&page=1">Received</a> <div class="mb-4 d-flex justify-content-between align-items-start flex-wrap gap-3">
</li> <div>
<li class="nav-item"> <!-- Type tabs -->
<a class="nav-link {% if current_type == 'sent' %}active{% endif %}" <ul class="nav nav-tabs">
href="?type=sent{% if current_search %}&search={{ current_search }}{% endif %}&page=1">Sent</a> <li class="nav-item">
</li> <a class="nav-link {% if current_type == 'received' %}active{% endif %}"
<li class="nav-item"> href="?type=received{% if current_search %}&search={{ current_search }}{% endif %}&page=1">Received</a>
<a class="nav-link {% if current_type == 'all' %}active{% endif %}" </li>
href="?type=all{% if current_search %}&search={{ current_search }}{% endif %}&page=1">All</a> <li class="nav-item">
</li> <a class="nav-link {% if current_type == 'sent' %}active{% endif %}"
href="?type=sent{% if current_search %}&search={{ current_search }}{% endif %}&page=1">Sent</a>
</li>
<li class="nav-item">
<a class="nav-link {% if current_type == 'all' %}active{% endif %}"
href="?type=all{% if current_search %}&search={{ current_search }}{% endif %}&page=1">All</a>
</li>
</ul>
</div>
<div class="d-flex gap-2">
<!-- Search form -->
<form method="get" class="d-flex align-items-center">
<input type="hidden" name="type" value="{{ current_type }}">
<input type="text" name="search" class="form-control me-2" placeholder="Search messages..." value="{{ current_search or '' }}">
<button type="submit" class="btn btn-outline-primary">Search</button>
</form>
{% if current_search %}
<a href="?type={{ current_type }}" class="btn btn-outline-secondary">Clear</a>
{% endif %}
<!-- Compose button -->
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#composeModal">
Compose New Message
</button>
</div>
</div>
{% if total > 0 %}
<p class="text-muted mb-3">
Showing {{ ((page-1)*per_page) + 1 }}{{ page*per_page if page*per_page < total else total }} of {{ total }} messages
</p>
{% endif %}
{% if messages %}
<ul class="list-group message-list">
{% for msg in messages %}
<li class="list-group-item">
<strong>
<a href="/dashboard/message/{{ msg.id }}">
{{ msg.text[:80] }}{% if msg.text|length > 80 %}...{% endif %}
</a>
</strong>
{% if msg.has_attachments %}<span class="badge bg-info ms-2">Attachments</span>{% endif %}
{% if not msg.retrieved %}<span class="badge bg-warning ms-2">Unread</span>{% endif %}
<div class="text-muted small mt-1">
From: {{ msg.from }} | To: {{ msg.to | join(', ') }} | {{ msg.sent_at[:10] }} {{ msg.sent_at[11:16] }}
</div>
<div class="text-secondary small mt-2">
{{ msg.text[:200] }}{% if msg.text|length > 200 %}...{% endif %}
</div>
</li>
{% endfor %}
</ul> </ul>
</div> {% else %}
<div class="alert alert-info mt-4">
{% if current_search %}
No messages found matching "{{ current_search }}".
{% else %}
No messages yet.
{% endif %}
</div>
{% endif %}
<div class="d-flex gap-2"> <!-- Pagination -->
<!-- Search form --> {% if total_pages > 1 %}
<form method="get" class="d-flex"> <nav aria-label="Messages pagination" class="mt-5">
<input type="hidden" name="type" value="{{ current_type }}"> <ul class="pagination justify-content-center">
<input type="text" name="search" class="form-control me-2" placeholder="Search messages..." value="{{ current_search or '' }}"> <li class="page-item {% if page == 1 %}disabled{% endif %}">
<button type="submit" class="btn btn-outline-primary">Search</button> <a class="page-link" href="?page={{ page - 1 }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">Previous</a>
</form> </li>
{% if current_search %}
<a href="?type={{ current_type }}" class="btn btn-outline-secondary">Clear</a>
{% endif %}
<!-- Compose button --> {% for p in range(1, total_pages + 1) %}
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#composeModal"> <li class="page-item {% if p == page %}active{% endif %}">
Compose New Message <a class="page-link" href="?page={{ p }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">{{ p }}</a>
</button> </li>
{% endfor %}
<li class="page-item {% if page == total_pages %}disabled{% endif %}">
<a class="page-link" href="?page={{ page + 1 }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">Next</a>
</li>
</ul>
</nav>
{% endif %}
<div class="mt-4">
<a href="/dashboard" class="btn btn-outline-secondary">← Back to Dashboard</a>
</div> </div>
</div> </div>
{% endblock %}
{% if total > 0 %}
<p class="text-muted mb-3">
Showing {{ ((page-1)*per_page) + 1 }}{{ page*per_page if page*per_page < total else total }} of {{ total }} messages
</p>
{% else %}
<p class="text-muted mb-3">No messages</p>
{% endif %}
{% if messages %}
<ul class="message-list">
{% for msg in messages %}
<li>
<strong><a href="/dashboard/message/{{ msg.id }}">{{ msg.text[:60] }}{% if msg.text|length > 60 %}...{% endif %}</a></strong>
{% if msg.has_attachments %}<span class="text-info">(Attachments)</span>{% endif %}
{% if not msg.retrieved %}<span class="text-warning">(Unread)</span>{% endif %}
<span class="meta">
From: {{ msg.from }} | To: {{ msg.to | join(', ') }} | {{ msg.sent_at[:10] }} {{ msg.sent_at[11:19] }}
</span>
<div class="preview">{{ msg.text[:200] }}{% if msg.text|length > 200 %}...{% endif %}</div>
</li>
{% endfor %}
</ul>
{% else %}
<div class="alert alert-info">
{% if current_search %}No messages found matching "{{ current_search }}".{% else %}No messages yet.{% endif %}
</div>
{% endif %}
<!-- Pagination (only if >1 page) -->
{% if total_pages > 1 %}
<nav aria-label="Messages pagination" class="mt-4">
<ul class="pagination justify-content-center">
<li class="page-item {% if page == 1 %}disabled{% endif %}">
<a class="page-link" href="?page={{ page - 1 }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">Previous</a>
</li>
{% for p in range(1, total_pages + 1) %}
<li class="page-item {% if p == page %}active{% endif %}">
<a class="page-link" href="?page={{ p }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">{{ p }}</a>
</li>
{% endfor %}
<li class="page-item {% if page == total_pages %}disabled{% endif %}">
<a class="page-link" href="?page={{ page + 1 }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">Next</a>
</li>
</ul>
</nav>
{% endif %}
<p><a href="/dashboard">← Back to Dashboard</a></p>