feat(content-sharing): Create sharing service sendInvitations

src/elements/content-sharing/ContentSharingV2.tsx

@@ -53,11 +53,15 @@ function ContentSharingV2({
 
     const { sharingService } = useSharingService({
         api,
+        avatarURLMap,
+        collaborators,
+        currentUserId: currentUser?.id,
         item,
         itemId: itemID,
         itemType,
         sharedLink,
         sharingServiceProps,
+        setCollaborators,
         setItem,
         setSharedLink,
     });
@@ -111,7 +115,10 @@ function ContentSharingV2({
                 id,
                 enterprise: { name: enterprise ? enterprise.name : '' },
             });
-            setSharedLink(prevSharedLink => ({ ...prevSharedLink, serverURL: hostname ? `${hostname}v/` : '' }));
+            setSharingServiceProps(prevSharingServiceProps => ({
+                ...prevSharingServiceProps,
+                serverUrl: hostname ? `${hostname}v/` : '',
+            }));
         };
 
         (async () => {
@@ -136,13 +143,23 @@ function ContentSharingV2({
 
     // Get avatars when collaborators are available
     React.useEffect(() => {
-        if (avatarURLMap || !collaboratorsData || !collaboratorsData.entries) return;
-
+        if (avatarURLMap || !collaboratorsData || !collaboratorsData.entries || !owner.id) return;
         (async () => {
-            const response = await fetchAvatars({ api, itemID, collaborators: collaboratorsData.entries });
+            const ownerEntry = {
+                accessible_by: {
+                    id: owner.id,
+                    login: owner.email,
+                    name: owner.name,
+                },
+            };
+            const response = await fetchAvatars({
+                api,
+                itemID,
+                collaborators: [...collaboratorsData.entries, ownerEntry],
+            });
             setAvatarURLMap(response);
         })();
-    }, [api, avatarURLMap, collaboratorsData, itemID]);
+    }, [api, avatarURLMap, collaboratorsData, itemID, owner]);
 
     React.useEffect(() => {
         if (avatarURLMap && collaboratorsData && currentUser && owner) {

src/elements/content-sharing/SharingNotification.js

@@ -170,42 +170,37 @@ function SharingNotification({
     };
 
     // Generate shared link CRUD functions for the item
-    const {
-        changeSharedLinkAccessLevel,
-        changeSharedLinkPermissionLevel,
-        onAddLink,
-        onRemoveLink,
-        onSubmitSettings,
-    } = useSharedLink(api, itemID, itemType, permissions, accessLevel, {
-        handleUpdateSharedLinkError: () => {
-            createNotification(TYPE_ERROR, contentSharingMessages.sharedLinkUpdateError);
-            setIsLoading(false);
-            closeSettings();
-        },
-        handleUpdateSharedLinkSuccess: itemData => {
-            createNotification(TYPE_INFO, contentSharingMessages.sharedLinkSettingsUpdateSuccess);
-            handleUpdateSharedLinkSuccess(itemData);
-            setIsLoading(false);
-            closeSettings();
-        },
-        handleRemoveSharedLinkError: () => {
-            createNotification(TYPE_ERROR, contentSharingMessages.sharedLinkUpdateError);
-            setIsLoading(false);
-            closeComponent(); // if this function is provided, it will close the modal
-        },
-        handleRemoveSharedLinkSuccess: itemData => {
-            createNotification(TYPE_INFO, contentSharingMessages.sharedLinkRemovalSuccess);
-            handleRemoveSharedLinkSuccess(itemData);
-            setIsLoading(false);
-            closeComponent();
-        },
-        setIsLoading,
-        transformAccess: newAccessLevel => USM_TO_API_ACCESS_LEVEL_MAP[newAccessLevel],
-        transformPermissions: newSharedLinkPermissionLevel =>
-            convertSharedLinkPermissions(newSharedLinkPermissionLevel),
-        transformSettings: (settings, access) =>
-            convertSharedLinkSettings(settings, access, isDownloadAvailable, serverURL),
-    });
+    const { changeSharedLinkAccessLevel, changeSharedLinkPermissionLevel, onAddLink, onRemoveLink, onSubmitSettings } =
+        useSharedLink(api, itemID, itemType, permissions, accessLevel, {
+            handleUpdateSharedLinkError: () => {
+                createNotification(TYPE_ERROR, contentSharingMessages.sharedLinkUpdateError);
+                setIsLoading(false);
+                closeSettings();
+            },
+            handleUpdateSharedLinkSuccess: itemData => {
+                createNotification(TYPE_INFO, contentSharingMessages.sharedLinkSettingsUpdateSuccess);
+                handleUpdateSharedLinkSuccess(itemData);
+                setIsLoading(false);
+                closeSettings();
+            },
+            handleRemoveSharedLinkError: () => {
+                createNotification(TYPE_ERROR, contentSharingMessages.sharedLinkUpdateError);
+                setIsLoading(false);
+                closeComponent(); // if this function is provided, it will close the modal
+            },
+            handleRemoveSharedLinkSuccess: itemData => {
+                createNotification(TYPE_INFO, contentSharingMessages.sharedLinkRemovalSuccess);
+                handleRemoveSharedLinkSuccess(itemData);
+                setIsLoading(false);
+                closeComponent();
+            },
+            setIsLoading,
+            transformAccess: newAccessLevel => USM_TO_API_ACCESS_LEVEL_MAP[newAccessLevel],
+            transformPermissions: newSharedLinkPermissionLevel =>
+                convertSharedLinkPermissions(newSharedLinkPermissionLevel),
+            transformSettings: (settings, access) =>
+                convertSharedLinkSettings(settings, access, isDownloadAvailable, serverURL),
+        });
 
     setChangeSharedLinkAccessLevel(() => changeSharedLinkAccessLevel);
     setChangeSharedLinkPermissionLevel(() => changeSharedLinkPermissionLevel);

src/elements/content-sharing/__tests__/sharingService.test.ts

@@ -162,7 +162,7 @@ describe('elements/content-sharing/sharingService', () => {
                 sharedLinkSettings,
                 undefined, // access
                 undefined, // isDownloadAvailable
-                undefined, // serverURL
+                undefined, // serverUrl
             );
             expect(mockItemApiInstance.updateSharedLink).toHaveBeenCalledWith(
                 options,
@@ -173,7 +173,7 @@ describe('elements/content-sharing/sharingService', () => {
             );
         });
 
-        test('should call updateSharedLink with options including access, isDownloadAvailable, and serverURL', async () => {
+        test('should call updateSharedLink with options including access, isDownloadAvailable, and serverUrl', async () => {
             const mockConvertedSharedLinkSettings = {
                 password: 'test-password',
                 permissions: { can_download: false, can_preview: true },
@@ -191,7 +191,7 @@ describe('elements/content-sharing/sharingService', () => {
                     ...options,
                     access: 'open',
                     isDownloadAvailable: true,
-                    serverURL: 'https://example.com/server-url',
+                    serverUrl: 'https://example.com/server-url',
                 },
             });
 

src/elements/content-sharing/__tests__/useInvites.test.js

@@ -4,6 +4,8 @@ import API from '../../../api';
 
 jest.mock('../../../api');
 
+const mockCollaborators = [{ id: '123', type: 'user', email: 'user@test.com', role: 'editor' }];
+
 describe('useInvites hook', () => {
     let mockApi;
     let mockHandleSuccess;
@@ -93,24 +95,43 @@ describe('useInvites hook', () => {
         expect(mockHandleError).not.toHaveBeenCalled();
     });
 
-    test('processes multiple users and groups in a single call', async () => {
-        const { result } = renderHook(() =>
-            useInvites(mockApi, '123', 'folder', {
-                handleSuccess: mockHandleSuccess,
-                handleError: mockHandleError,
-                transformRequest: mockTransformRequest,
-                transformResponse: mockTransformResponse,
-            }),
-        );
+    describe('when isContentSharingV2Enabled is true', () => {
+        test('processes multiple users and groups in a single call', async () => {
+            const { result } = renderHook(() =>
+                useInvites(mockApi, '123', 'folder', {
+                    collaborators: mockCollaborators,
+                    handleSuccess: mockHandleSuccess,
+                    handleError: mockHandleError,
+                    isContentSharingV2Enabled: true,
+                    transformRequest: mockTransformRequest,
+                    transformResponse: mockTransformResponse,
+                }),
+            );
 
-        act(() => {
-            result.current({
-                users: [{ email: 'user@example.com', role: 'editor' }],
-                groups: [{ id: 'group123', role: 'viewer' }],
+            act(() => {
+                result.current({
+                    users: [{ email: 'user@example.com', role: 'editor' }],
+                    groups: [{ id: 'group123', role: 'viewer' }],
+                });
             });
+
+            expect(mockHandleSuccess).toHaveBeenCalledTimes(2);
+            expect(mockTransformResponse).toHaveBeenCalledTimes(2);
         });
 
-        expect(mockHandleSuccess).toHaveBeenCalledTimes(2);
-        expect(mockTransformResponse).toHaveBeenCalledTimes(2);
+        test('Should early return null if collaborators is not provided', async () => {
+            const { result } = renderHook(() =>
+                useInvites(mockApi, '123', 'folder', {
+                    handleSuccess: mockHandleSuccess,
+                    handleError: mockHandleError,
+                    isContentSharingV2Enabled: true,
+                    transformResponse: mockTransformResponse,
+                }),
+            );
+
+            expect(result.current).toBeNull();
+            expect(mockHandleSuccess).not.toHaveBeenCalled();
+            expect(mockHandleError).not.toHaveBeenCalled();
+        });
     });
 });

src/elements/content-sharing/constants.js

@@ -81,3 +81,6 @@ export const API_TO_USM_CLASSIFICATION_COLORS_MAP = {
 export const ANYONE_WITH_LINK = 'peopleWithTheLink';
 export const ANYONE_IN_COMPANY = 'peopleInYourCompany';
 export const PEOPLE_IN_ITEM = 'peopleInThisItem';
+
+export const COLLAB_USER_TYPE = 'user';
+export const COLLAB_GROUP_TYPE = 'group';