feat: add pagination buttons

packages/analytics/src/controllers/commands.js

@@ -8,12 +8,15 @@ export async function commandListController(req, res) {
   const itemsPerPage = 100
 
   try {
-    const payload = await errorCommands(
-      new Pagination(order, itemsPerPage, nextKey)
-    )
+    const pagination = new Pagination(order, itemsPerPage, nextKey)
+    const payload = await errorCommands(pagination)
     const newNextKey = payload[payload.length - 1]?._id
 
-    res.render('commands', { errorCommands: payload, nextKey: newNextKey })
+    res.render('commands', {
+      errorCommands: payload,
+      nextKey: newNextKey,
+      order: pagination.getOrder(),
+    })
   } catch (error) {
     console.error(error)
     res.status(500).send('Error fetching data')

packages/analytics/src/controllers/sessions.js

@@ -6,15 +6,15 @@ export async function sessionListController(req, res) {
   const itemsPerPage = 50
 
   try {
-    // const totalSessions = await sessionCount()
-    // const maxPages = Math.ceil(totalSessions / itemsPerPage)
-
-    const sessions = await sessionList(
-      new Pagination(order, itemsPerPage, nextKey)
-    )
+    const pagination = new Pagination(order, itemsPerPage, nextKey)
+    const sessions = await sessionList(pagination)
     const newNextKey = sessions[sessions.length - 1]?._id
 
-    res.render('sessions', { sessions, nextKey: newNextKey })
+    res.render('sessions', {
+      sessions,
+      nextKey: newNextKey,
+      order: pagination.getOrder(),
+    })
   } catch (error) {
     console.log(error)
     res.status(500).send('Error fetching session data')

packages/analytics/src/controllers/users.js

@@ -6,10 +6,15 @@ export async function userListController(req, res) {
   const itemsPerPage = 50
 
   try {
-    const users = await userList(new Pagination(order, itemsPerPage, nextKey))
+    const pagination = new Pagination(order, itemsPerPage, nextKey)
+    const users = await userList(pagination)
     const newNextKey = users[users.length - 1]?._id
 
-    res.render('users', { users, nextKey: newNextKey })
+    res.render('users', {
+      users,
+      nextKey: newNextKey,
+      order: pagination.getOrder(),
+    })
   } catch (error) {
     console.error(error)
     res.status(500).send('Error fetching user data')

packages/analytics/src/models/pagination.js

@@ -14,6 +14,10 @@ class Asc {
   getOrder() {
     return 1
   }
+
+  getName() {
+    return ASC
+  }
 }
 
 class Desc {
@@ -24,6 +28,10 @@ class Desc {
   getOrder() {
     return -1
   }
+
+  getName() {
+    return DESC
+  }
 }
 
 export default class Pagination {
@@ -59,4 +67,8 @@ export default class Pagination {
   limit() {
     return { $limit: this.itemsPerPage }
   }
+
+  getOrder() {
+    return this.order.getName()
+  }
 }

packages/analytics/tests/pagination.test.js

@@ -3,7 +3,8 @@ import Pagination, { ASC, DESC } from '../src/models/pagination.js'
 
 describe('Pagination', () => {
   it('should failed when not provide order', () => {
-    expect(() => new Pagination()).toThrow('order must be asc or desc')
+    expect(new Pagination('').getOrder()).toBe(DESC)
+    expect(() => new Pagination('Hahaha')).toThrow()
   })
   it('should return correct limit', () => {
     const pagination = new Pagination(DESC, 10)

packages/analytics/views/commands.handlebars

@@ -1,6 +1,10 @@
 <h1>Commands</h1>
 <div>
   <h2>Error commands</h2>
+  <div class='pagination'>
+    <a href='/commands?order=asc'>Ascending</a>
+    <a href='/commands?order=desc'>Descending</a>
+  </div>
   <table>
     <tr>
       <th>Command</th>
@@ -21,7 +25,7 @@
       </tr>
     {{/each}}
   </table>
-</div>
-<div class='pagination'>
-  <a href='/commands?nextKey={{nextKey}}'>Next</a>
+  <div class='pagination'>
+    <a href='/commands?nextKey={{nextKey}}&order={{order}}'>Next</a>
+  </div>
 </div>

packages/analytics/views/sessions.handlebars

@@ -1,4 +1,8 @@
 <h1>Sessions</h1>
+<div class='pagination'>
+  <a href='/sessions?order=asc'>Ascending</a>
+  <a href='/sessions?order=desc'>Descending</a>
+</div>
 <div>
   <table>
     <tr>
@@ -26,5 +30,5 @@
   </table>
 </div>
 <div class='pagination'>
-  <a href='/sessions?nextKey={{nextKey}}'>Next</a>
+  <a href='/sessions?nextKey={{nextKey}}&order={{order}}'>Next</a>
 </div>

packages/analytics/views/users.handlebars

@@ -1,4 +1,8 @@
 <h1>Users List</h1>
+<div class='pagination'>
+  <a href='/users?order=asc'>Ascending</a>
+  <a href='/users?order=desc'>Descending</a>
+</div>
 <div>
   <table>
     <tr>
@@ -22,5 +26,5 @@
   </table>
 </div>
 <div class='pagination'>
-  <a href='/users?nextKey={{nextKey}}'>Next</a>
+  <a href='/users?nextKey={{nextKey}}&order={{order}}'>Next</a>
 </div>