From 976eadc79e0a5fe1560cc71d154513b09e62fc10 Mon Sep 17 00:00:00 2001 From: "Donald McEachern (from Dev Box)" Date: Fri, 28 Nov 2025 10:17:44 -0800 Subject: [PATCH 1/5] update for GA API --- Project/src/MakeCall/MakeCall.js | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/Project/src/MakeCall/MakeCall.js b/Project/src/MakeCall/MakeCall.js index 6247002..a33364d 100644 --- a/Project/src/MakeCall/MakeCall.js +++ b/Project/src/MakeCall/MakeCall.js @@ -50,6 +50,7 @@ export default class MakeCall extends React.Component { this.videoConstraints = null; this.tokenCredential = null; this.logInComponentRef = React.createRef(); + this.activeCallTransferFeature = null; this.state = { id: undefined, @@ -164,18 +165,18 @@ export default class MakeCall extends React.Component { await this.callClient.createTeamsCallAgent(tokenCredential) : await this.callClient.createCallAgent(tokenCredential, { displayName: userDetails.displayName }); window.callAgent = this.callAgent; - + this.activeCallTransferFeature = this.callAgent.feature(Features.ActiveCallTransfer); try { - this.callAgent.on('activeCallsUpdated', (args) => { + this.activeCallTransferFeature.on('activeCallsUpdated', (args) => { console.log(`activeCallsUpdated, activeCalls=${args.activeCallDetails}`); this.setState({activeCallDetails: args.activeCallDetails}); }); - this.callAgent.on('noActiveCalls', () => { + this.activeCallTransferFeature.on('noActiveCalls', () => { console.log('noActiveCalls event received - user no longer in a call'); this.setState({activeCallDetails: undefined}); }); - const activeCalls = await this.callAgent.getActiveCallDetails(); + const activeCalls = await this.activeCallTransferFeature.getActiveCallDetails(); this.setState({ activeCallDetails: activeCalls.callId ? activeCalls : undefined }); } catch (e) { console.log('active call transfer not configured for this release version'); @@ -1024,14 +1025,14 @@ this.callAgent.on('incomingCall', async (args) => {
{ const callOptions = await this.getCallOptions({video: false, micMuted: false}); - const newCall = await this.callAgent.activeCallTransfer(this.state.activeCallDetails, {isTransfer: true, joinCallOptions: callOptions}); + const newCall = await this.activeCallTransferFeature.activeCallTransfer(this.state.activeCallDetails, {isTransfer: true, joinCallOptions: callOptions}); this.setState({call: newCall}); }}>Transfer to this device
{ const callOptions = await this.getCallOptions({video: false, micMuted: false}); - const newCall = await this.callAgent.activeCallTransfer(this.state.activeCallDetails, {isTransfer: false, joinCallOptions: callOptions}); + const newCall = await this.activeCallTransferFeature.activeCallTransfer(this.state.activeCallDetails, {isTransfer: false, joinCallOptions: callOptions}); this.setState({call: newCall}); }}>Add this device
From 665681f8dfc42c807d968b6608b326ead6c4c78e Mon Sep 17 00:00:00 2001 From: "Donald McEachern (from Dev Box)" Date: Mon, 8 Dec 2025 11:54:35 -0800 Subject: [PATCH 2/5] update behavior to handle multiple calls from getActiveCalls --- Project/src/MakeCall/MakeCall.js | 63 +++++++++++++++++++------------- 1 file changed, 38 insertions(+), 25 deletions(-) diff --git a/Project/src/MakeCall/MakeCall.js b/Project/src/MakeCall/MakeCall.js index a33364d..3b5888b 100644 --- a/Project/src/MakeCall/MakeCall.js +++ b/Project/src/MakeCall/MakeCall.js @@ -168,7 +168,7 @@ export default class MakeCall extends React.Component { this.activeCallTransferFeature = this.callAgent.feature(Features.ActiveCallTransfer); try { this.activeCallTransferFeature.on('activeCallsUpdated', (args) => { - console.log(`activeCallsUpdated, activeCalls=${args.activeCallDetails}`); + console.log(`activeCallsUpdated, activeCalls=`, args.activeCallDetails); this.setState({activeCallDetails: args.activeCallDetails}); }); @@ -1015,30 +1015,43 @@ this.callAgent.on('incomingCall', async (args) => { } { - this.state.activeCallDetails && !this.state.call && { this.setState({ activeCallDetails: undefined }) }} - dismissButtonAriaLabel="Close"> -
- You're in an active call! -
- { - const callOptions = await this.getCallOptions({video: false, micMuted: false}); - const newCall = await this.activeCallTransferFeature.activeCallTransfer(this.state.activeCallDetails, {isTransfer: true, joinCallOptions: callOptions}); - this.setState({call: newCall}); - }}>Transfer to this device -
-
- { - const callOptions = await this.getCallOptions({video: false, micMuted: false}); - const newCall = await this.activeCallTransferFeature.activeCallTransfer(this.state.activeCallDetails, {isTransfer: false, joinCallOptions: callOptions}); - this.setState({call: newCall}); - }}>Add this device -
- -
- + this.state.activeCallDetails ? <> + {this.state.activeCallDetails.map((call) => { + let callTitle; + if ('organizerId' in call) { + callTitle = `Meeting with organizerId: ${call.organizerId}`; + } else { + const participantCount = call.participants.length; + callTitle = `Call with ${participantCount > 1 ? participantCount : call.participants[0]} participants`; + } + return ( + call && !this.state.call && { this.setState({ activeCallDetails: this.state.activeCallDetails.filter(c => c !== call) }) }} + dismissButtonAriaLabel="Close"> +
+ You're in an active call! + {callTitle} +
+ { + const callOptions = await this.getCallOptions({video: false, micMuted: false}); + const newCall = await this.activeCallTransferFeature.activeCallTransfer(call, {isTransfer: true, joinCallOptions: callOptions}); + this.setState({call: newCall}); + }}>Transfer to this device +
+
+ { + const callOptions = await this.getCallOptions({video: false, micMuted: false}); + const newCall = await this.activeCallTransferFeature.activeCallTransfer(call, {isTransfer: false, joinCallOptions: callOptions}); + this.setState({call: newCall}); + }}>Add this device +
+
+ + ); + })} + : <> } { !this.state.incomingCall && !this.state.call && !this.state.callSurvey && From 7b393baf73b5fe51334734f57d79a507f77fe20d Mon Sep 17 00:00:00 2001 From: "Donald McEachern (from Dev Box)" Date: Mon, 8 Dec 2025 16:01:47 -0800 Subject: [PATCH 3/5] update to handle multiple calls in the active calls feature --- Project/src/MakeCall/MakeCall.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/Project/src/MakeCall/MakeCall.js b/Project/src/MakeCall/MakeCall.js index 3b5888b..790169a 100644 --- a/Project/src/MakeCall/MakeCall.js +++ b/Project/src/MakeCall/MakeCall.js @@ -177,7 +177,7 @@ export default class MakeCall extends React.Component { this.setState({activeCallDetails: undefined}); }); const activeCalls = await this.activeCallTransferFeature.getActiveCallDetails(); - this.setState({ activeCallDetails: activeCalls.callId ? activeCalls : undefined }); + this.setState({ activeCallDetails: activeCalls.length > 0 ? activeCalls : undefined }); } catch (e) { console.log('active call transfer not configured for this release version'); } @@ -1018,8 +1018,8 @@ this.callAgent.on('incomingCall', async (args) => { this.state.activeCallDetails ? <> {this.state.activeCallDetails.map((call) => { let callTitle; - if ('organizerId' in call) { - callTitle = `Meeting with organizerId: ${call.organizerId}`; + if ('meetingLocator' in call) { + callTitle = `Meeting with organizerId: ${call.meetingLocator.organizerId}`; } else { const participantCount = call.participants.length; callTitle = `Call with ${participantCount > 1 ? participantCount : call.participants[0]} participants`; From 6a4d01df651ac487d8705fd42b9d85c2707d984d Mon Sep 17 00:00:00 2001 From: "Donald McEachern (from Dev Box)" Date: Mon, 15 Dec 2025 16:02:20 -0800 Subject: [PATCH 4/5] protect feature construction from not supported API --- Project/src/MakeCall/MakeCall.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Project/src/MakeCall/MakeCall.js b/Project/src/MakeCall/MakeCall.js index 790169a..7e7ee36 100644 --- a/Project/src/MakeCall/MakeCall.js +++ b/Project/src/MakeCall/MakeCall.js @@ -165,8 +165,8 @@ export default class MakeCall extends React.Component { await this.callClient.createTeamsCallAgent(tokenCredential) : await this.callClient.createCallAgent(tokenCredential, { displayName: userDetails.displayName }); window.callAgent = this.callAgent; - this.activeCallTransferFeature = this.callAgent.feature(Features.ActiveCallTransfer); try { + this.activeCallTransferFeature = this.callAgent.feature(Features.ActiveCallTransfer); this.activeCallTransferFeature.on('activeCallsUpdated', (args) => { console.log(`activeCallsUpdated, activeCalls=`, args.activeCallDetails); this.setState({activeCallDetails: args.activeCallDetails}); From dc1565f3ee05f151016b01e153bcfe942d077315 Mon Sep 17 00:00:00 2001 From: "Donald McEachern (from Dev Box)" Date: Tue, 16 Dec 2025 08:52:23 -0800 Subject: [PATCH 5/5] add key for react renderer --- Project/src/MakeCall/MakeCall.js | 1 + 1 file changed, 1 insertion(+) diff --git a/Project/src/MakeCall/MakeCall.js b/Project/src/MakeCall/MakeCall.js index 7e7ee36..cb09cfc 100644 --- a/Project/src/MakeCall/MakeCall.js +++ b/Project/src/MakeCall/MakeCall.js @@ -1028,6 +1028,7 @@ this.callAgent.on('incomingCall', async (args) => { call && !this.state.call && { this.setState({ activeCallDetails: this.state.activeCallDetails.filter(c => c !== call) }) }} dismissButtonAriaLabel="Close">