From b59fc8b952c5da86326d4e1d780a39890d5173d5 Mon Sep 17 00:00:00 2001
From: David Roper <davidroper321@gmail.com>
Date: Wed, 26 Mar 2025 14:02:24 -0400
Subject: [PATCH 1/7] test: add test id to page number paragraph

---
 src/components/ClientTable/ClientTablePagination.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/ClientTable/ClientTablePagination.tsx b/src/components/ClientTable/ClientTablePagination.tsx
index 395c8323..d4428c80 100644
--- a/src/components/ClientTable/ClientTablePagination.tsx
+++ b/src/components/ClientTable/ClientTablePagination.tsx
@@ -23,7 +23,10 @@ export const ClientTablePagination = ({
   return (
     <div className="flex items-center justify-between py-3">
       <div className="hidden sm:block">
-        <p className="text-sm font-medium text-muted-foreground">{`${firstEntry} - ${lastEntry} / ${totalEntries}`}</p>
+        <p
+          className="text-sm font-medium text-muted-foreground"
+          data-testid="page-numbers"
+        >{`${firstEntry} - ${lastEntry} / ${totalEntries}`}</p>
       </div>
       <div className="flex flex-1 justify-between gap-3 sm:justify-end">
         <Button

From 30cc6e6c78ac10cf0aa631e4a59e5f1c0016c20b Mon Sep 17 00:00:00 2001
From: David Roper <davidroper321@gmail.com>
Date: Wed, 26 Mar 2025 14:03:04 -0400
Subject: [PATCH 2/7] test: add page traversal test to client table test file

---
 .../ClientTable/ClientTable.spec.tsx          | 45 ++++++++++++++++++-
 1 file changed, 43 insertions(+), 2 deletions(-)

diff --git a/src/components/ClientTable/ClientTable.spec.tsx b/src/components/ClientTable/ClientTable.spec.tsx
index f2605aec..bdc29d17 100644
--- a/src/components/ClientTable/ClientTable.spec.tsx
+++ b/src/components/ClientTable/ClientTable.spec.tsx
@@ -1,14 +1,14 @@
 import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { describe, expect, it } from 'vitest';
 
 import { ClientTable } from './ClientTable';
-
 const TEST_ID = 'ClientTable';
 const FIRST_BUTTON_ID = 'first-page-button';
 const PREVIOUS_BUTTON_ID = 'previous-page-button';
 const NEXT_BUTTON_ID = 'next-page-button';
 const LAST_BUTTON_ID = 'last-page-button';
-
+const PAGE_NUMBER_ID = 'page-numbers';
 describe('ClientTable', () => {
   it('should render', () => {
     render(<ClientTable columns={[]} data={[]} minRows={10} />);
@@ -22,4 +22,45 @@ describe('ClientTable', () => {
     render(<ClientTable className="foo" columns={[]} data={[]} minRows={10} />);
     expect(screen.getByTestId(TEST_ID)).toHaveClass('foo');
   });
+  it('should function correctly', async () => {
+    render(
+      <ClientTable
+        columns={[
+          {
+            field: 'f1',
+            label: 'Field 1'
+          },
+          {
+            field: 'f2',
+            label: 'Field 2'
+          }
+        ]}
+        data={[
+          {
+            f1: 1,
+            f2: 2
+          },
+          {
+            f1: 23,
+            f2: 24
+          }
+        ]}
+        entriesPerPage={1}
+        minRows={3}
+      />
+    );
+    expect(screen.getByTestId(PAGE_NUMBER_ID)).toBeInTheDocument();
+    await userEvent.click(screen.getByTestId(NEXT_BUTTON_ID));
+    await userEvent.click(await screen.findByText('23.00'));
+    expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('2 - 2 / 2');
+    await userEvent.click(screen.getByTestId(PREVIOUS_BUTTON_ID));
+    await userEvent.click(await screen.findByText('1.00'));
+    expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('1 - 1 / 2');
+    await userEvent.click(screen.getByTestId(LAST_BUTTON_ID));
+    await userEvent.click(await screen.findByText('23.00'));
+    expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('2 - 2 / 2');
+    await userEvent.click(screen.getByTestId(FIRST_BUTTON_ID));
+    await userEvent.click(await screen.findByText('1.00'));
+    expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('1 - 1 / 2');
+  });
 });

From b27912969132d9a41ca80bf6479519f75c884ac9 Mon Sep 17 00:00:00 2001
From: David Roper <davidroper321@gmail.com>
Date: Wed, 26 Mar 2025 14:10:42 -0400
Subject: [PATCH 3/7] test: add onEntryClick test for client Table

---
 src/components/ClientTable/ClientTable.spec.tsx | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/components/ClientTable/ClientTable.spec.tsx b/src/components/ClientTable/ClientTable.spec.tsx
index bdc29d17..542c27c4 100644
--- a/src/components/ClientTable/ClientTable.spec.tsx
+++ b/src/components/ClientTable/ClientTable.spec.tsx
@@ -1,6 +1,6 @@
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { describe, expect, it } from 'vitest';
+import { describe, expect, it, vi } from 'vitest';
 
 import { ClientTable } from './ClientTable';
 const TEST_ID = 'ClientTable';
@@ -23,6 +23,7 @@ describe('ClientTable', () => {
     expect(screen.getByTestId(TEST_ID)).toHaveClass('foo');
   });
   it('should function correctly', async () => {
+    const handleClientTableItemClick = vi.fn();
     render(
       <ClientTable
         columns={[
@@ -47,20 +48,28 @@ describe('ClientTable', () => {
         ]}
         entriesPerPage={1}
         minRows={3}
+        onEntryClick={handleClientTableItemClick}
       />
     );
     expect(screen.getByTestId(PAGE_NUMBER_ID)).toBeInTheDocument();
     await userEvent.click(screen.getByTestId(NEXT_BUTTON_ID));
     await userEvent.click(await screen.findByText('23.00'));
+    expect(handleClientTableItemClick).toBeCalled();
+
     expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('2 - 2 / 2');
     await userEvent.click(screen.getByTestId(PREVIOUS_BUTTON_ID));
     await userEvent.click(await screen.findByText('1.00'));
+    expect(handleClientTableItemClick).toBeCalled();
+
     expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('1 - 1 / 2');
     await userEvent.click(screen.getByTestId(LAST_BUTTON_ID));
     await userEvent.click(await screen.findByText('23.00'));
+    expect(handleClientTableItemClick).toBeCalled();
+
     expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('2 - 2 / 2');
     await userEvent.click(screen.getByTestId(FIRST_BUTTON_ID));
     await userEvent.click(await screen.findByText('1.00'));
+    expect(handleClientTableItemClick).toBeCalled();
     expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('1 - 1 / 2');
   });
 });

From f908d90bd701327e1be03a59c21844a3ad0558e9 Mon Sep 17 00:00:00 2001
From: David Roper <davidroper321@gmail.com>
Date: Wed, 26 Mar 2025 14:18:34 -0400
Subject: [PATCH 4/7] test: improve name for page number test id

---
 src/components/ClientTable/ClientTable.spec.tsx | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/ClientTable/ClientTable.spec.tsx b/src/components/ClientTable/ClientTable.spec.tsx
index 542c27c4..ec57637f 100644
--- a/src/components/ClientTable/ClientTable.spec.tsx
+++ b/src/components/ClientTable/ClientTable.spec.tsx
@@ -8,7 +8,7 @@ const FIRST_BUTTON_ID = 'first-page-button';
 const PREVIOUS_BUTTON_ID = 'previous-page-button';
 const NEXT_BUTTON_ID = 'next-page-button';
 const LAST_BUTTON_ID = 'last-page-button';
-const PAGE_NUMBER_ID = 'page-numbers';
+const PAGE_NUMBER_TEST_ID = 'page-numbers';
 describe('ClientTable', () => {
   it('should render', () => {
     render(<ClientTable columns={[]} data={[]} minRows={10} />);
@@ -51,25 +51,25 @@ describe('ClientTable', () => {
         onEntryClick={handleClientTableItemClick}
       />
     );
-    expect(screen.getByTestId(PAGE_NUMBER_ID)).toBeInTheDocument();
+    expect(screen.getByTestId(PAGE_NUMBER_TEST_ID)).toBeInTheDocument();
     await userEvent.click(screen.getByTestId(NEXT_BUTTON_ID));
     await userEvent.click(await screen.findByText('23.00'));
     expect(handleClientTableItemClick).toBeCalled();
 
-    expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('2 - 2 / 2');
+    expect(screen.getByTestId(PAGE_NUMBER_TEST_ID).textContent).toBe('2 - 2 / 2');
     await userEvent.click(screen.getByTestId(PREVIOUS_BUTTON_ID));
     await userEvent.click(await screen.findByText('1.00'));
     expect(handleClientTableItemClick).toBeCalled();
 
-    expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('1 - 1 / 2');
+    expect(screen.getByTestId(PAGE_NUMBER_TEST_ID).textContent).toBe('1 - 1 / 2');
     await userEvent.click(screen.getByTestId(LAST_BUTTON_ID));
     await userEvent.click(await screen.findByText('23.00'));
     expect(handleClientTableItemClick).toBeCalled();
 
-    expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('2 - 2 / 2');
+    expect(screen.getByTestId(PAGE_NUMBER_TEST_ID).textContent).toBe('2 - 2 / 2');
     await userEvent.click(screen.getByTestId(FIRST_BUTTON_ID));
     await userEvent.click(await screen.findByText('1.00'));
     expect(handleClientTableItemClick).toBeCalled();
-    expect(screen.getByTestId(PAGE_NUMBER_ID).textContent).toBe('1 - 1 / 2');
+    expect(screen.getByTestId(PAGE_NUMBER_TEST_ID).textContent).toBe('1 - 1 / 2');
   });
 });

From 401ec6568c446c99cc484b26aec0410b9370b702 Mon Sep 17 00:00:00 2001
From: David Roper <davidroper321@gmail.com>
Date: Wed, 26 Mar 2025 14:46:13 -0400
Subject: [PATCH 5/7] test: add columnDropDownoptions to mock client table

---
 src/components/ClientTable/ClientTable.spec.tsx | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/src/components/ClientTable/ClientTable.spec.tsx b/src/components/ClientTable/ClientTable.spec.tsx
index ec57637f..6f36e82c 100644
--- a/src/components/ClientTable/ClientTable.spec.tsx
+++ b/src/components/ClientTable/ClientTable.spec.tsx
@@ -3,6 +3,7 @@ import userEvent from '@testing-library/user-event';
 import { describe, expect, it, vi } from 'vitest';
 
 import { ClientTable } from './ClientTable';
+
 const TEST_ID = 'ClientTable';
 const FIRST_BUTTON_ID = 'first-page-button';
 const PREVIOUS_BUTTON_ID = 'previous-page-button';
@@ -24,8 +25,15 @@ describe('ClientTable', () => {
   });
   it('should function correctly', async () => {
     const handleClientTableItemClick = vi.fn();
+    const handleClientTableDropdownClick = vi.fn();
     render(
       <ClientTable
+        columnDropdownOptions={[
+          {
+            label: 'delete',
+            onSelection: handleClientTableDropdownClick
+          }
+        ]}
         columns={[
           {
             field: 'f1',

From 151287410189476913c052990992bb665570c883 Mon Sep 17 00:00:00 2001
From: David Roper <davidroper321@gmail.com>
Date: Wed, 26 Mar 2025 16:04:13 -0400
Subject: [PATCH 6/7] test: add custom test ids for clientTable dropdown labels

---
 src/components/ClientTable/ClientTable.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/ClientTable/ClientTable.tsx b/src/components/ClientTable/ClientTable.tsx
index 83878e0f..3aa5d494 100644
--- a/src/components/ClientTable/ClientTable.tsx
+++ b/src/components/ClientTable/ClientTable.tsx
@@ -104,6 +104,7 @@ export const ClientTable = <T extends ClientTableEntry>({
                             const Icon = option.icon;
                             return (
                               <DropdownMenu.Item
+                                data-testid={option.label + '-test-id'}
                                 key={option.label}
                                 onClick={() => {
                                   option.onSelection(column);

From 1d89d3ee2ffa25ca2f742a4c876a4b3d81c98f80 Mon Sep 17 00:00:00 2001
From: David Roper <davidroper321@gmail.com>
Date: Wed, 26 Mar 2025 16:04:37 -0400
Subject: [PATCH 7/7] test: add clientTable dropdown test

---
 src/components/ClientTable/ClientTable.spec.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/components/ClientTable/ClientTable.spec.tsx b/src/components/ClientTable/ClientTable.spec.tsx
index 6f36e82c..e02687aa 100644
--- a/src/components/ClientTable/ClientTable.spec.tsx
+++ b/src/components/ClientTable/ClientTable.spec.tsx
@@ -79,5 +79,9 @@ describe('ClientTable', () => {
     await userEvent.click(await screen.findByText('1.00'));
     expect(handleClientTableItemClick).toBeCalled();
     expect(screen.getByTestId(PAGE_NUMBER_TEST_ID).textContent).toBe('1 - 1 / 2');
+
+    await userEvent.click(await screen.findByText('Field 1'));
+    await userEvent.click(screen.getByTestId('delete-test-id'));
+    expect(handleClientTableDropdownClick).toBeCalled();
   });
 });