From 5ca6a5fdd58c4ce20085dacb71d8ae50941345ab Mon Sep 17 00:00:00 2001
From: Jose Carcamo <138070439+josercarcamo@users.noreply.github.com>
Date: Wed, 24 Apr 2024 13:10:11 -0700
Subject: [PATCH] feat(pagination): add navigation methods (#9154)

**Related Issue:** #6344

## Summary
Adds a method to navigate to the first, last, and an arbitrary page.
---
 .../components/pagination/pagination.e2e.ts   | 54 +++++++++++++++++++
 .../src/components/pagination/pagination.tsx  | 26 +++++++++
 2 files changed, 80 insertions(+)

diff --git a/packages/calcite-components/src/components/pagination/pagination.e2e.ts b/packages/calcite-components/src/components/pagination/pagination.e2e.ts
index c357dd60934..cb85037d336 100644
--- a/packages/calcite-components/src/components/pagination/pagination.e2e.ts
+++ b/packages/calcite-components/src/components/pagination/pagination.e2e.ts
@@ -279,4 +279,58 @@ describe("calcite-pagination", () => {
       }
     });
   });
+
+  describe("navigation methods", () => {
+    let page: E2EPage;
+    beforeEach(async () => {
+      page = await newE2EPage();
+      await page.setContent(
+        `<calcite-pagination start-item="1" total-items="124" page-size="20"></calcite-pagination>`,
+      );
+    });
+
+    it("navigates to last page", async () => {
+      const element = await page.find("calcite-pagination");
+      await element.callMethod("goTo", "end");
+      await page.waitForChanges();
+      const item = await element.getProperty("startItem");
+      expect(item).toEqual(121);
+    });
+
+    it("navigates to first page", async () => {
+      const element = await page.find("calcite-pagination");
+      await element.callMethod("goTo", "end");
+      await page.waitForChanges();
+      let item = await element.getProperty("startItem");
+      expect(item).toEqual(121);
+      await element.callMethod("goTo", "start");
+      await page.waitForChanges();
+      item = await element.getProperty("startItem");
+      expect(item).toEqual(1);
+    });
+
+    it("navigates middle page", async () => {
+      const element = await page.find("calcite-pagination");
+      await element.callMethod("goTo", 3);
+      await page.waitForChanges();
+      const item = await element.getProperty("startItem");
+      expect(item).toEqual(41);
+    });
+
+    it("navigates beyond last page", async () => {
+      const element = await page.find("calcite-pagination");
+      await element.callMethod("goTo", 20);
+      await page.waitForChanges();
+      const item = await element.getProperty("startItem");
+      expect(item).toEqual(121);
+    });
+
+    it("navigates before first page", async () => {
+      const element = await page.find("calcite-pagination");
+      await element.callMethod("goTo", -1);
+      await page.waitForChanges();
+      const item = await element.getProperty("startItem");
+      expect(item).toEqual(1);
+    });
+  });
 });
diff --git a/packages/calcite-components/src/components/pagination/pagination.tsx b/packages/calcite-components/src/components/pagination/pagination.tsx
index 402eb56aee5..11b8592b738 100644
--- a/packages/calcite-components/src/components/pagination/pagination.tsx
+++ b/packages/calcite-components/src/components/pagination/pagination.tsx
@@ -242,6 +242,32 @@ export class Pagination
     this.startItem = Math.max(1, this.startItem - this.pageSize);
   }
 
+  /**
+   * Set a specified page as active.
+   *
+   * @param page
+   */
+  @Method()
+  async goTo(page: number | "start" | "end"): Promise<void> {
+    switch (page) {
+      case "start":
+        this.startItem = 1;
+        break;
+      case "end":
+        this.startItem = this.lastStartItem;
+        break;
+      default: {
+        if (page >= Math.ceil(this.totalPages)) {
+          this.startItem = this.lastStartItem;
+        } else if (page <= 0) {
+          this.startItem = 1;
+        } else {
+          this.startItem = (page - 1) * this.pageSize + 1;
+        }
+      }
+    }
+  }
+
   // --------------------------------------------------------------------------
   //
   //  Private Methods