From 3ff82f24087bacea26c9df10a44e91e4813b2dad Mon Sep 17 00:00:00 2001
From: Joshua Israel <joshua.israel@weave.works>
Date: Sun, 30 Jan 2022 12:59:55 -0500
Subject: [PATCH] woke up in a cold sweat realizing that the indexing for the
 text was wrong so I fixed it

---
 ui/components/DataTable.tsx                               | 4 ++--
 ui/components/__tests__/DataTable.test.tsx                | 8 ++++----
 .../__tests__/__snapshots__/DataTable.test.tsx.snap       | 6 +++---
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/ui/components/DataTable.tsx b/ui/components/DataTable.tsx
index 6cf06669ab..42c1625612 100644
--- a/ui/components/DataTable.tsx
+++ b/ui/components/DataTable.tsx
@@ -202,8 +202,8 @@ function UnstyledDataTable({
           </FormControl>
           <Spacer padding="base" />
           <Text>
-            {pagination.start === 0 ? 1 : pagination.start} -{" "}
-            {pagination.start + r.length} out of {rows.length}
+            {pagination.start + 1} - {pagination.start + r.length} out of{" "}
+            {rows.length}
           </Text>
           <Spacer padding="base" />
           <Flex>
diff --git a/ui/components/__tests__/DataTable.test.tsx b/ui/components/__tests__/DataTable.test.tsx
index 4bc0220ba0..a862a79a93 100644
--- a/ui/components/__tests__/DataTable.test.tsx
+++ b/ui/components/__tests__/DataTable.test.tsx
@@ -120,13 +120,13 @@ describe("DataTable", () => {
       const skipForward = screen.getByLabelText("skip to last page");
       const displayText = screen.getByText(/1 - 1 out of 3/);
       fireEvent.click(forward);
-      expect(displayText.innerHTML).toContain("2");
+      expect(displayText.innerHTML).toContain("2 - 2 out of 3");
       fireEvent.click(back);
-      expect(displayText.innerHTML).toContain("1");
+      expect(displayText.innerHTML).toContain("1 - 1 out of 3");
       fireEvent.click(skipForward);
-      expect(displayText.innerHTML).toContain("3 out of 3");
+      expect(displayText.innerHTML).toContain("3 - 3 out of 3");
       fireEvent.click(skipBack);
-      expect(displayText.innerHTML).toContain("1 - 1");
+      expect(displayText.innerHTML).toContain("1 - 1 out of 3");
     });
     it("disables buttons based on page location", () => {
       render(
diff --git a/ui/components/__tests__/__snapshots__/DataTable.test.tsx.snap b/ui/components/__tests__/__snapshots__/DataTable.test.tsx.snap
index cb64d7e66e..cc259e409c 100644
--- a/ui/components/__tests__/__snapshots__/DataTable.test.tsx.snap
+++ b/ui/components/__tests__/__snapshots__/DataTable.test.tsx.snap
@@ -515,10 +515,10 @@ exports[`DataTable snapshots renders 1`] = `
       size="normal"
     >
       1
-       -
-       
+       - 
       3
-       out of 
+       out of
+       
       3
     </span>
     <div