Add pagination to QSO Log and back buttons to pages

- Add backend pagination support for /api/qsos endpoint (page, limit params)
- Return paginated results with metadata (totalCount, totalPages, hasNext, hasPrev)
- Add pagination UI to QSOs page with prev/next buttons and page numbers
- Add back button to QSO Log and Settings pages linking to main menu
- Reset to page 1 when applying filters

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-15 22:10:23 +01:00
parent dde0c18f51
commit 40a3e3642e
4 changed files with 215 additions and 20 deletions

View File

@@ -468,15 +468,18 @@ export async function syncQSOs(userId, lotwUsername, lotwPassword, sinceDate = n
}
/**
* Get QSOs for a user
* Get QSOs for a user with pagination
* @param {number} userId - User ID
* @param {Object} filters - Query filters
* @returns {Promise<Array>} Array of QSOs
* @param {Object} options - Pagination options { page, limit }
* @returns {Promise<Object>} Paginated QSOs
*/
export async function getUserQSOs(userId, filters = {}) {
const { eq, and } = await import('drizzle-orm');
export async function getUserQSOs(userId, filters = {}, options = {}) {
const { eq, and, desc, sql } = await import('drizzle-orm');
console.error('getUserQSOs called with userId:', userId, 'filters:', filters);
const { page = 1, limit = 100 } = options;
console.error('getUserQSOs called with userId:', userId, 'filters:', filters, 'page:', page, 'limit:', limit);
// Build where conditions
const conditions = [eq(qsos.userId, userId)];
@@ -493,17 +496,35 @@ export async function getUserQSOs(userId, filters = {}) {
conditions.push(eq(qsos.lotwQslRstatus, 'Y'));
}
// Use and() to combine all conditions
const results = await db.select().from(qsos).where(and(...conditions));
// Get total count for pagination
const allResults = await db.select().from(qsos).where(and(...conditions));
const totalCount = allResults.length;
console.error('getUserQSOs returning', results.length, 'QSOs');
// Calculate offset
const offset = (page - 1) * limit;
// Order by date descending, then time
return results.sort((a, b) => {
const dateCompare = b.qsoDate.localeCompare(a.qsoDate);
if (dateCompare !== 0) return dateCompare;
return b.timeOn.localeCompare(a.timeOn);
});
// Get paginated results
const results = await db
.select()
.from(qsos)
.where(and(...conditions))
.orderBy(desc(qsos.qsoDate), desc(qsos.timeOn))
.limit(limit)
.offset(offset);
console.error('getUserQSOs returning', results.length, 'QSOs (page', page, 'of', Math.ceil(totalCount / limit), ')');
return {
qsos: results,
pagination: {
page,
limit,
totalCount,
totalPages: Math.ceil(totalCount / limit),
hasNext: page * limit < totalCount,
hasPrev: page > 1,
},
};
}
/**