Remove mojPagination and replace with govukPagination

app/assets/sass/application.scss

@@ -61,7 +61,6 @@ $govuk-assets-path: "/dist/govuk/assets/";
 @import "overrides/govuk-tag";
 @import "overrides/moj-button-menu";
 @import "overrides/moj-filter";
-@import "overrides/moj-pagination";
 @import "overrides/moj-primary-navigation";
 @import "overrides/status-grid";
 @import "overrides/summary-card";

app/routes.js

@@ -18,6 +18,12 @@ router.all('*', (req, res, next) => {
     res.locals.referrer = req.query.referrer.split(',')
   }
 
+  if (req.query?.page) {
+    res.locals.page = req.query.page
+    res.locals.nextPage = parseInt(req.query.page) + 1
+    res.locals.prevPage = parseInt(req.query.page) - 1
+  }
+
   // Only search by the query if there is one
   // (and get "undefined" instead of "{}" if there is no query)
   const hasQuery = !_.isEmpty(req.query)

app/views/_includes/pagination.njk

@@ -1,35 +1,34 @@
+{# TODO: make pagination dynamic #}
+<p class="govuk-body">
+  Showing 1 to 100 of 346 results
+</p>
 
+{% if not page %}
+  {% set page = 1 %}
+{% endif %}
 
-{% set pagination = {
-  from: 1,
-  to: 100,
-  count: count or 346,
+{{ govukPagination({
+  previous: {
+    href: "?page=" + prevPage
+  } if page > 1,
   next: {
-    text: 'Next',
-    href: '?page=' + 2
-  },
-  items: [{
-    text: '1',
-    href: '?page=1',
-    selected: true
-    }, {
-    text: '2',
-    href: '?page=2',
-    selected: false
-    }, {
-    text: '3',
-    href: '?page=3'
-    }]
-} %}
-
-{{ mojPagination({
-  results: {
-    from: pagination.from,
-    to: pagination.to,
-    count: pagination.count
-  },
-  previous: pagination.previous,
-  next: pagination.next,
-  items: pagination.items,
-  classes: 'govuk-!-margin-bottom-3'
+    href: "?page=" + nextPage
+  } if page < 3,
+  items: [
+    {
+      number: 1,
+      href: "?page=1",
+      current: true if page == 1
+    },
+    {
+      number: 2,
+      href: "?page=2",
+      current: true if page == 2
+    },
+    {
+      number: 3,
+      href: "?page=3",
+      current: true if page == 3
+    }
+  ]
 }) }}

app/views/layout.njk

@@ -19,6 +19,7 @@
 {% from "govuk/components/inset-text/macro.njk"       import govukInsetText %}
 {% from "govuk/components/notification-banner/macro.njk" import govukNotificationBanner %}
 {% from "govuk/components/panel/macro.njk"            import govukPanel %}
+{% from "govuk/components/pagination/macro.njk"       import govukPagination %}
 {% from "govuk/components/phase-banner/macro.njk"     import govukPhaseBanner %}
 {% from "govuk/components/radios/macro.njk"           import govukRadios %}
 {% from "govuk/components/select/macro.njk"           import govukSelect %}
@@ -52,7 +53,6 @@
 {# moj components #}
 {%- from "moj/components/filter/macro.njk" import mojFilter -%}
 {%- from "moj/components/button-menu/macro.njk" import mojButtonMenu -%}
-{%- from "moj/components/pagination/macro.njk" import mojPagination -%}
 {%- from "moj/components/primary-navigation/macro.njk" import mojPrimaryNavigation -%}
 
 {% block head %}