[Calling sounds] Stabilize Calling sounds feature (#3969)

* stabilize sounds * Change files * Duplicate change files for beta release * build beta API * fix breaking change * build API files * update stable API --------- Signed-off-by: Donald McEachern <[email protected]>
Azure · Jan 8, 2024 · 5c5af52 · 5c5af52
1 parent 6640946
commit 5c5af52
Show file tree

Hide file tree

Showing 10 changed files with 75 additions and 20 deletions.
diff --git a/change-beta/@azure-communication-react-c4a56c27-3634-4cef-9aa2-3521b8f9078f.json b/change-beta/@azure-communication-react-c4a56c27-3634-4cef-9aa2-3521b8f9078f.json
@@ -0,0 +1,9 @@
+{
+  "type": "minor",
+  "area": "feature",
+  "workstream": "Calling sounds",
+  "comment": "Stabilize the Calling sounds feature",
+  "packageName": "@azure/communication-react",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}
diff --git a/change/@azure-communication-react-c4a56c27-3634-4cef-9aa2-3521b8f9078f.json b/change/@azure-communication-react-c4a56c27-3634-4cef-9aa2-3521b8f9078f.json
@@ -0,0 +1,9 @@
+{
+  "type": "minor",
+  "area": "feature",
+  "workstream": "Calling sounds",
+  "comment": "Stabilize the Calling sounds feature",
+  "packageName": "@azure/communication-react",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}
diff --git a/common/config/babel/features.js b/common/config/babel/features.js
@@ -101,8 +101,8 @@ module.exports = {
     "gallery-layout-composite",
     // feature for hiding attendee name in the teams meeting
     "hide-attendee-name",
-    // Feature for sounds during different calling events
-    "calling-sounds",
+    // custom branding for the composites
+    "custom-branding",
     // Feature for end of call survey
     'end-of-call-survey',
     // Feature for the DTMF dialer for Teams voice apps
@@ -140,5 +140,7 @@ module.exports = {
     "control-bar-button-injection",
     // rooms
     "rooms",
+    // feature for calling sounds
+    "calling-sounds",
   ]
 }
diff --git a/packages/communication-react/review/beta/communication-react.api.md b/packages/communication-react/review/beta/communication-react.api.md
@@ -636,7 +636,7 @@ export interface CallCompositeStrings {
     blurBackgroundEffectButtonLabel?: string;
     blurBackgroundTooltip?: string;
     callRejectedMoreDetails?: string;
-    callRejectedTitle: string;
+    callRejectedTitle?: string;
     callTimeoutDetails?: string;
     callTimeoutTitle?: string;
     cameraLabel: string;
@@ -857,7 +857,7 @@ export type CallingHandlersOptions = {
 // @public
 export type CallingReturnProps<Component extends (props: any) => JSX.Element> = GetCallingSelector<Component> extends (state: CallClientState, props: any) => any ? ReturnType<GetCallingSelector<Component>> & Common<CallingHandlers, Parameters<Component>[0]> : never;
 
-// @beta
+// @public
 export type CallingSounds = {
     callEnded?: SoundEffect;
     callRinging?: SoundEffect;
@@ -3786,7 +3786,7 @@ export interface SitePermissionsStyles extends BaseCustomStyles {
     troubleshootingLink?: ILinkStyles;
 }
 
-// @beta
+// @public
 export type SoundEffect = {
     url: string;
 };

diff --git a/packages/communication-react/review/stable/communication-react.api.md b/packages/communication-react/review/stable/communication-react.api.md
@@ -252,6 +252,7 @@ export type CallAdapterClientState = {
     userId: CommunicationIdentifierKind;
     displayName?: string;
     call?: CallState;
+    targetCallees?: CommunicationIdentifier[];
     devices: DeviceManagerState;
     endedCall?: CallState;
     isTeamsCall: boolean;
@@ -261,6 +262,7 @@ export type CallAdapterClientState = {
     videoBackgroundImages?: VideoBackgroundImage[];
     onResolveVideoEffectDependency?: () => Promise<VideoBackgroundEffectsDependency>;
     selectedVideoBackgroundEffect?: VideoBackgroundEffect;
+    sounds?: CallingSounds;
 };
 
 // @public
@@ -426,6 +428,7 @@ export type CallCompositeIcons = {
     NoticePageJoinCallFailedDueToNoNetwork?: JSX.Element;
     NoticePageLeftCall?: JSX.Element;
     NoticePageRemovedFromCall?: JSX.Element;
+    NoticePageCallRejected?: JSX.Element;
     NoticePageNotInvitedToRoom?: JSX.Element;
     NoticePageRoomNotFound?: JSX.Element;
     NoticePageRoomNotValid?: JSX.Element;
@@ -477,6 +480,8 @@ export interface CallCompositeProps extends BaseCompositeProps<CallCompositeIcon
 export interface CallCompositeStrings {
     blurBackgroundEffectButtonLabel?: string;
     blurBackgroundTooltip?: string;
+    callRejectedMoreDetails?: string;
+    callRejectedTitle?: string;
     callTimeoutDetails?: string;
     callTimeoutTitle?: string;
     cameraLabel: string;
@@ -649,6 +654,13 @@ export type CallingHandlersOptions = {
 // @public
 export type CallingReturnProps<Component extends (props: any) => JSX.Element> = GetCallingSelector<Component> extends (state: CallClientState, props: any) => any ? ReturnType<GetCallingSelector<Component>> & Common<CallingHandlers, Parameters<Component>[0]> : never;
 
+// @public
+export type CallingSounds = {
+    callEnded?: SoundEffect;
+    callRinging?: SoundEffect;
+    callBusy?: SoundEffect;
+};
+
 // @public
 export interface CallingTheme {
     // (undocumented)
@@ -1467,6 +1479,7 @@ export type CommonCallAdapterOptions = {
         videoBackgroundImages?: VideoBackgroundImage[];
         onResolveDependency?: () => Promise<VideoBackgroundEffectsDependency>;
     };
+    callingSounds?: CallingSounds;
 };
 
 // @public
@@ -2022,6 +2035,7 @@ export const DEFAULT_COMPOSITE_ICONS: {
     NoticePageJoinCallFailedDueToNoNetwork?: JSX.Element | undefined;
     NoticePageLeftCall?: JSX.Element | undefined;
     NoticePageRemovedFromCall?: JSX.Element | undefined;
+    NoticePageCallRejected?: JSX.Element | undefined;
     NoticePageNotInvitedToRoom?: JSX.Element | undefined;
     NoticePageRoomNotFound?: JSX.Element | undefined;
     NoticePageRoomNotValid?: JSX.Element | undefined;
@@ -3034,6 +3048,11 @@ export interface SendBoxStylesProps extends BaseCustomStyles {
     textFieldContainer?: IStyle;
 }
 
+// @public
+export type SoundEffect = {
+    url: string;
+};
+
 // @public
 export interface SpokenLanguageStrings {
     // (undocumented)

diff --git a/packages/react-composites/review/beta/react-composites.api.md b/packages/react-composites/review/beta/react-composites.api.md
@@ -454,7 +454,7 @@ export interface CallCompositeStrings {
     blurBackgroundEffectButtonLabel?: string;
     blurBackgroundTooltip?: string;
     callRejectedMoreDetails?: string;
-    callRejectedTitle: string;
+    callRejectedTitle?: string;
     callTimeoutDetails?: string;
     callTimeoutTitle?: string;
     cameraLabel: string;
@@ -635,7 +635,7 @@ export type CallIdChangedListener = (event: {
     callId: string;
 }) => void;
 
-// @beta
+// @public
 export type CallingSounds = {
     callEnded?: SoundEffect;
     callRinging?: SoundEffect;
@@ -1848,7 +1848,7 @@ export interface RemoteVideoTileMenuOptions {
     isHidden?: boolean;
 }
 
-// @beta
+// @public
 export type SoundEffect = {
     url: string;
 };

diff --git a/packages/react-composites/review/stable/react-composites.api.md b/packages/react-composites/review/stable/react-composites.api.md
@@ -20,6 +20,7 @@ import type { ChatMessage } from '@azure/communication-chat';
 import { ChatParticipant } from '@azure/communication-chat';
 import { ChatThreadClient } from '@azure/communication-chat';
 import { ChatThreadClientState } from '@internal/chat-stateful-client';
+import { CommunicationIdentifier } from '@azure/communication-common';
 import { CommunicationIdentifierKind } from '@azure/communication-common';
 import { CommunicationParticipant } from '@internal/react-components';
 import { CommunicationTokenCredential } from '@azure/communication-common';
@@ -201,6 +202,7 @@ export type CallAdapterClientState = {
     userId: CommunicationIdentifierKind;
     displayName?: string;
     call?: CallState;
+    targetCallees?: CommunicationIdentifier[];
     devices: DeviceManagerState;
     endedCall?: CallState;
     isTeamsCall: boolean;
@@ -210,6 +212,7 @@ export type CallAdapterClientState = {
     videoBackgroundImages?: VideoBackgroundImage[];
     onResolveVideoEffectDependency?: () => Promise<VideoBackgroundEffectsDependency>;
     selectedVideoBackgroundEffect?: VideoBackgroundEffect;
+    sounds?: CallingSounds;
 };
 
 // @public
@@ -328,6 +331,7 @@ export type CallCompositeIcons = {
     NoticePageJoinCallFailedDueToNoNetwork?: JSX.Element;
     NoticePageLeftCall?: JSX.Element;
     NoticePageRemovedFromCall?: JSX.Element;
+    NoticePageCallRejected?: JSX.Element;
     NoticePageNotInvitedToRoom?: JSX.Element;
     NoticePageRoomNotFound?: JSX.Element;
     NoticePageRoomNotValid?: JSX.Element;
@@ -379,6 +383,8 @@ export interface CallCompositeProps extends BaseCompositeProps<CallCompositeIcon
 export interface CallCompositeStrings {
     blurBackgroundEffectButtonLabel?: string;
     blurBackgroundTooltip?: string;
+    callRejectedMoreDetails?: string;
+    callRejectedTitle?: string;
     callTimeoutDetails?: string;
     callTimeoutTitle?: string;
     cameraLabel: string;
@@ -511,6 +517,13 @@ export type CallIdChangedListener = (event: {
     callId: string;
 }) => void;
 
+// @public
+export type CallingSounds = {
+    callEnded?: SoundEffect;
+    callRinging?: SoundEffect;
+    callBusy?: SoundEffect;
+};
+
 // @public
 export interface CallWithChatAdapter extends CallWithChatAdapterManagement, AdapterState<CallWithChatAdapterState>, Disposable_2, CallWithChatAdapterSubscriptions {
 }
@@ -964,6 +977,7 @@ export type CommonCallAdapterOptions = {
         videoBackgroundImages?: VideoBackgroundImage[];
         onResolveDependency?: () => Promise<VideoBackgroundEffectsDependency>;
     };
+    callingSounds?: CallingSounds;
 };
 
 // @public
@@ -1191,6 +1205,7 @@ export const DEFAULT_COMPOSITE_ICONS: {
     NoticePageJoinCallFailedDueToNoNetwork?: JSX.Element | undefined;
     NoticePageLeftCall?: JSX.Element | undefined;
     NoticePageRemovedFromCall?: JSX.Element | undefined;
+    NoticePageCallRejected?: JSX.Element | undefined;
     NoticePageNotInvitedToRoom?: JSX.Element | undefined;
     NoticePageRoomNotFound?: JSX.Element | undefined;
     NoticePageRoomNotValid?: JSX.Element | undefined;
@@ -1506,6 +1521,11 @@ export interface RemoteVideoTileMenuOptions {
     isHidden?: boolean;
 }
 
+// @public
+export type SoundEffect = {
+    url: string;
+};
+
 // @public
 export type TeamsAdapterOptions = CommonCallAdapterOptions;
 

diff --git a/packages/react-composites/src/composites/CallComposite/Strings.tsx b/packages/react-composites/src/composites/CallComposite/Strings.tsx
@@ -749,7 +749,7 @@ export interface CallCompositeStrings {
   /**
    * String for title when the call is rejected by the callee
    */
-  callRejectedTitle: string;
+  callRejectedTitle?: string;
   /* @conditional-compile-remove(calling-sounds) */
   /**
    * String for more details when the call is rejected by the callee

diff --git a/...act-composites/src/composites/CallComposite/adapter/AzureCommunicationCallAdapter.test.ts b/...act-composites/src/composites/CallComposite/adapter/AzureCommunicationCallAdapter.test.ts
@@ -19,7 +19,7 @@ describe('Adapter is created as expected', () => {
     const mockCallClient = new MockCallClient() as unknown as StatefulCallClient;
 
     const mockCallAgent = new MockCallAgent();
-    const locator = { participantIds: ['some user id'] };
+    const locator = { groupId: 'some group id' };
 
     const adapter = await createAzureCommunicationCallAdapterFromClient(mockCallClient, mockCallAgent, locator);
     expect(adapter).toBeDefined();
@@ -30,7 +30,7 @@ describe('Adapter is created as expected', () => {
     const mockCallClient = new MockCallClient() as unknown as StatefulCallClient;
 
     const mockCallAgent = new MockCallAgent();
-    const locator = { participantIds: ['some user id'] };
+    const locator = { groupId: 'some group id' };
     const options: CommonCallAdapterOptions = {
       callingSounds: {
         callEnded: { url: 'test/url/ended' },
@@ -59,7 +59,7 @@ describe('Adapter is created as expected', () => {
     const mockCallClient = new MockCallClient() as unknown as StatefulCallClient;
 
     const mockCallAgent = new MockCallAgent();
-    const locator = { participantIds: ['some user id'] };
+    const locator = { groupId: 'some group id' };
     const options: CommonCallAdapterOptions = {
       callingSounds: {
         callEnded: { url: 'test/url/ended' }

diff --git a/packages/react-composites/src/composites/CallComposite/adapter/CallAdapter.ts b/packages/react-composites/src/composites/CallComposite/adapter/CallAdapter.ts
@@ -31,13 +31,9 @@ import { CreateVideoStreamViewResult, VideoStreamOptions } from '@internal/react
 import type { CommunicationIdentifierKind } from '@azure/communication-common';
 /* @conditional-compile-remove(PSTN-calls) */
 import { AddPhoneNumberOptions, DtmfTone } from '@azure/communication-calling';
-
+import { CommunicationIdentifier } from '@azure/communication-common';
 /* @conditional-compile-remove(PSTN-calls) */
-import type {
-  CommunicationIdentifier,
-  CommunicationUserIdentifier,
-  PhoneNumberIdentifier
-} from '@azure/communication-common';
+import type { CommunicationUserIdentifier, PhoneNumberIdentifier } from '@azure/communication-common';
 import type { AdapterState, Disposable, AdapterError, AdapterErrors } from '../../common/adapters';
 /* @conditional-compile-remove(video-background-effects) */
 import { VideoBackgroundEffectsDependency } from '@internal/calling-component-bindings';
@@ -285,7 +281,7 @@ export interface VideoBackgroundImage {
 }
 
 /**
- * @beta
+ * @public
  * Type for representing a custom sound to use for a calling event
  */
 export type SoundEffect = {
@@ -296,7 +292,7 @@ export type SoundEffect = {
 };
 
 /**
- * @beta
+ * @public
  * Type for representing a set of sounds to use for different calling events
  */
 export type CallingSounds = {