From e5c3ef1cc03ddb4b4f18236db0a4ea6cb9abbbca Mon Sep 17 00:00:00 2001 From: Caleb Alldrin Date: Fri, 13 Sep 2024 12:33:04 -0700 Subject: [PATCH 1/5] Show designation number on Donation Table --- src/components/DonationTable/DonationTable.graphql | 1 + src/components/DonationTable/DonationTable.tsx | 4 +++- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/components/DonationTable/DonationTable.graphql b/src/components/DonationTable/DonationTable.graphql index eea5fb623..6352865d5 100644 --- a/src/components/DonationTable/DonationTable.graphql +++ b/src/components/DonationTable/DonationTable.graphql @@ -52,6 +52,7 @@ fragment DonationTableRow on Donation { designationAccount { id name + accountNumber } paymentMethod } diff --git a/src/components/DonationTable/DonationTable.tsx b/src/components/DonationTable/DonationTable.tsx index 0388db0a4..47a9e363b 100644 --- a/src/components/DonationTable/DonationTable.tsx +++ b/src/components/DonationTable/DonationTable.tsx @@ -118,7 +118,9 @@ export const createDonationRow = ( currency: data.amount.convertedCurrency, foreignAmount: data.amount.amount, foreignCurrency: data.amount.currency, - designationAccount: data.designationAccount.name, + designationAccount: data.designationAccount.name + ? data.designationAccount.name + : data.designationAccount.accountNumber, paymentMethod: data.paymentMethod ?? null, appealName: data.appeal?.name ?? null, rawDonation: data, From 44fb9e29b61b09b89b13f16bf30b570531b500a7 Mon Sep 17 00:00:00 2001 From: Caleb Alldrin Date: Fri, 13 Sep 2024 12:33:25 -0700 Subject: [PATCH 2/5] Show designation number on EditDonationModal --- src/components/EditDonationModal/EditDonationModal.graphql | 1 + src/components/EditDonationModal/EditDonationModal.tsx | 4 +++- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/components/EditDonationModal/EditDonationModal.graphql b/src/components/EditDonationModal/EditDonationModal.graphql index 21c95fdeb..be62acf3a 100644 --- a/src/components/EditDonationModal/EditDonationModal.graphql +++ b/src/components/EditDonationModal/EditDonationModal.graphql @@ -36,6 +36,7 @@ query GetDesignationAccounts($accountListId: ID!) { id name active + designationNumber } } } diff --git a/src/components/EditDonationModal/EditDonationModal.tsx b/src/components/EditDonationModal/EditDonationModal.tsx index 215df7b0e..b06a33508 100644 --- a/src/components/EditDonationModal/EditDonationModal.tsx +++ b/src/components/EditDonationModal/EditDonationModal.tsx @@ -300,7 +300,9 @@ export const EditDonationModal: React.FC = ({ ) .map((account) => ( - {account.name} + {account.name + ? account.name + : account.designationNumber} ))} From 83f568baaafbda267cee9375190fac9849362e6e Mon Sep 17 00:00:00 2001 From: Caleb Alldrin Date: Fri, 13 Sep 2024 12:33:50 -0700 Subject: [PATCH 3/5] Show designation number on MultiPageMenu filter --- .../Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.tsx b/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.tsx index ca3ae2f5f..394c6d1da 100644 --- a/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.tsx +++ b/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.tsx @@ -121,7 +121,11 @@ export const MultiPageMenu: React.FC = ({ data?.designationAccounts .flatMap((group) => group.designationAccounts) .map((account) => ({ - name: account.name, + name: account.name + ? account.name + : account.designationNumber + ? account.designationNumber + : '', value: account.id, placeholder: null, })) ?? []; From dced1d1c25d02bf14b16b8cb28d902359a913969 Mon Sep 17 00:00:00 2001 From: Caleb Alldrin Date: Fri, 13 Sep 2024 13:52:24 -0700 Subject: [PATCH 4/5] Add tests --- .../DonationTable/DonationTable.test.tsx | 15 ++++++ .../EditDonationModal.test.tsx | 52 +++++++++++++++++++ .../MultiPageMenu/MultiPageMenu.test.tsx | 8 +-- 3 files changed, 72 insertions(+), 3 deletions(-) diff --git a/src/components/DonationTable/DonationTable.test.tsx b/src/components/DonationTable/DonationTable.test.tsx index 4dc70fdb1..64f745ed0 100644 --- a/src/components/DonationTable/DonationTable.test.tsx +++ b/src/components/DonationTable/DonationTable.test.tsx @@ -74,6 +74,10 @@ const TestComponent: React.FC = ({ displayName: 'Donor 1', }, paymentMethod: 'Check', + designationAccount: { + name: 'Tony Starks Account', + accountNumber: '111111', + }, }, { id: 'donation-2', @@ -92,6 +96,10 @@ const TestComponent: React.FC = ({ displayName: 'Donor 2', }, paymentMethod: 'Credit Card', + designationAccount: { + name: '', + accountNumber: '080808', + }, }, ], pageInfo: { @@ -282,4 +290,11 @@ describe('DonationTable', () => { }), ); }); + + it('shows designation number if there is no designation name', async () => { + const { findByText } = render(); + + expect(await findByText('Tony Starks Account')).toBeInTheDocument(); + expect(await findByText('080808')).toBeInTheDocument(); + }); }); diff --git a/src/components/EditDonationModal/EditDonationModal.test.tsx b/src/components/EditDonationModal/EditDonationModal.test.tsx index af3b39133..3c1ce5c57 100644 --- a/src/components/EditDonationModal/EditDonationModal.test.tsx +++ b/src/components/EditDonationModal/EditDonationModal.test.tsx @@ -36,6 +36,24 @@ const mocks = { }, }, }, + GetDesignationAccounts: { + designationAccounts: [ + { + designationAccounts: [ + { + id: '12345', + name: '', + designationNumber: '808080', + }, + { + id: '123', + name: 'Tony Starks Account', + designationNumber: '11111', + }, + ], + }, + ], + }, }; const donation = gqlMock( @@ -62,6 +80,10 @@ const donationWithAppeal = gqlMock( appealAmount: { amount: 50, }, + designationAccount: { + id: '12345', + name: '', + }, }, }, ); @@ -104,6 +126,36 @@ describe('EditDonationModal', () => { expect(getByRole('textbox', { name: 'Amount' })).toHaveValue('100'); }); + it('renders designation accounts', async () => { + const mutationSpy = jest.fn(); + const { getByRole, getByText, findByText } = render( + + + + + + mocks={mocks} + onCall={mutationSpy} + > + + + + + + , + ); + + expect(getByText('Edit Donation')).toBeInTheDocument(); + + expect(await findByText('808080')).toBeInTheDocument(); + userEvent.click(getByRole('combobox', { name: 'Designation Account' })); + expect(await findByText('Tony Starks Account')).toBeInTheDocument(); + }); + it('renders with appeal', async () => { const mutationSpy = jest.fn(); const { getByRole, getByText } = render( diff --git a/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.test.tsx b/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.test.tsx index 636ca40b7..4f917f84e 100644 --- a/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.test.tsx +++ b/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.test.tsx @@ -70,9 +70,10 @@ describe('MultiPageMenu', () => { designationAccounts: [ { designationAccounts: [ - { id: 'account-1', name: 'Account 1' }, - { id: 'account-2', name: 'Account 2' }, - { id: 'account-3', name: 'Account 3' }, + { id: 'account-1', name: 'Account 1', designationNumber: '' }, + { id: 'account-2', name: 'Account 2', designationNumber: '' }, + { id: 'account-3', name: 'Account 3', designationNumber: '' }, + { id: 'account-4', name: '', designationNumber: '4444' }, ], }, ], @@ -111,6 +112,7 @@ describe('MultiPageMenu', () => { expect(getAllByRole('option').map((option) => option.textContent)).toEqual([ 'Account 2', 'Account 3', + '4444', ]); userEvent.click(getByRole('option', { name: 'Account 2' })); expect(setDesignationAccounts).toHaveBeenLastCalledWith([ From 41b1d6723b781849b6771cb8cd3ac47d30f92596 Mon Sep 17 00:00:00 2001 From: Caleb Alldrin Date: Mon, 16 Sep 2024 10:56:18 -0700 Subject: [PATCH 5/5] syntax changes and add accountNumber to mutation --- src/components/DonationTable/DonationTable.tsx | 5 ++--- src/components/EditDonationModal/EditDonationModal.graphql | 1 + src/components/EditDonationModal/EditDonationModal.tsx | 4 +--- .../Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.tsx | 6 +----- 4 files changed, 5 insertions(+), 11 deletions(-) diff --git a/src/components/DonationTable/DonationTable.tsx b/src/components/DonationTable/DonationTable.tsx index 47a9e363b..e80664d18 100644 --- a/src/components/DonationTable/DonationTable.tsx +++ b/src/components/DonationTable/DonationTable.tsx @@ -118,9 +118,8 @@ export const createDonationRow = ( currency: data.amount.convertedCurrency, foreignAmount: data.amount.amount, foreignCurrency: data.amount.currency, - designationAccount: data.designationAccount.name - ? data.designationAccount.name - : data.designationAccount.accountNumber, + designationAccount: + data.designationAccount.name || data.designationAccount.accountNumber, paymentMethod: data.paymentMethod ?? null, appealName: data.appeal?.name ?? null, rawDonation: data, diff --git a/src/components/EditDonationModal/EditDonationModal.graphql b/src/components/EditDonationModal/EditDonationModal.graphql index be62acf3a..76b5417c3 100644 --- a/src/components/EditDonationModal/EditDonationModal.graphql +++ b/src/components/EditDonationModal/EditDonationModal.graphql @@ -23,6 +23,7 @@ fragment EditDonationModalDonation on Donation { designationAccount { id name + accountNumber } memo motivation diff --git a/src/components/EditDonationModal/EditDonationModal.tsx b/src/components/EditDonationModal/EditDonationModal.tsx index b06a33508..46f4e058f 100644 --- a/src/components/EditDonationModal/EditDonationModal.tsx +++ b/src/components/EditDonationModal/EditDonationModal.tsx @@ -300,9 +300,7 @@ export const EditDonationModal: React.FC = ({ ) .map((account) => ( - {account.name - ? account.name - : account.designationNumber} + {account.name || account.designationNumber} ))} diff --git a/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.tsx b/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.tsx index 394c6d1da..ab786c9e8 100644 --- a/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.tsx +++ b/src/components/Shared/MultiPageLayout/MultiPageMenu/MultiPageMenu.tsx @@ -121,11 +121,7 @@ export const MultiPageMenu: React.FC = ({ data?.designationAccounts .flatMap((group) => group.designationAccounts) .map((account) => ({ - name: account.name - ? account.name - : account.designationNumber - ? account.designationNumber - : '', + name: account.name || account.designationNumber || '', value: account.id, placeholder: null, })) ?? [];