box-ui-elements 16.0.0-beta.9 → 16.0.0

package/src/features/unified-share-modal/EmailForm.js

@@ -21,6 +21,7 @@ import IconGlobe from '../../icons/general/IconGlobe';
 import ContactRestrictionNotice from './ContactRestrictionNotice';
 import ContactsField from './ContactsField';
 import hasRestrictedContacts from './utils/hasRestrictedContacts';
+import isRestrictedContact from './utils/isRestrictedContact';
 import messages from './messages';
 import type { CollabRestrictionType, SuggestedCollabLookup, contactType as Contact, USMConfig } from './flowTypes';
 import type { SelectOptionProp } from '../../components/select-field/props';
@@ -57,6 +58,7 @@ type Props = {
     openInviteCollaboratorsSection?: Function,
     recommendedSharingTooltipCalloutName?: ?string,
     restrictedEmails: Array<string>,
+    restrictedGroups: Array<number>,
     selectedContacts: Array<Contact>,
     sendButtonProps?: Object,
     showEnterEmailsCallout: boolean,
@@ -79,6 +81,7 @@ class EmailForm extends React.Component<Props, State> {
         isRestrictionJustificationEnabled: false,
         justificationReasons: [],
         restrictedEmails: [],
+        restrictedGroups: [],
     };
 
     constructor(props: Props) {
@@ -152,8 +155,8 @@ class EmailForm extends React.Component<Props, State> {
     handleRemoveRestrictedContacts = () => {
         const { onContactRemove, selectedContacts, updateSelectedContacts } = this.props;
 
-        const [removedContacts, remainingContacts] = partition(selectedContacts, ({ value }) =>
-            this.isRestrictedEmail(value),
+        const [removedContacts, remainingContacts] = partition(selectedContacts, (contact: Contact) =>
+            this.isRestrictedContact(contact),
         );
 
         updateSelectedContacts(remainingContacts);
@@ -186,9 +189,15 @@ class EmailForm extends React.Component<Props, State> {
     validateContactsRestrictions = () => {
         let contactsRestrictionError = '';
         const { selectedJustificationReason } = this.state;
-        const { intl, isRestrictionJustificationEnabled, selectedContacts, restrictedEmails } = this.props;
+        const {
+            intl,
+            isRestrictionJustificationEnabled,
+            selectedContacts,
+            restrictedEmails,
+            restrictedGroups,
+        } = this.props;
 
-        const hasRestrictedCollabs = hasRestrictedContacts(selectedContacts, restrictedEmails);
+        const hasRestrictedCollabs = hasRestrictedContacts(selectedContacts, restrictedEmails, restrictedGroups);
         const isMissingRequiredJustification = isRestrictionJustificationEnabled && !selectedJustificationReason;
 
         if (isMissingRequiredJustification) {
@@ -263,13 +272,20 @@ class EmailForm extends React.Component<Props, State> {
 
         const emails = [];
         const groupIDs = [];
+        const restrictedGroups = [];
         const restrictedEmails = [];
 
-        selectedContacts.forEach(({ type, value }) => {
+        selectedContacts.forEach(contact => {
+            const { id, type, value } = contact;
+
             if (type === 'group') {
                 groupIDs.push(value);
+
+                if (this.isRestrictedContact(contact)) {
+                    restrictedGroups.push(id);
+                }
             } else {
-                if (this.isRestrictedEmail(value)) {
+                if (this.isRestrictedContact(contact)) {
                     restrictedEmails.push(value);
                 }
                 emails.push(value);
@@ -282,6 +298,7 @@ class EmailForm extends React.Component<Props, State> {
             justificationReason: selectedJustificationReason,
             message,
             restrictedEmails,
+            restrictedGroups,
         }).catch(error => {
             // Remove sent emails from selected pills
             const invitedEmails = error.invitedEmails || [];
@@ -319,7 +336,7 @@ class EmailForm extends React.Component<Props, State> {
             // Invalid emails are filtered out by ContactsField when parsing
             // new pills, so parsed pills can currently only be invalid
             // when user is restricted by a security policy
-            isValid = !this.isRestrictedEmail(contactPill.value) || hasRequiredJustification;
+            isValid = !this.isRestrictedContact(contactPill) || hasRequiredJustification;
         }
         return isValid;
     };
@@ -328,17 +345,16 @@ class EmailForm extends React.Component<Props, State> {
         const { selectedJustificationReason } = this.state;
         const { isRestrictionJustificationEnabled } = this.props;
 
-        const pillId = String(contactPill.value);
         const hasRequiredJustification = !!selectedJustificationReason && isRestrictionJustificationEnabled;
-        const isWaivedPill = this.isRestrictedEmail(pillId) && hasRequiredJustification;
+        const isWaivedPill = this.isRestrictedContact(contactPill) && hasRequiredJustification;
 
         return isWaivedPill ? 'is-waived' : '';
     };
 
-    isRestrictedEmail = (email?: string) => {
-        const { restrictedEmails } = this.props;
+    isRestrictedContact = (contact: Contact | SelectOptionProp) => {
+        const { restrictedEmails, restrictedGroups } = this.props;
 
-        return restrictedEmails.includes(email);
+        return isRestrictedContact(contact, restrictedEmails, restrictedGroups);
     };
 
     render() {
@@ -366,6 +382,7 @@ class EmailForm extends React.Component<Props, State> {
             onPillCreate,
             recommendedSharingTooltipCalloutName,
             restrictedEmails,
+            restrictedGroups,
             selectedContacts,
             sendButtonProps,
             showEnterEmailsCallout,
@@ -436,7 +453,7 @@ class EmailForm extends React.Component<Props, State> {
 
         const hideMessageSection = config && config.showInviteCollaboratorMessageSection === false;
         const shouldRenderContactRestrictionNotice =
-            isExpanded && hasRestrictedContacts(selectedContacts, restrictedEmails);
+            isExpanded && hasRestrictedContacts(selectedContacts, restrictedEmails, restrictedGroups);
 
         return (
             <form
@@ -457,6 +474,7 @@ class EmailForm extends React.Component<Props, State> {
                         justificationReasons={justificationReasons}
                         onRemoveRestrictedContacts={this.handleRemoveRestrictedContacts}
                         restrictedEmails={restrictedEmails}
+                        restrictedGroups={restrictedGroups}
                         selectedContacts={selectedContacts}
                         selectedJustificationReason={selectedJustificationReason}
                         onSelectJustificationReason={this.handleSelectJustificationReason}

package/src/features/unified-share-modal/UnifiedShareForm.js

@@ -57,6 +57,7 @@ class UnifiedShareForm extends React.Component<USFProps, State> {
         createSharedLinkOnLoad: false,
         focusSharedLinkOnLoad: false,
         restrictedCollabEmails: [],
+        retrictedGroups: [],
         trackingProps: {
             collaboratorListTracking: {},
             inviteCollabsEmailTracking: {},
@@ -85,13 +86,15 @@ class UnifiedShareForm extends React.Component<USFProps, State> {
     }
 
     componentDidUpdate(prevProps: USFProps) {
-        const { isCollabRestrictionJustificationAllowed, item, restrictedCollabEmails } = this.props;
+        const { isCollabRestrictionJustificationAllowed, item, restrictedCollabEmails, restrictedGroups } = this.props;
         const {
+            restrictedGroups: prevRestrictedGroups,
             restrictedCollabEmails: prevRestrictedCollabEmails,
             isCollabRestrictionJustificationAllowed: prevIsCollabRestrictionJustificationAllowed,
         } = prevProps;
 
         const didCollabRestrictionsChange =
+            !isEqual(restrictedGroups, prevRestrictedGroups) ||
             !isEqual(restrictedCollabEmails, prevRestrictedCollabEmails) ||
             isCollabRestrictionJustificationAllowed !== prevIsCollabRestrictionJustificationAllowed;
 
@@ -127,9 +130,13 @@ class UnifiedShareForm extends React.Component<USFProps, State> {
 
     shouldRequireCollabJustification = () => {
         const { inviteCollabsContacts } = this.state;
-        const { isCollabRestrictionJustificationAllowed, restrictedCollabEmails } = this.props;
+        const { isCollabRestrictionJustificationAllowed, restrictedCollabEmails, restrictedGroups } = this.props;
 
-        const hasRestrictedCollabs = hasRestrictedContacts(inviteCollabsContacts, restrictedCollabEmails);
+        const hasRestrictedCollabs = hasRestrictedContacts(
+            inviteCollabsContacts,
+            restrictedCollabEmails,
+            restrictedGroups,
+        );
         return hasRestrictedCollabs && isCollabRestrictionJustificationAllowed;
     };
 
@@ -185,7 +192,7 @@ class UnifiedShareForm extends React.Component<USFProps, State> {
         const { classificationLabelId, inviteePermissionLevel } = this.state;
         const defaultPermissionLevel = getDefaultPermissionLevel(inviteePermissions);
         const selectedPermissionLevel = inviteePermissionLevel || defaultPermissionLevel;
-        const { emails, groupIDs, justificationReason, message, restrictedEmails } = data;
+        const { emails, groupIDs, justificationReason, message, restrictedEmails, restrictedGroups } = data;
 
         let params = {
             emails: emails.join(','),
@@ -197,7 +204,7 @@ class UnifiedShareForm extends React.Component<USFProps, State> {
         };
 
         const hasJustificationReason = !!justificationReason;
-        const hasRestrictedInvitees = !isEmpty(restrictedEmails);
+        const hasRestrictedInvitees = !isEmpty(restrictedEmails) || !isEmpty(restrictedGroups);
         const shouldSubmitJustificationReason =
             hasJustificationReason && hasRestrictedInvitees && isCollabRestrictionJustificationAllowed;
 
@@ -348,10 +355,18 @@ class UnifiedShareForm extends React.Component<USFProps, State> {
         currentInviteCollabsContacts: Array<Contact>,
         newInviteCollabsContacts: Array<Contact>,
     ) => {
-        const { restrictedCollabEmails } = this.props;
+        const { restrictedCollabEmails, restrictedGroups } = this.props;
 
-        const hasRestrictedCollabs = hasRestrictedContacts(currentInviteCollabsContacts, restrictedCollabEmails);
-        const hasRestrictedCollabsAfterUpdate = hasRestrictedContacts(newInviteCollabsContacts, restrictedCollabEmails);
+        const hasRestrictedCollabs = hasRestrictedContacts(
+            currentInviteCollabsContacts,
+            restrictedCollabEmails,
+            restrictedGroups,
+        );
+        const hasRestrictedCollabsAfterUpdate = hasRestrictedContacts(
+            newInviteCollabsContacts,
+            restrictedCollabEmails,
+            restrictedGroups,
+        );
 
         return hasRestrictedCollabs && !hasRestrictedCollabsAfterUpdate;
     };
@@ -413,6 +428,7 @@ class UnifiedShareForm extends React.Component<USFProps, State> {
             item,
             recommendedSharingTooltipCalloutName = null,
             restrictedCollabEmails,
+            restrictedGroups,
             sendInvitesError,
             shouldRenderFTUXTooltip,
             showEnterEmailsCallout = false,
@@ -498,6 +514,7 @@ class UnifiedShareForm extends React.Component<USFProps, State> {
                             openInviteCollaboratorsSection={this.openInviteCollaboratorsSection}
                             recommendedSharingTooltipCalloutName={recommendedSharingTooltipCalloutName}
                             restrictedEmails={restrictedCollabEmails}
+                            restrictedGroups={restrictedGroups}
                             showEnterEmailsCallout={showEnterEmailsCallout}
                             submitting={submitting}
                             selectedContacts={this.state.inviteCollabsContacts}

package/src/features/unified-share-modal/UnifiedShareModal.js

@@ -30,6 +30,7 @@ class UnifiedShareModal extends React.Component<USMProps, State> {
         createSharedLinkOnLoad: false,
         focusSharedLinkOnLoad: false,
         restrictedCollabEmails: [],
+        restrictedGroups: [],
         trackingProps: {
             inviteCollabsEmailTracking: {},
             sharedLinkEmailTracking: {},

package/src/features/unified-share-modal/__tests__/ContactRestrictionNotice.test.js

@@ -12,6 +12,7 @@ describe('features/unified-share-modal/ContactRestrictionNotice', () => {
     let wrapper;
     let selectedContacts;
     let restrictedEmails;
+    let restrictedGroups;
 
     const getWrapper = (props = {}) => {
         return shallow(
@@ -25,6 +26,7 @@ describe('features/unified-share-modal/ContactRestrictionNotice', () => {
                 onRemoveRestrictedContacts={jest.fn()}
                 onSelectJustificationReason={jest.fn()}
                 restrictedEmails={restrictedEmails}
+                restrictedGroups={restrictedGroups}
                 selectedContacts={selectedContacts}
                 selectedJustificationReason={null}
                 {...props}
@@ -36,27 +38,38 @@ describe('features/unified-share-modal/ContactRestrictionNotice', () => {
         selectedContacts = [
             {
                 email: 'x@example.com',
-                id: '12345',
+                id: 12345,
                 text: 'X User',
-                type: 'group',
+                type: 'user',
                 value: 'x@example.com',
             },
             {
                 email: 'y@example.com',
-                id: '23456',
+                id: 23456,
                 text: 'Y User',
                 type: 'user',
                 value: 'y@example.com',
             },
             {
                 email: 'z@example.com',
-                id: '34567',
+                id: 34567,
                 text: 'Z User',
                 type: 'user',
                 value: 'z@example.com',
             },
+            {
+                id: 45678,
+                text: 'Test Group 1',
+                type: 'group',
+            },
+            {
+                id: 56789,
+                text: 'Test Group 2',
+                type: 'group',
+            },
         ];
         restrictedEmails = ['x@example.com', 'y@example.com'];
+        restrictedGroups = [45678, 56789];
 
         wrapper = getWrapper();
     });
@@ -69,7 +82,7 @@ describe('features/unified-share-modal/ContactRestrictionNotice', () => {
         });
 
         test('should render nothing when there are no restricted contacts', () => {
-            wrapper.setProps({ restrictedEmails: [], selectedContacts });
+            wrapper.setProps({ restrictedEmails: [], restrictedGroups: [], selectedContacts });
             expect(wrapper.isEmptyRender()).toBe(true);
 
             wrapper.setProps({ restrictedEmails, selectedContacts: [] });
@@ -94,7 +107,12 @@ describe('features/unified-share-modal/ContactRestrictionNotice', () => {
                 removeButtonMessageId,
             }) => {
                 restrictedEmails = restrictedEmails.slice(0, restrictedContactCount);
-                wrapper.setProps({ collabRestrictionType, isRestrictionJustificationEnabled, restrictedEmails });
+                wrapper.setProps({
+                    collabRestrictionType,
+                    isRestrictionJustificationEnabled,
+                    restrictedEmails,
+                    restrictedGroups: [],
+                });
 
                 const restrictionNoticeMessage = wrapper.find(`FormattedMessage[id="${restrictionNoticeMessageId}"]`);
                 const removeButtonMessage = wrapper.find(`FormattedMessage[id="${removeButtonMessageId}"]`);
@@ -103,6 +121,7 @@ describe('features/unified-share-modal/ContactRestrictionNotice', () => {
                 expect(restrictionNoticeMessage.props().values).toEqual({
                     count: restrictedEmails.length,
                     email: selectedContacts[0].value,
+                    groupName: undefined,
                 });
                 expect(removeButtonMessage).toHaveLength(1);
                 expect(removeButtonMessage.props().values).toEqual({
@@ -111,6 +130,36 @@ describe('features/unified-share-modal/ContactRestrictionNotice', () => {
             },
         );
 
+        test.each`
+            restrictedGroupCount | restrictionNoticeMessageId                                             | removeButtonMessageId
+            ${1}                 | ${messages.contactRestrictionNoticeInformationBarrierSingularGroup.id} | ${messages.contactRestrictionRemoveButtonLabel.id}
+            ${2}                 | ${messages.contactRestrictionNoticeInformationBarrier.id}              | ${messages.contactRestrictionRemoveButtonLabel.id}
+        `(
+            'should select appropriate messages when restricted group count is $restrictedGroupCount',
+            ({ restrictedGroupCount, restrictionNoticeMessageId, removeButtonMessageId }) => {
+                restrictedGroups = restrictedGroups.slice(0, restrictedGroupCount);
+                wrapper.setProps({
+                    collabRestrictionType: COLLAB_RESTRICTION_TYPE_INFORMATION_BARRIER,
+                    restrictedEmails: [],
+                    restrictedGroups,
+                });
+
+                const restrictionNoticeMessage = wrapper.find(`FormattedMessage[id="${restrictionNoticeMessageId}"]`);
+                const removeButtonMessage = wrapper.find(`FormattedMessage[id="${removeButtonMessageId}"]`);
+
+                expect(restrictionNoticeMessage).toHaveLength(1);
+                expect(restrictionNoticeMessage.props().values).toEqual({
+                    count: restrictedGroups.length,
+                    email: undefined,
+                    groupName: selectedContacts[3].text,
+                });
+                expect(removeButtonMessage).toHaveLength(1);
+                expect(removeButtonMessage.props().values).toEqual({
+                    count: restrictedGroups.length,
+                });
+            },
+        );
+
         test('should display error tooltip when error is provided', () => {
             const error = 'error';
 

package/src/features/unified-share-modal/__tests__/EmailForm.test.js

@@ -9,25 +9,30 @@ describe('features/unified-share-modal/EmailForm', () => {
     const expectedContacts = [
         {
             email: 'x@example.com',
-            id: '12345',
+            id: 12345,
             text: 'X User',
-            type: 'group',
+            type: 'user',
             value: 'x@example.com',
         },
         {
             email: 'y@example.com',
-            id: '23456',
+            id: 23456,
             text: 'Y User',
             type: 'user',
             value: 'y@example.com',
         },
         {
             email: 'z@example.com',
-            id: '34567',
+            id: 34567,
             text: 'Z User',
             type: 'user',
             value: 'z@example.com',
         },
+        {
+            id: 45678,
+            text: 'Test Group',
+            type: 'group',
+        },
     ];
     const expectedJustificationReason = { displayText: 'Reason', value: '123' };
 
@@ -43,6 +48,7 @@ describe('features/unified-share-modal/EmailForm', () => {
                 onRequestClose={jest.fn()}
                 onSubmit={jest.fn()}
                 openInviteSection={jest.fn()}
+                restrictedGroups={[]}
                 selectedContacts={[]}
                 showEnterEmailsCallout
                 inlineNotice={{}}
@@ -135,7 +141,31 @@ describe('features/unified-share-modal/EmailForm', () => {
             expect(onContactRemove).toHaveBeenCalledWith(expectedContacts[0]);
             expect(onContactRemove).toHaveBeenCalledWith(expectedContacts[2]);
             expect(updateSelectedContacts).toHaveBeenCalledTimes(1);
-            expect(updateSelectedContacts).toHaveBeenCalledWith([expectedContacts[1]]);
+            expect(updateSelectedContacts).toHaveBeenCalledWith([expectedContacts[1], expectedContacts[3]]);
+        });
+
+        test('should remove all contacts with matches in restrictedEmails or restrictedGroups', () => {
+            const onContactRemove = jest.fn();
+            const updateSelectedContacts = jest.fn();
+            const restrictedGroups = [expectedContacts[3].id, '1111'];
+            const restrictedEmails = [expectedContacts[0].value, 'not_included_in_contacts@example.com'];
+
+            const wrapper = getWrapper({
+                onContactRemove,
+                restrictedEmails,
+                restrictedGroups,
+                selectedContacts: expectedContacts,
+                updateSelectedContacts,
+            });
+
+            wrapper.instance().handleRemoveRestrictedContacts();
+
+            // The two restricted emails that match values in expectedContacts
+            expect(onContactRemove).toHaveBeenCalledTimes(2);
+            expect(onContactRemove).toHaveBeenCalledWith(expectedContacts[0]);
+            expect(onContactRemove).toHaveBeenCalledWith(expectedContacts[3]);
+            expect(updateSelectedContacts).toHaveBeenCalledTimes(1);
+            expect(updateSelectedContacts).toHaveBeenCalledWith([expectedContacts[1], expectedContacts[2]]);
         });
 
         test('should reset contact limit error when contact removal results in a contact count within the limit', () => {
@@ -257,11 +287,12 @@ describe('features/unified-share-modal/EmailForm', () => {
         test('should call sendInvites prop with the correct params', () => {
             const message = 'test message';
             const expectedParam = {
-                emails: ['y@example.com'],
-                groupIDs: ['x@example.com'],
+                emails: ['x@example.com', 'y@example.com'],
+                groupIDs: [],
                 justificationReason: null,
                 message,
                 restrictedEmails: [],
+                restrictedGroups: [],
             };
             const onSubmit = jest.fn().mockReturnValue(Promise.resolve());
             const wrapper = getWrapper({
@@ -290,6 +321,7 @@ describe('features/unified-share-modal/EmailForm', () => {
                     expectedContacts[2].value,
                     'not_included_in_contacts@example.com',
                 ],
+                restrictedGroups: [expectedContacts[3].id],
                 selectedContacts: expectedContacts,
                 isRestrictionJustificationEnabled: true,
             });
@@ -302,24 +334,28 @@ describe('features/unified-share-modal/EmailForm', () => {
                 expect.objectContaining({
                     justificationReason: expectedJustificationReason,
                     restrictedEmails: [expectedContacts[1].value, expectedContacts[2].value],
+                    restrictedGroups: [expectedContacts[3].id],
                 }),
             );
         });
 
         test.each`
-            isRestrictionJustificationEnabled | expectedErrorId                                    | conditionDescription
-            ${true}                           | ${'boxui.unifiedShare.justificationRequiredError'} | ${'justification is allowed but not selected'}
-            ${false}                          | ${'boxui.unifiedShare.restrictedContactsError'}    | ${'justification is not allowed'}
+            isRestrictionJustificationEnabled | restrictedEmails               | restrictedGroups            | expectedErrorId                                    | conditionDescription
+            ${true}                           | ${[expectedContacts[1].value]} | ${[]}                       | ${'boxui.unifiedShare.justificationRequiredError'} | ${'there are restricted emails and justification is allowed but not selected'}
+            ${false}                          | ${[expectedContacts[1].value]} | ${[]}                       | ${'boxui.unifiedShare.restrictedContactsError'}    | ${'there are restricted emails and justification is not allowed'}
+            ${false}                          | ${[]}                          | ${[expectedContacts[3].id]} | ${'boxui.unifiedShare.restrictedContactsError'}    | ${'there are restricted groups and justification is not allowed'}
+            ${false}                          | ${[expectedContacts[1].value]} | ${[expectedContacts[3].id]} | ${'boxui.unifiedShare.restrictedContactsError'}    | ${'there are restricted emails and groups and justification is not allowed'}
         `(
-            'should trigger an error and abort submit action when restricted contacts are present and $conditionDescription',
-            ({ isRestrictionJustificationEnabled, expectedErrorId }) => {
+            'should trigger an error and abort submit action when $conditionDescription',
+            ({ isRestrictionJustificationEnabled, expectedErrorId, restrictedEmails, restrictedGroups }) => {
                 const message = 'test message';
                 const event = { preventDefault: jest.fn() };
                 const onSubmit = jest.fn();
 
                 const wrapper = getWrapper({
                     onSubmit,
-                    restrictedEmails: [expectedContacts[1].value, expectedContacts[2].value],
+                    restrictedEmails,
+                    restrictedGroups,
                     selectedContacts: expectedContacts,
                     isRestrictionJustificationEnabled,
                 });
@@ -335,11 +371,12 @@ describe('features/unified-share-modal/EmailForm', () => {
         test('should handle errors from onSubmit prop', () => {
             const message = 'test message';
             const expectedParam = {
-                emails: [],
-                groupIDs: ['x@example.com'],
+                emails: ['x@example.com'],
+                groupIDs: [],
                 justificationReason: null,
                 message,
                 restrictedEmails: [],
+                restrictedGroups: [],
             };
             const onSubmit = jest.fn().mockReturnValue(
                 // eslint-disable-next-line prefer-promise-reject-errors
@@ -427,18 +464,26 @@ describe('features/unified-share-modal/EmailForm', () => {
 
     describe('validateContactsRestrictions()', () => {
         test.each`
-            isRestrictionJustificationEnabled | restrictedEmails               | selectedJustificationReason    | expectedError
-            ${false}                          | ${[]}                          | ${null}                        | ${''}
-            ${false}                          | ${[]}                          | ${expectedJustificationReason} | ${''}
-            ${true}                           | ${[expectedContacts[0].value]} | ${null}                        | ${'boxui.unifiedShare.justificationRequiredError'}
-            ${true}                           | ${[expectedContacts[0].value]} | ${expectedJustificationReason} | ${''}
-            ${false}                          | ${[]}                          | ${null}                        | ${''}
-            ${false}                          | ${[expectedContacts[0].value]} | ${null}                        | ${'boxui.unifiedShare.restrictedContactsError'}
+            isRestrictionJustificationEnabled | restrictedEmails               | restrictedGroups            | selectedJustificationReason    | expectedError
+            ${false}                          | ${[]}                          | ${[]}                       | ${null}                        | ${''}
+            ${false}                          | ${[]}                          | ${[]}                       | ${expectedJustificationReason} | ${''}
+            ${true}                           | ${[expectedContacts[0].value]} | ${[]}                       | ${null}                        | ${'boxui.unifiedShare.justificationRequiredError'}
+            ${true}                           | ${[expectedContacts[0].value]} | ${[]}                       | ${expectedJustificationReason} | ${''}
+            ${false}                          | ${[]}                          | ${[]}                       | ${null}                        | ${''}
+            ${false}                          | ${[expectedContacts[0].value]} | ${[]}                       | ${null}                        | ${'boxui.unifiedShare.restrictedContactsError'}
+            ${false}                          | ${[]}                          | ${[expectedContacts[3].id]} | ${null}                        | ${'boxui.unifiedShare.restrictedContactsError'}
         `(
-            'should return "$expectedError" when isRestrictionJustificationEnabled is $isRestrictionJustificationEnabled, restrictedEmails is $restrictedEmails and selectedJustificationReason is $selectedJustificationReason',
-            ({ isRestrictionJustificationEnabled, restrictedEmails, selectedJustificationReason, expectedError }) => {
+            'should return "$expectedError" when isRestrictionJustificationEnabled is $isRestrictionJustificationEnabled, restrictedEmails is $restrictedEmails, restrictedGroups is $restrictedGroups and selectedJustificationReason is $selectedJustificationReason',
+            ({
+                isRestrictionJustificationEnabled,
+                restrictedEmails,
+                restrictedGroups,
+                selectedJustificationReason,
+                expectedError,
+            }) => {
                 const wrapper = getWrapper({
                     restrictedEmails,
+                    restrictedGroups,
                     selectedContacts: expectedContacts,
                     isRestrictionJustificationEnabled,
                 });
@@ -516,6 +561,28 @@ describe('features/unified-share-modal/EmailForm', () => {
                 expect(isValidContactPill).toBe(expectedIsValid);
             },
         );
+
+        test.each`
+            isRestrictionJustificationEnabled | selectedJustificationReason    | restrictedGroups            | expectedIsValid
+            ${false}                          | ${null}                        | ${[]}                       | ${true}
+            ${false}                          | ${expectedJustificationReason} | ${[expectedContacts[3].id]} | ${false}
+            ${false}                          | ${null}                        | ${[expectedContacts[3].id]} | ${false}
+            ${true}                           | ${null}                        | ${[expectedContacts[3].id]} | ${false}
+            ${true}                           | ${null}                        | ${[]}                       | ${true}
+            ${true}                           | ${expectedJustificationReason} | ${[expectedContacts[3].id]} | ${true}
+        `(
+            'should have isValidContactPill return $expectedIsValid when isRestrictionJustificationEnabled = $isRestrictionJustificationEnabled, selectedJustificationReason = $selectedJustificationReason and restrictedGroups = $restrictedGroups',
+            ({ isRestrictionJustificationEnabled, selectedJustificationReason, restrictedGroups, expectedIsValid }) => {
+                const wrapper = getWrapper();
+                const contact = expectedContacts[3];
+
+                wrapper.instance().handleSelectJustificationReason(selectedJustificationReason);
+                wrapper.setProps({ restrictedGroups, isRestrictionJustificationEnabled });
+
+                const isValidContactPill = wrapper.instance().isValidContactPill(contact);
+                expect(isValidContactPill).toBe(expectedIsValid);
+            },
+        );
     });
 
     describe('getContactPillClassName()', () => {
@@ -545,6 +612,33 @@ describe('features/unified-share-modal/EmailForm', () => {
                 expect(contactPillClassName).toBe(expectedClassName);
             },
         );
+
+        test.each`
+            isRestrictionJustificationEnabled | selectedJustificationReason    | restrictedGroups            | expectedClassName
+            ${false}                          | ${null}                        | ${[]}                       | ${''}
+            ${false}                          | ${expectedJustificationReason} | ${[expectedContacts[3].id]} | ${''}
+            ${false}                          | ${null}                        | ${[expectedContacts[3].id]} | ${''}
+            ${true}                           | ${null}                        | ${[expectedContacts[3].id]} | ${''}
+            ${true}                           | ${null}                        | ${[]}                       | ${''}
+            ${true}                           | ${expectedJustificationReason} | ${[expectedContacts[3].id]} | ${'is-waived'}
+        `(
+            'should return "$expectedClassName" when isRestrictionJustificationEnabled = $isRestrictionJustificationEnabled, selectedJustificationReason = $selectedJustificationReason and restrictedGroups = $restrictedGroups',
+            ({
+                isRestrictionJustificationEnabled,
+                selectedJustificationReason,
+                restrictedGroups,
+                expectedClassName,
+            }) => {
+                const wrapper = getWrapper();
+                const contact = expectedContacts[3];
+
+                wrapper.instance().handleSelectJustificationReason(selectedJustificationReason);
+                wrapper.setProps({ restrictedGroups, isRestrictionJustificationEnabled });
+
+                const contactPillClassName = wrapper.instance().getContactPillClassName(contact);
+                expect(contactPillClassName).toBe(expectedClassName);
+            },
+        );
     });
 
     describe('componentDidUpdate()', () => {
@@ -718,6 +812,19 @@ describe('features/unified-share-modal/EmailForm', () => {
             );
         });
 
+        test('should render ContactRestrictionNotice  when isExpanded is true and restrictedGroups has matching values in selectedContacts', () => {
+            const restrictedGroups = [expectedContacts[3].id];
+            const selectedContacts = expectedContacts;
+
+            const wrapper = getWrapper({
+                isExpanded: true,
+                restrictedGroups,
+                selectedContacts,
+            });
+
+            expect(wrapper.find('ContactRestrictionNotice')).toHaveLength(1);
+        });
+
         test.each`
             showInviteCollaboratorMessageSection | description
             ${true}                              | ${'show the message section when showInviteCollaboratorMessageSection is true'}