agora-appbuilder-core 4.1.23-beta.5 → 4.1.24-beta.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agora-appbuilder-core",
-  "version": "4.1.23-beta.5",
+  "version": "4.1.24-beta.1",
   "description": "React Native template for RTE app builder",
   "main": "index.js",
   "files": [

package/template/bridge/rtc/webNg/RtcEngine.ts

@@ -209,6 +209,14 @@ interface ActiveScreenshareLifecycle {
   cleanupPromise?: Promise<void>;
   journeyData: Record<string, unknown>;
 }
+interface ScreenshareJourneyContext {
+  screenshareAttemptId?: string;
+  screenshareSessionId?: string;
+  recordingActive?: boolean;
+  screenShareUid?: UID;
+  stopOrigin?: string;
+  stopActorUid?: UID;
+}
 interface RemoteStream {
   audio?: IRemoteAudioTrack;
   video?: IRemoteVideoTrack;
@@ -883,24 +891,28 @@ export default class RtcEngine {
         user,
         mediaType,
       );
-      if (this.inScreenshare && user.uid === this.screenClient.uid) {
-        (this.eventsMap.get('onRemoteVideoStateChanged') as callbackType)(
-          {},
-          user.uid,
-          2,
-          0,
-          0,
-        );
-      } else {
-        await this.client.subscribe(user, mediaType);
-        logger.log(
-          LogSource.AgoraSDK,
-          'API',
-          'RTC [subscribe] to track successfully done',
-          user,
-          mediaType,
-        );
+      const isOwnScreenshare =
+        this.inScreenshare && user.uid === this.screenClient?.uid;
+      if (isOwnScreenshare) {
+        if (mediaType === 'video') {
+          (this.eventsMap.get('onRemoteVideoStateChanged') as callbackType)(
+            {},
+            user.uid,
+            2,
+            0,
+            0,
+          );
+        }
+        return;
       }
+      await this.client.subscribe(user, mediaType);
+      logger.log(
+        LogSource.AgoraSDK,
+        'API',
+        'RTC [subscribe] to track successfully done',
+        user,
+        mediaType,
+      );
       // If the subscribed track is an audio track
       if (mediaType === 'audio') {
         const audioTrack = user.audioTrack;
@@ -948,6 +960,20 @@ export default class RtcEngine {
         user,
         mediaType,
       );
+      const isOwnScreenshare =
+        this.inScreenshare && user.uid === this.screenClient?.uid;
+      if (isOwnScreenshare) {
+        if (mediaType === 'video') {
+          (this.eventsMap.get('onRemoteVideoStateChanged') as callbackType)(
+            {},
+            user.uid,
+            0,
+            0,
+            0,
+          );
+        }
+        return;
+      }
       if (mediaType === 'video') {
         this.logRemoteScreenshareTermination(
           user.uid,
@@ -1713,6 +1739,9 @@ export default class RtcEngine {
       return;
     }
 
+    // The track-ended callback passes the exact lifecycle object it captured.
+    // A different reference means a newer screen share is now active, so this
+    // older callback must not clean up the current share.
     if (
       expectedLifecycle &&
       this.activeScreenshareLifecycle !== expectedLifecycle
@@ -1814,6 +1843,9 @@ export default class RtcEngine {
         throw error;
       } finally {
         lifecycle.cleaned = true;
+        // Only the lifecycle that is still active may clear shared state and
+        // notify the app. Object identity prevents stale cleanup from ending a
+        // newer screen-share session.
         if (this.activeScreenshareLifecycle === lifecycle) {
           this.activeScreenshareLifecycle = null;
           this.screenStream = {};
@@ -1970,6 +2002,41 @@ export default class RtcEngine {
     }
   }
 
+  async stopScreenshare(
+    journeyContext: ScreenshareJourneyContext = {},
+  ): Promise<void> {
+    const journeyData = {
+      action: 'stop' as const,
+      screenshareAttemptId:
+        journeyContext.screenshareAttemptId || 'rtc-unknown-attempt',
+      screenshareSessionId:
+        journeyContext.screenshareSessionId || 'unknown-session',
+      recordingActive: journeyContext.recordingActive || false,
+      screenShareUid:
+        journeyContext.screenShareUid || this.screenClient?.uid,
+      stopOrigin: journeyContext.stopOrigin || 'unknown',
+      stopActorUid: journeyContext.stopActorUid,
+    };
+    logger.log(
+      LogSource.AgoraSDK,
+      'API',
+      `[SCREENSHARE_JOURNEY] screen share stop entered RTC engine from ${journeyData.stopOrigin}`,
+      {
+        ...journeyData,
+        stage: 'rtc_stop',
+        outcome: 'started',
+        requestedAction: 'stop',
+        executedAction: 'stop',
+        operationState: this.screenshareOperationState,
+      },
+    );
+    await this.cleanupActiveScreenshare(
+      journeyData.stopOrigin,
+      true,
+      journeyData.screenshareAttemptId,
+    );
+  }
+
   async startScreenshare(
     token: string,
     channelName: string,
@@ -1986,18 +2053,10 @@ export default class RtcEngine {
       encoderConfig: this.screenShareProfile,
     },
     audio: 'enable' | 'disable' | 'auto' = 'auto',
-    journeyContext: {
-      action?: 'start' | 'stop';
-      screenshareAttemptId?: string;
-      screenshareSessionId?: string;
-      recordingActive?: boolean;
-      screenShareUid?: UID;
-      stopOrigin?: string;
-      stopActorUid?: UID;
-    } = {},
+    journeyContext: ScreenshareJourneyContext = {},
   ): Promise<void> {
     const journeyData = {
-      action: journeyContext.action || (this.inScreenshare ? 'stop' : 'start'),
+      action: 'start' as const,
       screenshareAttemptId:
         journeyContext.screenshareAttemptId || 'rtc-unknown-attempt',
       screenshareSessionId:
@@ -2011,28 +2070,6 @@ export default class RtcEngine {
       ...screenShareConfig,
       encoderConfig: this.screenShareProfile,
     };
-    if (journeyData.action === 'stop') {
-      logger.log(
-        LogSource.AgoraSDK,
-        'API',
-        `[SCREENSHARE_JOURNEY] screen share stop entered RTC engine from ${journeyData.stopOrigin}`,
-        {
-          ...journeyData,
-          stage: 'rtc_stop',
-          outcome: 'started',
-          requestedAction: 'stop',
-          executedAction: 'stop',
-          operationState: this.screenshareOperationState,
-        },
-      );
-      await this.cleanupActiveScreenshare(
-        journeyData.stopOrigin,
-        true,
-        journeyData.screenshareAttemptId,
-      );
-      return;
-    }
-
     if (this.screenshareOperationState !== 'inactive' || this.inScreenshare) {
       const duplicateStartError = Object.assign(
         new Error(

package/template/bridge/rtc/webNg/__tests__/screenshareLifecycle.test.ts

@@ -75,7 +75,7 @@ describe('web RTC screen-share lifecycle', () => {
   let engine: any;
   let screenClient: any;
 
-  const callScreenshare = (action: 'start' | 'stop', sessionId = 'session-1') =>
+  const callStartScreenshare = (sessionId = 'session-1') =>
     engine.startScreenshare(
       'token',
       'channel',
@@ -87,14 +87,21 @@ describe('web RTC screen-share lifecycle', () => {
       {encoderConfig: '1080p_2'},
       'auto',
       {
-        action,
-        screenshareAttemptId: `${action}-request`,
+        screenshareAttemptId: 'start-request',
         screenshareSessionId: sessionId,
         screenShareUid: 101,
         stopOrigin: 'toolbar',
       },
     );
 
+  const callStopScreenshare = (sessionId = 'session-1') =>
+    engine.stopScreenshare({
+      screenshareAttemptId: 'stop-request',
+      screenshareSessionId: sessionId,
+      screenShareUid: 101,
+      stopOrigin: 'toolbar',
+    });
+
   beforeAll(() => {
     (global as any).window = {};
     RtcEngine = require('../RtcEngine').default;
@@ -120,9 +127,9 @@ describe('web RTC screen-share lifecycle', () => {
     const {track} = createTrack();
     mockCreateScreenVideoTrack.mockReturnValueOnce(picker.promise);
 
-    const firstStart = callScreenshare('start');
+    const firstStart = callStartScreenshare();
     await expect(
-      callScreenshare('start', 'duplicate-session'),
+      callStartScreenshare('duplicate-session'),
     ).rejects.toMatchObject({code: 'SCREENSHARE_OPERATION_IN_PROGRESS'});
 
     expect(mockCreateScreenVideoTrack).toHaveBeenCalledTimes(1);
@@ -136,7 +143,7 @@ describe('web RTC screen-share lifecycle', () => {
     const stopped = jest.fn();
     engine.eventsMap.set('onScreenshareStopped', stopped);
 
-    await callScreenshare('stop');
+    await callStopScreenshare();
 
     expect(mockCreateScreenVideoTrack).not.toHaveBeenCalled();
     expect(screenClient.join).not.toHaveBeenCalled();
@@ -153,7 +160,7 @@ describe('web RTC screen-share lifecycle', () => {
       }),
     );
 
-    await expect(callScreenshare('start')).rejects.toMatchObject({
+    await expect(callStartScreenshare()).rejects.toMatchObject({
       code: 'INVALID_OPERATION',
     });
 
@@ -168,7 +175,7 @@ describe('web RTC screen-share lifecycle', () => {
     mockCreateScreenVideoTrack.mockResolvedValueOnce(track);
     screenClient.publish.mockRejectedValueOnce(new Error('publish failed'));
 
-    await expect(callScreenshare('start')).rejects.toThrow('publish failed');
+    await expect(callStartScreenshare()).rejects.toThrow('publish failed');
 
     expect(track.stop).toHaveBeenCalledTimes(1);
     expect(track.close).toHaveBeenCalledTimes(1);
@@ -185,7 +192,7 @@ describe('web RTC screen-share lifecycle', () => {
     mockCreateScreenVideoTrack.mockResolvedValueOnce(track);
     screenClient.publish.mockRejectedValueOnce(publishError);
 
-    await expect(callScreenshare('start')).rejects.toBe(publishError);
+    await expect(callStartScreenshare()).rejects.toBe(publishError);
 
     expect(track.stop).toHaveBeenCalledTimes(1);
     expect(track.close).toHaveBeenCalledTimes(1);
@@ -201,13 +208,13 @@ describe('web RTC screen-share lifecycle', () => {
       }),
     );
 
-    await expect(callScreenshare('start')).rejects.toMatchObject({
+    await expect(callStartScreenshare()).rejects.toMatchObject({
       code: 'PERMISSION_DENIED',
     });
 
     const {track} = createTrack();
     mockCreateScreenVideoTrack.mockResolvedValueOnce(track);
-    await callScreenshare('start', 'session-2');
+    await callStartScreenshare('session-2');
 
     expect(mockCreateScreenVideoTrack).toHaveBeenCalledTimes(2);
     expect(screenClient.join).toHaveBeenCalledTimes(1);
@@ -220,7 +227,7 @@ describe('web RTC screen-share lifecycle', () => {
     const {track} = createTrack();
     mockCreateScreenVideoTrack.mockReturnValueOnce(picker.promise);
 
-    const pendingStart = callScreenshare('start');
+    const pendingStart = callStartScreenshare();
     await engine.release('end_call_cleanup');
     picker.resolve(track);
 
@@ -239,8 +246,8 @@ describe('web RTC screen-share lifecycle', () => {
     engine.eventsMap.set('onScreenshareStopped', stopped);
     mockCreateScreenVideoTrack.mockResolvedValueOnce(track);
 
-    await callScreenshare('start');
-    await callScreenshare('stop');
+    await callStartScreenshare();
+    await callStopScreenshare();
     await handlers['track-ended']();
 
     expect(screenClient.leave).toHaveBeenCalledTimes(1);
@@ -249,6 +256,28 @@ describe('web RTC screen-share lifecycle', () => {
     expect(stopped).toHaveBeenCalledTimes(1);
   });
 
+  it('does not let an older lifecycle clean up a newer screen share', async () => {
+    const first = createTrack();
+    const second = createTrack();
+    const stopped = jest.fn();
+    engine.eventsMap.set('onScreenshareStopped', stopped);
+    mockCreateScreenVideoTrack
+      .mockResolvedValueOnce(first.track)
+      .mockResolvedValueOnce(second.track);
+
+    await callStartScreenshare();
+    await callStopScreenshare();
+    await callStartScreenshare('session-2');
+    await first.handlers['track-ended']();
+
+    expect(engine.activeScreenshareLifecycle.video).toBe(second.track);
+    expect(engine.inScreenshare).toBe(true);
+    expect(screenClient.leave).toHaveBeenCalledTimes(1);
+    expect(second.track.stop).not.toHaveBeenCalled();
+    expect(second.track.close).not.toHaveBeenCalled();
+    expect(stopped).toHaveBeenCalledTimes(1);
+  });
+
   it('joins an existing cleanup when Stop is requested twice', async () => {
     const {track} = createTrack();
     const leave = deferred<void>();
@@ -257,9 +286,9 @@ describe('web RTC screen-share lifecycle', () => {
     mockCreateScreenVideoTrack.mockResolvedValueOnce(track);
     screenClient.leave.mockReturnValueOnce(leave.promise);
 
-    await callScreenshare('start');
-    const firstStop = callScreenshare('stop');
-    const secondStop = callScreenshare('stop');
+    await callStartScreenshare();
+    const firstStop = callStopScreenshare();
+    const secondStop = callStopScreenshare();
     leave.resolve(undefined);
     await Promise.all([firstStop, secondStop]);
 
@@ -278,8 +307,8 @@ describe('web RTC screen-share lifecycle', () => {
       throw new Error('track stop failed');
     });
 
-    await callScreenshare('start');
-    await expect(callScreenshare('stop')).resolves.toBeUndefined();
+    await callStartScreenshare();
+    await expect(callStopScreenshare()).resolves.toBeUndefined();
 
     expect(track.close).toHaveBeenCalledTimes(1);
     expect(screenClient.leave).toHaveBeenCalledTimes(1);
@@ -294,7 +323,7 @@ describe('web RTC screen-share lifecycle', () => {
     mockCreateScreenVideoTrack.mockResolvedValueOnce(track);
     screenClient.leave.mockRejectedValueOnce(new Error('leave failed'));
 
-    await callScreenshare('start');
+    await callStartScreenshare();
     await expect(handlers['track-ended']()).resolves.toBeUndefined();
 
     expect(screenClient.leave).toHaveBeenCalledTimes(1);
@@ -317,7 +346,7 @@ describe('web RTC screen-share lifecycle', () => {
     engine.eventsMap.set('onScreenshareStopped', stopped);
     mockCreateScreenVideoTrack.mockResolvedValueOnce(track);
 
-    await callScreenshare('start');
+    await callStartScreenshare();
     await engine.release('end_call_cleanup');
 
     const {logger} = require('../../../../src/logger/AppBuilderLogger');

package/template/defaultConfig.js

@@ -77,8 +77,8 @@ const DefaultConfig = {
   CHAT_ORG_NAME: "",
   CHAT_APP_NAME: "",
   CHAT_URL: "",
-  CLI_VERSION: "3.1.23-beta.5",
-  CORE_VERSION: "4.1.23-beta.5",
+  CLI_VERSION: "3.1.24-beta.1",
+  CORE_VERSION: "4.1.24-beta.1",
   DISABLE_LANDSCAPE_MODE: false,
   STT_AUTO_START: false,
   CLOUD_RECORDING_AUTO_START: false,

package/template/src/subComponents/caption/Transcript.tsx

@@ -40,6 +40,8 @@ import {
   sttTranscriptPanelSearchText,
   sttTranscriptPanelViewLatestText,
 } from '../../../src/language/default-labels/videoCallScreenLabels';
+import {logger, LogSource} from '../../logger/AppBuilderLogger';
+import {TRANSCRIPT_JOURNEY} from './transcriptJourney';
 
 export interface TranscriptProps {
   showHeader?: boolean;
@@ -56,6 +58,7 @@ const Transcript = (props: TranscriptProps) => {
     isSTTActive,
     selectedTranslationLanguage,
     transcriptViewMode,
+    isSTTListenerAdded,
   } = useCaption();
 
   const settingSpokenLanguageLabel = useString(sttSettingSpokenLanguageText)();
@@ -68,6 +71,39 @@ const Transcript = (props: TranscriptProps) => {
 
   const data = meetingTranscript; // Object.entries(transcript);
   console.log('[STT_GLOBAL] meetingTranscript data: ', data);
+  const hasLoggedFirstEntryRef = React.useRef(false);
+  const transcriptEntryCountRef = React.useRef(data.length);
+  transcriptEntryCountRef.current = data.length;
+
+  React.useEffect(() => {
+    logger.log(
+      LogSource.Internals,
+      'TRANSCRIPT',
+      `${TRANSCRIPT_JOURNEY} transcript panel state`,
+      {
+        stage: 'transcript_panel',
+        isSTTActive,
+        listenerRegistered: isSTTListenerAdded,
+        transcriptEntryCount: transcriptEntryCountRef.current,
+      },
+    );
+  }, [isSTTActive, isSTTListenerAdded]);
+
+  React.useEffect(() => {
+    if (data.length > 0 && !hasLoggedFirstEntryRef.current) {
+      hasLoggedFirstEntryRef.current = true;
+      logger.log(
+        LogSource.Internals,
+        'TRANSCRIPT',
+        `${TRANSCRIPT_JOURNEY} first transcript entry available to panel`,
+        {
+          stage: 'transcript_panel_data',
+          outcome: 'success',
+          transcriptEntryCount: data.length,
+        },
+      );
+    }
+  }, [data.length]);
 
   const [showButton, setShowButton] = React.useState(false);
 

package/template/src/subComponents/caption/__tests__/transcriptJourney.test.ts

@@ -0,0 +1,7 @@
+import {TRANSCRIPT_JOURNEY} from '../transcriptJourney';
+
+describe('transcript journey logging', () => {
+  it('uses one searchable prefix', () => {
+    expect(TRANSCRIPT_JOURNEY).toBe('[TRANSCRIPT_JOURNEY]');
+  });
+});

package/template/src/subComponents/caption/transcriptJourney.ts

@@ -0,0 +1 @@
+export const TRANSCRIPT_JOURNEY = '[TRANSCRIPT_JOURNEY]';