diff --git a/src/components/Contacts/MassActions/Merge/MassActionsMergeModal.test.tsx b/src/components/Contacts/MassActions/Merge/MassActionsMergeModal.test.tsx
index 1cb8f151a..76cbd2f66 100644
--- a/src/components/Contacts/MassActions/Merge/MassActionsMergeModal.test.tsx
+++ b/src/components/Contacts/MassActions/Merge/MassActionsMergeModal.test.tsx
@@ -199,4 +199,87 @@ describe('MassActionsMergeModal', () => {
expect(deselectAll).toHaveBeenCalled();
});
});
+
+ it('should show contact error message if 9 contacts or over', async () => {
+ const { getByText, queryByText } = render(
+
+
+
+ mocks={mocks}
+ >
+
+
+
+
+
+ ,
+ );
+ await waitFor(() => {
+ expect(
+ getByText('You can only merge up to 8 contacts at a time.'),
+ ).toBeInTheDocument();
+
+ expect(
+ queryByText('This action cannot be undone!'),
+ ).not.toBeInTheDocument();
+ });
+ });
+
+ it('should not show contact error message if 8 contacts', async () => {
+ const { getByText, queryByText } = render(
+
+
+
+ mocks={mocks}
+ >
+
+
+
+
+
+ ,
+ );
+ await waitFor(() => {
+ expect(
+ queryByText('You can only merge up to 8 contacts at a time.'),
+ ).not.toBeInTheDocument();
+
+ expect(getByText('This action cannot be undone!')).toBeInTheDocument();
+ });
+ });
});
diff --git a/src/components/Contacts/MassActions/Merge/MassActionsMergeModal.tsx b/src/components/Contacts/MassActions/Merge/MassActionsMergeModal.tsx
index 06c9b8e9f..e90709255 100644
--- a/src/components/Contacts/MassActions/Merge/MassActionsMergeModal.tsx
+++ b/src/components/Contacts/MassActions/Merge/MassActionsMergeModal.tsx
@@ -85,96 +85,119 @@ export const MassActionsMergeModal: React.FC = ({
handleClose();
};
+ const contactLimitExceeded = ids.length > 8;
+
return (
- ({
- marginBottom: theme.spacing(2),
- })}
- >
- {t('This action cannot be undone!')}
-
-
- {t('Are you sure you want to merge the selected contacts?')}
-
-
- {t(
- ' Data from the "losers" will get copied to the "winner". Select the winner below. No data will be lost by merging.',
- )}
-
- {data?.contacts.nodes.map((contact) => (
- setPrimaryContactId(contact.id)}
- aria-selected={primaryContactId === contact.id}
+ {contactLimitExceeded && (
+ ({
- display: 'flex',
- gap: theme.spacing(2),
- cursor: 'pointer',
- borderWidth: 3,
- borderStyle: 'solid',
- borderColor:
- primaryContactId === contact.id
- ? theme.palette.mpdxGreen.main
- : theme.palette.cruGrayLight.main,
+ marginBottom: theme.spacing(2),
})}
- data-testid="MassActionsMergeModalContact"
>
-
-
- {contact.name}
-
- {t('Status')}: {getLocalizedContactStatus(t, contact.status)}
-
- {contact.primaryAddress && (
- <>
- {contact.primaryAddress.street}
-
- {contact.primaryAddress.city},{' '}
- {contact.primaryAddress.state}{' '}
- {contact.primaryAddress.postalCode}
+ {t('You can only merge up to 8 contacts at a time.')}
+
+ )}
+ {!contactLimitExceeded && (
+ <>
+ ({
+ marginBottom: theme.spacing(2),
+ })}
+ >
+ {t('This action cannot be undone!')}
+
+
+ {t('Are you sure you want to merge the selected contacts?')}
+
+
+ {t(
+ ' Data from the "losers" will get copied to the "winner". Select the winner below. No data will be lost by merging.',
+ )}
+
+ {data?.contacts.nodes.map((contact) => (
+ setPrimaryContactId(contact.id)}
+ aria-selected={primaryContactId === contact.id}
+ sx={(theme) => ({
+ display: 'flex',
+ gap: theme.spacing(2),
+ cursor: 'pointer',
+ borderWidth: 3,
+ borderStyle: 'solid',
+ borderColor:
+ primaryContactId === contact.id
+ ? theme.palette.mpdxGreen.main
+ : theme.palette.cruGrayLight.main,
+ })}
+ data-testid="MassActionsMergeModalContact"
+ >
+
+
+ {contact.name}
+
+ {t('Status')}:{' '}
+ {getLocalizedContactStatus(t, contact.status)}
- {t('From')}: {contact.primaryAddress.source}
-
- >
+ {contact.primaryAddress && (
+ <>
+ {contact.primaryAddress.street}
+
+ {contact.primaryAddress.city},{' '}
+ {contact.primaryAddress.state}{' '}
+ {contact.primaryAddress.postalCode}
+
+ {t('From')}: {contact.primaryAddress.source}
+
+ >
+ )}
+ {t('On')}:{' '}
+ {dateFormatShort(
+ DateTime.fromISO(contact.createdAt),
+ locale,
+ )}
+
+
+ {primaryContactId === contact.id && (
+
+ ({
+ backgroundColor: theme.palette.mpdxGreen.main,
+ color: 'white',
+ padding: theme.spacing(0.5),
+ margin: theme.spacing(-2),
+ })}
+ variant="subtitle2"
+ >
+ {t('Use This One')}
+
+
+
)}
- {t('On')}:{' '}
- {dateFormatShort(DateTime.fromISO(contact.createdAt), locale)}
-
-
- {primaryContactId === contact.id && (
-
- ({
- backgroundColor: theme.palette.mpdxGreen.main,
- color: 'white',
- padding: theme.spacing(0.5),
- margin: theme.spacing(-2),
- })}
- variant="subtitle2"
- >
- {t('Use This One')}
-
-
- )}
-
- )) ?? }
+ )) ?? }
+ >
+ )}
-
+
{updating && }
{t('Merge')}