Check capability to see if set caption language should be shown for teams meeting

change-beta/@azure-communication-react-97b50445-5043-4899-813b-5a9f875bd509.json

@@ -0,0 +1,9 @@
+{
+  "type": "patch",
+  "area": "fix",
+  "workstream": "Captions",
+  "comment": "Check capability to determine if set caption language should be shown for teams meeting",
+  "packageName": "@azure/communication-react",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

change/@azure-communication-react-97b50445-5043-4899-813b-5a9f875bd509.json

@@ -0,0 +1,9 @@
+{
+  "type": "patch",
+  "area": "fix",
+  "workstream": "Captions",
+  "comment": "Check capability to determine if set caption language should be shown for teams meeting",
+  "packageName": "@azure/communication-react",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

packages/react-composites/src/composites/CallComposite/components/CallArrangement.tsx

@@ -86,8 +86,7 @@ import {
   useRemoteSpotlightCallbacksWithPrompt,
   useStopAllSpotlightCallbackWithPrompt
 } from '../utils/spotlightUtils';
-
-import { getCaptionsKind, getIsTeamsCall } from '../selectors/baseSelectors';
+import { getIsTeamsCall } from '../selectors/baseSelectors';
 import { useHandlers } from '../hooks/useHandlers';
 import { MoreDrawer } from '../../common/Drawer/MoreDrawer';
 /* @conditional-compile-remove(breakout-rooms) */
@@ -488,11 +487,11 @@ export const CallArrangement = (props: CallArrangementProps): JSX.Element => {
     );
   }
 
-  const isTeamsCaptions = useSelector(getCaptionsKind) === 'TeamsCaptions';
   const isTeamsMeeting = useSelector(getIsTeamsMeeting);
-
   const isTeamsCall = useSelector(getIsTeamsCall);
-  const useTeamsCaptions = isTeamsMeeting || isTeamsCall || isTeamsCaptions;
+  // Teams captions are only available in Teams meetings or Teams calls.
+  // For Teams Meetings, we need to check if the capability is present.
+  const useTeamsCaptions = (isTeamsMeeting && capabilities?.setCaptionLanguage?.isPresent) || isTeamsCall;
   const hasJoinedCall = useSelector(getCallStatus) === 'Connected';
   const isCaptionsOn = useSelector(getCaptionsStatus);
   const minMaxDragPosition = useMinMaxDragPosition(props.modalLayerHostId);

packages/react-composites/tests/browser/call/hermetic/TeamsClosedCaptions.test.ts

@@ -90,12 +90,14 @@ test.describe('Teams Closed Captions Banner tests', async () => {
     if (isTestProfileMobile(testInfo)) {
       test.skip();
     }
-    const initialState = defaultMockCallAdapterState();
+    const initialState = defaultMockCallAdapterState([], 'Presenter', false);
     if (initialState?.call) {
       initialState.isTeamsMeeting = true;
       initialState.call.captionsFeature = captionsFeatureState;
-
       initialState.call.captionsFeature.captionsKind = 'TeamsCaptions';
+      if (initialState.call.capabilitiesFeature) {
+        initialState.call.capabilitiesFeature.capabilities.setCaptionLanguage.isPresent = true;
+      }
     }
     await page.goto(buildUrlWithMockAdapter(serverUrl, initialState, { newControlBarExperience: 'true' }));
     await pageClick(page, dataUiId('captions-banner-more-button'));
@@ -121,11 +123,13 @@ test.describe('Captions buttons in call control', () => {
   });
 
   test('Captions settings renders normally', async ({ page, serverUrl }, testInfo) => {
-    const initialState = defaultMockCallAdapterState();
+    const initialState = defaultMockCallAdapterState([], 'Presenter', false);
     if (initialState?.call) {
       initialState.isTeamsMeeting = true;
+      if (initialState.call.capabilitiesFeature) {
+        initialState.call.capabilitiesFeature.capabilities.setCaptionLanguage.isPresent = true;
+      }
       initialState.call.captionsFeature = captionsFeatureState;
-
       initialState.call.captionsFeature.captionsKind = 'TeamsCaptions';
     }
     await page.goto(buildUrlWithMockAdapter(serverUrl, initialState, { newControlBarExperience: 'true' }));

packages/react-composites/tests/browser/callwithchat/hermetic/TeamsClosedCaptions.test.ts

@@ -91,12 +91,18 @@ test.describe('Teams Closed Captions Banner tests', async () => {
     if (isTestProfileMobile(testInfo)) {
       test.skip();
     }
-    const initialState = defaultMockCallAdapterState([defaultMockRemoteParticipant('Paul Bridges')]);
+    const initialState = defaultMockCallAdapterState(
+      [defaultMockRemoteParticipant('Paul Bridges')],
+      'Presenter',
+      false
+    );
     if (initialState?.call) {
       initialState.isTeamsMeeting = true;
       initialState.call.captionsFeature = captionsFeatureState;
-
       initialState.call.captionsFeature.captionsKind = 'TeamsCaptions';
+      if (initialState.call.capabilitiesFeature) {
+        initialState.call.capabilitiesFeature.capabilities.setCaptionLanguage.isPresent = true;
+      }
     }
     await loadCallPage(page, serverUrl, initialState);
     await pageClick(page, dataUiId('captions-banner-more-button'));