From 9d2d0dac6cc1d86e0dc07cbfb3735a4307e8d7b9 Mon Sep 17 00:00:00 2001 From: reneshen0328 Date: Thu, 8 Jan 2026 07:14:34 -0800 Subject: [PATCH 1/4] fix(content-sharing): Improve content sharing performance --- .../content-sharing/ContentSharing.js | 5 +++-- .../content-sharing/ContentSharingV2.tsx | 10 +++++++--- .../__tests__/ContentSharingV2.test.tsx | 19 +++++++++++++++++++ 3 files changed, 29 insertions(+), 5 deletions(-) diff --git a/src/elements/content-sharing/ContentSharing.js b/src/elements/content-sharing/ContentSharing.js index 5c425753b8..6f1cf396fb 100644 --- a/src/elements/content-sharing/ContentSharing.js +++ b/src/elements/content-sharing/ContentSharing.js @@ -8,6 +8,7 @@ */ import 'regenerator-runtime/runtime'; import * as React from 'react'; +import type { Configuration } from '@box/unified-share-modal'; import API from '../../api'; // $FlowFixMe import { withBlueprintModernization } from '../common/withBlueprintModernization'; @@ -33,7 +34,7 @@ type ContentSharingProps = { /** children - Children for the element to open the Unified Share Modal */ children?: React.Element, /** config - Configuration object that shows/hides features in the USM */ - config?: USMConfig, + config?: USMConfig | Configuration, /** * customButton - Clickable element for opening the SharingModal component. * This property should always be used in conjunction with displayInModal. @@ -121,7 +122,7 @@ function ContentSharing({ api && ( - + {children} diff --git a/src/elements/content-sharing/ContentSharingV2.tsx b/src/elements/content-sharing/ContentSharingV2.tsx index 2f076b0838..5e876d8066 100644 --- a/src/elements/content-sharing/ContentSharingV2.tsx +++ b/src/elements/content-sharing/ContentSharingV2.tsx @@ -3,7 +3,7 @@ import { useIntl } from 'react-intl'; import isEmpty from 'lodash/isEmpty'; import { useNotification } from '@box/blueprint-web'; import { UnifiedShareModal } from '@box/unified-share-modal'; -import type { CollaborationRole, Collaborator, Item, SharedLink, User } from '@box/unified-share-modal'; +import type { CollaborationRole, Collaborator, Configuration, Item, SharedLink, User } from '@box/unified-share-modal'; import API from '../../api'; import { withBlueprintModernization } from '../common/withBlueprintModernization'; @@ -14,6 +14,8 @@ import { convertCollabsResponse, convertItemResponse } from './utils'; import type { Collaborations, ItemType } from '../../common/types/core'; import type { ElementsXhrError } from '../../common/types/api'; + +import type { USMConfig } from '../../features/unified-share-modal/flowTypes'; import type { AvatarURLMap } from './types'; import messages from './messages'; @@ -23,13 +25,15 @@ export interface ContentSharingV2Props { api: API; /** children - Children for the element to open the Unified Share Modal */ children?: React.ReactElement; + /** config - Configuration object for the Unified Share Modal */ + config?: USMConfig | Configuration; /** itemId - Box file or folder ID */ itemId: string; /** itemType - "file" or "folder" */ itemType: ItemType; } -function ContentSharingV2({ api, children, itemId, itemType }: ContentSharingV2Props) { +function ContentSharingV2({ api, children, config: usmConfig = {}, itemId, itemType }: ContentSharingV2Props) { const [avatarUrlMap, setAvatarUrlMap] = React.useState(null); const [item, setItem] = React.useState(null); const [hasError, setHasError] = React.useState(false); @@ -207,7 +211,7 @@ function ContentSharingV2({ api, children, itemId, itemType }: ContentSharingV2P } }, [avatarUrlMap, collaboratorsData, currentUser, owner]); - const config = { sharedLinkEmail: false }; + const config = React.useMemo(() => ({ sharedLinkEmail: false, ...usmConfig }), [usmConfig]); return ( item && ( diff --git a/src/elements/content-sharing/__tests__/ContentSharingV2.test.tsx b/src/elements/content-sharing/__tests__/ContentSharingV2.test.tsx index 23139057cb..429525fbac 100644 --- a/src/elements/content-sharing/__tests__/ContentSharingV2.test.tsx +++ b/src/elements/content-sharing/__tests__/ContentSharingV2.test.tsx @@ -170,6 +170,25 @@ describe('elements/content-sharing/ContentSharingV2', () => { }); }); + test('should render UnifiedShareModal when custom config is provided', async () => { + renderComponent({ config: { collaborationLimit: 3 } }); + await waitFor(() => { + expect(screen.getByRole('heading', { name: /Box Development Guide.pdf/i })).toBeVisible(); + }); + }); + + test('should allow custom config to override default config', async () => { + const apiWithSharedLink = { + ...defaultApiMock, + getFileAPI: jest.fn().mockReturnValue({ getFile: getFileMockWithSharedLink }), + }; + renderComponent({ api: apiWithSharedLink, config: { sharedLinkEmail: true } }); + await waitFor(() => { + expect(screen.getByRole('heading', { name: /Box Development Guide.pdf/i })).toBeVisible(); + expect(screen.getByRole('button', { name: 'Send Shared Link' })).toBeVisible(); + }); + }); + describe('getError function', () => { const createErrorApi = error => ({ ...defaultApiMock, From 97b1e576d5c0588ff87c3bdf31532d6d28a8b1e0 Mon Sep 17 00:00:00 2001 From: reneshen0328 Date: Thu, 8 Jan 2026 07:28:32 -0800 Subject: [PATCH 2/4] fix: import order --- src/elements/content-sharing/ContentSharing.js | 13 ++++++++----- src/elements/content-sharing/ContentSharingV2.tsx | 4 ++-- 2 files changed, 10 insertions(+), 7 deletions(-) diff --git a/src/elements/content-sharing/ContentSharing.js b/src/elements/content-sharing/ContentSharing.js index 6f1cf396fb..0e97d22b3a 100644 --- a/src/elements/content-sharing/ContentSharing.js +++ b/src/elements/content-sharing/ContentSharing.js @@ -8,21 +8,24 @@ */ import 'regenerator-runtime/runtime'; import * as React from 'react'; + import type { Configuration } from '@box/unified-share-modal'; import API from '../../api'; -// $FlowFixMe -import { withBlueprintModernization } from '../common/withBlueprintModernization'; + import { isFeatureEnabled } from '../common/feature-checking'; import Internationalize from '../common/Internationalize'; import Providers from '../common/Providers'; -import SharingModal from './SharingModal'; +// $FlowFixMe +import { withBlueprintModernization } from '../common/withBlueprintModernization'; // $FlowFixMe import ContentSharingV2 from './ContentSharingV2'; -import { CLIENT_NAME_CONTENT_SHARING, CLIENT_VERSION, DEFAULT_HOSTNAME_API } from '../../constants'; +import SharingModal from './SharingModal'; +import type { FeatureConfig } from '../common/feature-checking'; import type { ItemType, StringMap } from '../../common/types/core'; import type { USMConfig } from '../../features/unified-share-modal/flowTypes'; -import type { FeatureConfig } from '../common/feature-checking'; + +import { CLIENT_NAME_CONTENT_SHARING, CLIENT_VERSION, DEFAULT_HOSTNAME_API } from '../../constants'; import '../common/base.scss'; import '../common/fonts.scss'; diff --git a/src/elements/content-sharing/ContentSharingV2.tsx b/src/elements/content-sharing/ContentSharingV2.tsx index 5e876d8066..e6ce456275 100644 --- a/src/elements/content-sharing/ContentSharingV2.tsx +++ b/src/elements/content-sharing/ContentSharingV2.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import { useIntl } from 'react-intl'; import isEmpty from 'lodash/isEmpty'; + import { useNotification } from '@box/blueprint-web'; import { UnifiedShareModal } from '@box/unified-share-modal'; import type { CollaborationRole, Collaborator, Configuration, Item, SharedLink, User } from '@box/unified-share-modal'; @@ -12,9 +13,8 @@ import { CONTENT_SHARING_ERRORS } from './constants'; import { useContactService, useSharingService } from './hooks'; import { convertCollabsResponse, convertItemResponse } from './utils'; -import type { Collaborations, ItemType } from '../../common/types/core'; import type { ElementsXhrError } from '../../common/types/api'; - +import type { Collaborations, ItemType } from '../../common/types/core'; import type { USMConfig } from '../../features/unified-share-modal/flowTypes'; import type { AvatarURLMap } from './types'; From 7bbe8f39b7afe422005738ed2cf82c0a6c2be096 Mon Sep 17 00:00:00 2001 From: reneshen0328 Date: Thu, 8 Jan 2026 10:43:08 -0800 Subject: [PATCH 3/4] fix: restrict type --- src/elements/content-sharing/ContentSharingV2.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/elements/content-sharing/ContentSharingV2.tsx b/src/elements/content-sharing/ContentSharingV2.tsx index e6ce456275..398a1e6ad1 100644 --- a/src/elements/content-sharing/ContentSharingV2.tsx +++ b/src/elements/content-sharing/ContentSharingV2.tsx @@ -15,7 +15,6 @@ import { convertCollabsResponse, convertItemResponse } from './utils'; import type { ElementsXhrError } from '../../common/types/api'; import type { Collaborations, ItemType } from '../../common/types/core'; -import type { USMConfig } from '../../features/unified-share-modal/flowTypes'; import type { AvatarURLMap } from './types'; import messages from './messages'; @@ -26,14 +25,14 @@ export interface ContentSharingV2Props { /** children - Children for the element to open the Unified Share Modal */ children?: React.ReactElement; /** config - Configuration object for the Unified Share Modal */ - config?: USMConfig | Configuration; + config?: Configuration; /** itemId - Box file or folder ID */ itemId: string; /** itemType - "file" or "folder" */ itemType: ItemType; } -function ContentSharingV2({ api, children, config: usmConfig = {}, itemId, itemType }: ContentSharingV2Props) { +function ContentSharingV2({ api, children, config: usmConfig, itemId, itemType }: ContentSharingV2Props) { const [avatarUrlMap, setAvatarUrlMap] = React.useState(null); const [item, setItem] = React.useState(null); const [hasError, setHasError] = React.useState(false); From 509911318f50823512b25308783780ab9b2f1f3f Mon Sep 17 00:00:00 2001 From: reneshen0328 Date: Thu, 8 Jan 2026 11:05:21 -0800 Subject: [PATCH 4/4] fix: test --- .../__tests__/ContentSharingV2.test.tsx | 14 ++++---------- 1 file changed, 4 insertions(+), 10 deletions(-) diff --git a/src/elements/content-sharing/__tests__/ContentSharingV2.test.tsx b/src/elements/content-sharing/__tests__/ContentSharingV2.test.tsx index 429525fbac..58764f671d 100644 --- a/src/elements/content-sharing/__tests__/ContentSharingV2.test.tsx +++ b/src/elements/content-sharing/__tests__/ContentSharingV2.test.tsx @@ -165,16 +165,12 @@ describe('elements/content-sharing/ContentSharingV2', () => { }); renderComponent(); - await waitFor(() => { - expect(screen.getByRole('heading', { name: /Box Development Guide.pdf/i })).toBeVisible(); - }); + expect(await screen.findByRole('heading', { name: 'Share ‘Box Development Guide.pdf’' })).toBeVisible(); }); test('should render UnifiedShareModal when custom config is provided', async () => { renderComponent({ config: { collaborationLimit: 3 } }); - await waitFor(() => { - expect(screen.getByRole('heading', { name: /Box Development Guide.pdf/i })).toBeVisible(); - }); + expect(await screen.findByRole('heading', { name: 'Share ‘Box Development Guide.pdf’' })).toBeVisible(); }); test('should allow custom config to override default config', async () => { @@ -183,10 +179,8 @@ describe('elements/content-sharing/ContentSharingV2', () => { getFileAPI: jest.fn().mockReturnValue({ getFile: getFileMockWithSharedLink }), }; renderComponent({ api: apiWithSharedLink, config: { sharedLinkEmail: true } }); - await waitFor(() => { - expect(screen.getByRole('heading', { name: /Box Development Guide.pdf/i })).toBeVisible(); - expect(screen.getByRole('button', { name: 'Send Shared Link' })).toBeVisible(); - }); + expect(await screen.findByRole('heading', { name: 'Share ‘Box Development Guide.pdf’' })).toBeVisible(); + expect(await screen.findByRole('button', { name: 'Send Shared Link' })).toBeVisible(); }); describe('getError function', () => {