From fe9fb4f892c0f1314db69780bb6450cee47dd463 Mon Sep 17 00:00:00 2001
From: James Herdman <jamesherdman@nulogy.com>
Date: Mon, 27 May 2024 14:45:56 -0400
Subject: [PATCH 1/3] chore: Add missing type

---
 src/Pagination/Pagination.spec.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Pagination/Pagination.spec.tsx b/src/Pagination/Pagination.spec.tsx
index 574af3069..9d21336c0 100644
--- a/src/Pagination/Pagination.spec.tsx
+++ b/src/Pagination/Pagination.spec.tsx
@@ -41,7 +41,7 @@ describe("Pagination", () => {
           onSelectPage={onSelectPageCallback}
         />
       );
-      const clickPage = (pageNum) => {
+      const clickPage = (pageNum: number) => {
         fireEvent.click(getAllByLabelText("Go to page {{count}}")[pageNum]);
       };
       clickPage(2);

From 59bf8269c5b8c16308729d0105169c9d469a5410 Mon Sep 17 00:00:00 2001
From: James Herdman <jamesherdman@nulogy.com>
Date: Mon, 27 May 2024 14:48:34 -0400
Subject: [PATCH 2/3] task: Improve `<Pagination` type for onSelectPage

The previous iteration of these type was accounting for the generated
page numbers being either a string (`SEPARATOR`) or numbers.

In this commit I introduce a much narrower type for the
`getPageItemsToDisplay` function. In doing so we more closely map to the
reality of the implementation and can use a more appropriately narrow
type for `onSelectPage`.

This resolves some challenges with ECO.
---
 src/Pagination/Pagination.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/Pagination/Pagination.tsx b/src/Pagination/Pagination.tsx
index ab71dccb9..882459719 100644
--- a/src/Pagination/Pagination.tsx
+++ b/src/Pagination/Pagination.tsx
@@ -9,9 +9,9 @@ import PageNumber from "./PageNumber";
 import PreviousButton from "./PreviousButton";
 import NextButton from "./NextButton";
 
-const SEPARATOR = "...";
+const SEPARATOR = "..." as const;
 
-export const getPageItemsToDisplay = (totalPages: number, currentPage: number) => {
+export const getPageItemsToDisplay = (totalPages: number, currentPage: number): Array<typeof SEPARATOR | number> => {
   const MAX_PAGES_TO_SHOW = 6;
 
   const pages = Array.from({ length: totalPages }, (v, i) => i + 1);
@@ -31,7 +31,7 @@ type PaginationProps = FlexProps & {
   totalPages: number;
   onNext?: () => void;
   onPrevious?: () => void;
-  onSelectPage?: (page: string | number) => void;
+  onSelectPage?: (page: number) => void;
   nextLabel?: ReactNode;
   nextAriaLabel?: string;
   previousLabel?: ReactNode;

From 797345ce3fdbb6d4a7672835a6d5f57a4cb436f8 Mon Sep 17 00:00:00 2001
From: James Herdman <jamesherdman@nulogy.com>
Date: Mon, 27 May 2024 14:49:07 -0400
Subject: [PATCH 3/3] chore: Favour an interface

---
 src/Pagination/Pagination.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Pagination/Pagination.tsx b/src/Pagination/Pagination.tsx
index 882459719..aa84d3f35 100644
--- a/src/Pagination/Pagination.tsx
+++ b/src/Pagination/Pagination.tsx
@@ -26,7 +26,7 @@ export const getPageItemsToDisplay = (totalPages: number, currentPage: number):
   return [1, SEPARATOR, ...pages.slice(currentPage - 2, currentPage + 2), SEPARATOR, totalPages];
 };
 
-type PaginationProps = FlexProps & {
+interface PaginationProps extends FlexProps {
   currentPage: number;
   totalPages: number;
   onNext?: () => void;
@@ -38,7 +38,7 @@ type PaginationProps = FlexProps & {
   previousAriaLabel?: string;
   scrollToTopAfterPagination?: boolean;
   scrollTargetRef?: RefObject<HTMLElement>;
-};
+}
 
 function Pagination({
   currentPage,