diff --git a/change/@internal-react-composites-fc54afea-88af-4bfd-b28f-43533ecefd56.json b/change/@internal-react-composites-fc54afea-88af-4bfd-b28f-43533ecefd56.json new file mode 100644 index 00000000000..0f5a84f1c03 --- /dev/null +++ b/change/@internal-react-composites-fc54afea-88af-4bfd-b28f-43533ecefd56.json @@ -0,0 +1,7 @@ +{ + "type": "prerelease", + "comment": "Update createAzureCommunicationChatAdapter constructor to take in a named object instead of seperate args", + "packageName": "@internal/react-composites", + "email": "2684369+JamesBurnside@users.noreply.github.com", + "dependentChangeType": "patch" +} diff --git a/packages/communication-react/review/communication-react.api.md b/packages/communication-react/review/communication-react.api.md index 7275e8e6212..98a5bd1a5a3 100644 --- a/packages/communication-react/review/communication-react.api.md +++ b/packages/communication-react/review/communication-react.api.md @@ -180,6 +180,15 @@ export type AzureCommunicationCallAdapterArgs = { callClientOptions?: CallClientOptions; }; +// @public (undocumented) +export type AzureCommunicationChatAdapterArgs = { + endpointUrl: string; + userId: CommunicationIdentifierKind; + displayName: string; + credential: CommunicationTokenCredential; + threadId: string; +}; + // @public export interface BaseCustomStylesProps { root?: IStyle; @@ -751,7 +760,7 @@ export interface ControlBarProps { export const createAzureCommunicationCallAdapter: ({ userId, displayName, credential, locator, callClientOptions }: AzureCommunicationCallAdapterArgs) => Promise; // @public (undocumented) -export const createAzureCommunicationChatAdapter: (endpointUrl: string, userId: CommunicationIdentifierKind, displayName: string, credential: CommunicationTokenCredential, threadId: string) => Promise; +export const createAzureCommunicationChatAdapter: ({ endpointUrl, userId, displayName, credential, threadId }: AzureCommunicationChatAdapterArgs) => Promise; // @public (undocumented) export const createDefaultCallingHandlers: (callClient: StatefulCallClient, callAgent: CallAgent | undefined, deviceManager: StatefulDeviceManager | undefined, call: Call | undefined) => { diff --git a/packages/react-composites/review/react-composites.api.md b/packages/react-composites/review/react-composites.api.md index b6dbbe00eef..25e29e24d11 100644 --- a/packages/react-composites/review/react-composites.api.md +++ b/packages/react-composites/review/react-composites.api.md @@ -141,6 +141,15 @@ export type AzureCommunicationCallAdapterArgs = { callClientOptions?: CallClientOptions; }; +// @public (undocumented) +export type AzureCommunicationChatAdapterArgs = { + endpointUrl: string; + userId: CommunicationIdentifierKind; + displayName: string; + credential: CommunicationTokenCredential; + threadId: string; +}; + // @public (undocumented) export interface CallAdapter { // (undocumented) @@ -387,7 +396,7 @@ export type ChatUIState = { export const createAzureCommunicationCallAdapter: ({ userId, displayName, credential, locator, callClientOptions }: AzureCommunicationCallAdapterArgs) => Promise; // @public (undocumented) -export const createAzureCommunicationChatAdapter: (endpointUrl: string, userId: CommunicationIdentifierKind, displayName: string, credential: CommunicationTokenCredential, threadId: string) => Promise; +export const createAzureCommunicationChatAdapter: ({ endpointUrl, userId, displayName, credential, threadId }: AzureCommunicationChatAdapterArgs) => Promise; // @public (undocumented) export type DisplayNameChangedListener = (event: { diff --git a/packages/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.test.ts b/packages/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.test.ts index ba477076872..67c5b461c7b 100644 --- a/packages/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.test.ts +++ b/packages/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.test.ts @@ -147,13 +147,13 @@ export const createChatAdapterWithStubs = async (chatClient: StubChatClient): Pr // Nothing to dispose in the stub. } }; - return await createAzureCommunicationChatAdapter( - 'stubEndointUrl', - { kind: 'communicationUser', communicationUserId: 'stubUserId' }, - 'stubDisplayName', - stubCredential, - 'stubThreadId' - ); + return await createAzureCommunicationChatAdapter({ + endpointUrl: 'stubEndpointUrl', + userId: { kind: 'communicationUser', communicationUserId: 'stubUserId' }, + displayName: 'stubDisplayName', + credential: stubCredential, + threadId: 'stubThreadId' + }); }; class StateChangeListener { diff --git a/packages/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.ts b/packages/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.ts index d990f5da12b..27bed6d0bb7 100644 --- a/packages/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.ts +++ b/packages/react-composites/src/composites/ChatComposite/adapter/AzureCommunicationChatAdapter.ts @@ -297,13 +297,21 @@ const convertEventToChatMessage = (event: ChatMessageReceivedEvent): ChatMessage }; }; -export const createAzureCommunicationChatAdapter = async ( - endpointUrl: string, - userId: CommunicationIdentifierKind, - displayName: string, - credential: CommunicationTokenCredential, - threadId: string -): Promise => { +export type AzureCommunicationChatAdapterArgs = { + endpointUrl: string; + userId: CommunicationIdentifierKind; + displayName: string; + credential: CommunicationTokenCredential; + threadId: string; +}; + +export const createAzureCommunicationChatAdapter = async ({ + endpointUrl, + userId, + displayName, + credential, + threadId +}: AzureCommunicationChatAdapterArgs): Promise => { const chatClient = createStatefulChatClient({ userId: userId, displayName, diff --git a/packages/react-composites/src/composites/ChatComposite/index.ts b/packages/react-composites/src/composites/ChatComposite/index.ts index aae585db4ff..cf0c9172f52 100644 --- a/packages/react-composites/src/composites/ChatComposite/index.ts +++ b/packages/react-composites/src/composites/ChatComposite/index.ts @@ -2,9 +2,9 @@ // Licensed under the MIT license. export { createAzureCommunicationChatAdapter } from './adapter/AzureCommunicationChatAdapter'; +export type { AzureCommunicationChatAdapterArgs } from './adapter/AzureCommunicationChatAdapter'; export { ChatComposite } from './ChatComposite'; - export type { ChatCompositeProps, ChatOptions } from './ChatComposite'; export type { diff --git a/packages/react-composites/tests/browser/chat/app/index.tsx b/packages/react-composites/tests/browser/chat/app/index.tsx index b56999a6a0f..133f26eb4ea 100644 --- a/packages/react-composites/tests/browser/chat/app/index.tsx +++ b/packages/react-composites/tests/browser/chat/app/index.tsx @@ -24,13 +24,13 @@ function App(): JSX.Element { useEffect(() => { const initialize = async (): Promise => { setChatAdapter( - await createAzureCommunicationChatAdapter( + await createAzureCommunicationChatAdapter({ endpointUrl, - { kind: 'communicationUser', communicationUserId: userId }, + userId: { kind: 'communicationUser', communicationUserId: userId }, displayName, - new AzureCommunicationTokenCredential(token), + credential: new AzureCommunicationTokenCredential(token), threadId - ) + }) ); }; diff --git a/packages/storybook/stories/ChatComposite/CustomBehaviorExampleContainer.tsx b/packages/storybook/stories/ChatComposite/CustomBehaviorExampleContainer.tsx index 36d33ec4187..f9e98d36053 100644 --- a/packages/storybook/stories/ChatComposite/CustomBehaviorExampleContainer.tsx +++ b/packages/storybook/stories/ChatComposite/CustomBehaviorExampleContainer.tsx @@ -27,13 +27,13 @@ export const ContosoChatContainer = (props: ContainerProps): JSX.Element => { } const createAdapter = async (): Promise => { - const newAdapter = await createAzureCommunicationChatAdapter( - props.endpointUrl, - getIdentifierKind(props.userId), - props.displayName, - new AzureCommunicationTokenCredential(props.token), - props.threadId - ); + const newAdapter = await createAzureCommunicationChatAdapter({ + endpointUrl: props.endpointUrl, + userId: getIdentifierKind(props.userId), + displayName: props.displayName, + credential: new AzureCommunicationTokenCredential(props.token), + threadId: props.threadId + }); // Custom behavior: Intercept messages from the local user and convert // to uppercase before sending to backend. diff --git a/packages/storybook/stories/ChatComposite/snippets/Container.snippet.tsx b/packages/storybook/stories/ChatComposite/snippets/Container.snippet.tsx index bffc876aa01..88300c6d256 100644 --- a/packages/storybook/stories/ChatComposite/snippets/Container.snippet.tsx +++ b/packages/storybook/stories/ChatComposite/snippets/Container.snippet.tsx @@ -36,13 +36,13 @@ export const ContosoChatContainer = (props: ContainerProps): JSX.Element => { if (!!credential && props) { const createAdapter = async (credential: AzureCommunicationTokenCredential): Promise => { setAdapter( - await createAzureCommunicationChatAdapter( - props.endpointUrl, - getIdentifierKind(props.userId), - props.displayName, + await createAzureCommunicationChatAdapter({ + endpointUrl: props.endpointUrl, + userId: getIdentifierKind(props.userId), + displayName: props.displayName, credential, - props.threadId - ) + threadId: props.threadId + }) ); }; createAdapter(credential); diff --git a/packages/storybook/stories/ChatComposite/snippets/CustomDataModelExampleContainer.snippet.tsx b/packages/storybook/stories/ChatComposite/snippets/CustomDataModelExampleContainer.snippet.tsx index 07072f479d3..9bb108344e9 100644 --- a/packages/storybook/stories/ChatComposite/snippets/CustomDataModelExampleContainer.snippet.tsx +++ b/packages/storybook/stories/ChatComposite/snippets/CustomDataModelExampleContainer.snippet.tsx @@ -25,14 +25,14 @@ export const CustomDataModelExampleContainer = (props: CustomDataModelExampleCon if (props) { const createAdapter = async (): Promise => { setAdapter( - await createAzureCommunicationChatAdapter( - props.endpointUrl, - getIdentifierKind(props.userId), + await createAzureCommunicationChatAdapter({ + endpointUrl: props.endpointUrl, + userId: getIdentifierKind(props.userId), // Data model injection: The display name for the local user comes from Contoso's data model. - props.displayName, - new AzureCommunicationTokenCredential(props.token), - props.threadId - ) + displayName: props.displayName, + credential: new AzureCommunicationTokenCredential(props.token), + threadId: props.threadId + }) ); }; createAdapter(); diff --git a/packages/storybook/stories/ChatComposite/snippets/CustomizeBehavior.snippet.tsx b/packages/storybook/stories/ChatComposite/snippets/CustomizeBehavior.snippet.tsx index e758a42a157..5807e7675b4 100644 --- a/packages/storybook/stories/ChatComposite/snippets/CustomizeBehavior.snippet.tsx +++ b/packages/storybook/stories/ChatComposite/snippets/CustomizeBehavior.snippet.tsx @@ -21,13 +21,13 @@ export const ContosoChatContainer = (props: ContainerProps): JSX.Element => { if (!props) return; const createAdapter = async (): Promise => { - const chatAdapter = await createAzureCommunicationChatAdapter( - props.endpointUrl, - getIdentifierKind(props.userId), - props.displayName, - new AzureCommunicationTokenCredential(props.token), - props.threadId - ); + const chatAdapter = await createAzureCommunicationChatAdapter({ + endpointUrl: props.endpointUrl, + userId: getIdentifierKind(props.userId), + displayName: props.displayName, + credential: new AzureCommunicationTokenCredential(props.token), + threadId: props.threadId + }); // Custom behavior: Intercept messages from the local user and convert // to uppercase before sending to backend. diff --git a/packages/storybook/stories/MeetingComposite/snippets/Meeting.snippet.tsx b/packages/storybook/stories/MeetingComposite/snippets/Meeting.snippet.tsx index ffce2d18593..1d6140dcee7 100644 --- a/packages/storybook/stories/MeetingComposite/snippets/Meeting.snippet.tsx +++ b/packages/storybook/stories/MeetingComposite/snippets/Meeting.snippet.tsx @@ -55,13 +55,13 @@ export const MeetingExperience = (props: MeetingExampleProps): JSX.Element => { ); setChatAdapter( - await createAzureCommunicationChatAdapter( - props.endpointUrl, - { kind: 'communicationUser', communicationUserId: props.userId.communicationUserId }, - props.displayName, + await createAzureCommunicationChatAdapter({ + endpointUrl: props.endpointUrl, + userId: { kind: 'communicationUser', communicationUserId: props.userId.communicationUserId }, + displayName: props.displayName, credential, - props.threadId - ) + threadId: props.threadId + }) ); }; createAdapters(); diff --git a/packages/storybook/stories/QuickStarts/snippets/QuickstartCompositeAdapter.snippet.tsx b/packages/storybook/stories/QuickStarts/snippets/QuickstartCompositeAdapter.snippet.tsx index 681e451a70f..67b9a341cde 100644 --- a/packages/storybook/stories/QuickStarts/snippets/QuickstartCompositeAdapter.snippet.tsx +++ b/packages/storybook/stories/QuickStarts/snippets/QuickstartCompositeAdapter.snippet.tsx @@ -36,13 +36,13 @@ function App(): JSX.Element { if (credential !== undefined) { const createAdapter = async (credential: AzureCommunicationTokenCredential): Promise => { setChatAdapter( - await createAzureCommunicationChatAdapter( + await createAzureCommunicationChatAdapter({ endpointUrl, - { kind: 'communicationUser', communicationUserId: userId }, + userId: { kind: 'communicationUser', communicationUserId: userId }, displayName, credential, threadId - ) + }) ); setCallAdapter( await createAzureCommunicationCallAdapter({ diff --git a/packages/storybook/stories/QuickStarts/snippets/QuickstartCompositeComplete.snippet.tsx b/packages/storybook/stories/QuickStarts/snippets/QuickstartCompositeComplete.snippet.tsx index 30be20b9739..fccc3644a92 100644 --- a/packages/storybook/stories/QuickStarts/snippets/QuickstartCompositeComplete.snippet.tsx +++ b/packages/storybook/stories/QuickStarts/snippets/QuickstartCompositeComplete.snippet.tsx @@ -37,13 +37,13 @@ function App(): JSX.Element { useEffect(() => { const createAdapter = async (): Promise => { setChatAdapter( - await createAzureCommunicationChatAdapter( + await createAzureCommunicationChatAdapter({ endpointUrl, - { kind: 'communicationUser', communicationUserId: userId }, + userId: { kind: 'communicationUser', communicationUserId: userId }, displayName, - new AzureCommunicationTokenCredential(token), + credential: new AzureCommunicationTokenCredential(token), threadId - ) + }) ); setCallAdapter( await createAzureCommunicationCallAdapter({ diff --git a/packages/storybook/stories/Stateful Client/snippets/ChatAdapterExample.snippet.tsx b/packages/storybook/stories/Stateful Client/snippets/ChatAdapterExample.snippet.tsx index a11f9d53afa..aa65fcbf315 100644 --- a/packages/storybook/stories/Stateful Client/snippets/ChatAdapterExample.snippet.tsx +++ b/packages/storybook/stories/Stateful Client/snippets/ChatAdapterExample.snippet.tsx @@ -20,13 +20,13 @@ export const ChatAdapterExample = (props: ChatAdapterExampleProps): JSX.Element if (props) { const createAdapter = async (): Promise => { setChatAdapter( - await createAzureCommunicationChatAdapter( - props.endpointUrl, - getIdentifierKind(props.userId), - props.displayName, - new AzureCommunicationTokenCredential(props.accessToken), - props.threadId - ) + await createAzureCommunicationChatAdapter({ + endpointUrl: props.endpointUrl, + userId: getIdentifierKind(props.userId), + displayName: props.displayName, + credential: new AzureCommunicationTokenCredential(props.accessToken), + threadId: props.threadId + }) ); }; createAdapter(); diff --git a/packages/storybook/stories/snippets/localization/LocalizedComposites.snippet.tsx b/packages/storybook/stories/snippets/localization/LocalizedComposites.snippet.tsx index 75147047ba4..d1b9b3c416f 100644 --- a/packages/storybook/stories/snippets/localization/LocalizedComposites.snippet.tsx +++ b/packages/storybook/stories/snippets/localization/LocalizedComposites.snippet.tsx @@ -38,13 +38,13 @@ function App(): JSX.Element { useEffect(() => { const createAdapter = async (): Promise => { setChatAdapter( - await createAzureCommunicationChatAdapter( + await createAzureCommunicationChatAdapter({ endpointUrl, - { kind: 'communicationUser', communicationUserId: userId }, + userId: { kind: 'communicationUser', communicationUserId: userId }, displayName, - new AzureCommunicationTokenCredential(token), + credential: new AzureCommunicationTokenCredential(token), threadId - ) + }) ); setCallAdapter( await createAzureCommunicationCallAdapter({ diff --git a/samples/StaticHtmlComposites/src/chatComposite.js b/samples/StaticHtmlComposites/src/chatComposite.js index 303b3d7404c..0d0f793e3cf 100644 --- a/samples/StaticHtmlComposites/src/chatComposite.js +++ b/samples/StaticHtmlComposites/src/chatComposite.js @@ -8,13 +8,13 @@ import { ChatComposite, createAzureCommunicationChatAdapter } from '@azure/commu export const loadChatComposite = async function (args, htmlElement) { const { userId, token, endpointUrl, threadId, displayName } = args; - const adapter = await createAzureCommunicationChatAdapter( + const adapter = await createAzureCommunicationChatAdapter({ endpointUrl, userId, - displayName ?? 'anonymous', - new AzureCommunicationTokenCredential(token), + displayName: displayName ?? 'anonymous', + credential: new AzureCommunicationTokenCredential(token), threadId - ); + }); ReactDOM.render(React.createElement(ChatComposite, { adapter }, null), htmlElement); return adapter; };