fcr-ui-scene 3.5.0 → 3.6.0

package/lib/modules/layout/components/index.css

@@ -6,6 +6,8 @@
   background-color: var(--fcr_web_ui_scene_fill3);
   height: 100%;
   overflow: hidden;
+  min-width: 825px;
+  min-height: 600px;
 }
 
 .fcr-layout-aside {
@@ -29,6 +31,7 @@
   align-items: center;
   justify-content: center;
   cursor: ew-resize;
+  /* background-color: var(--fcr_ui_scene_video); */
 }
 
 .fcr-layout-aside-body {
@@ -267,10 +270,11 @@
 
 .fcr-layout-content-gallery-wrapper {
   display: flex;
-  flex-flow: column nowrap;
+  /* flex-flow: column nowrap; */
   justify-content: center;
   font-size: 0;
   top: 0;
+  flex-wrap: wrap;
 }
 
 .fcr-layout-content-gallery-return-bar {
@@ -296,16 +300,18 @@
   font-size: 1rem;
 }
 
-.fcr-layout-content-gallery-row .fcr-layout-content-gallery-row-item {
+.fcr-layout-content-gallery-wrapper .fcr-layout-content-gallery-row-item {
   border-radius: var(--fcr_cornerradius_s);
   overflow: hidden;
 }
 
-.fcr-layout-content-gallery-row .fcr-layout-content-gallery-row-noborder {
+.fcr-layout-content-gallery-wrapper .fcr-layout-content-gallery-row-noborder {
   border-radius: 0px;
 }
 
-.fcr-layout-content-gallery-row .fcr-layout-content-gallery-row-item .fcr-member-window-excitation {
+.fcr-layout-content-gallery-wrapper
+  .fcr-layout-content-gallery-row-item
+  .fcr-member-window-excitation {
   border-radius: var(--fcr_cornerradius_s);
 }
 
@@ -327,7 +333,7 @@
   flex-flow: column nowrap;
   align-items: center;
   font-size: 12px;
-  z-index: 1080;
+  z-index: 10;
 }
 
 .fcr-layout-content-gallery-arrow:has(button:disabled) {
@@ -427,25 +433,10 @@
   pointer-events: auto;
 }
 
-.fcr-user-window-actions-bottom {
-  position: absolute;
-  inset: auto auto 4px 4px;
-  color: var(--fcr_ui_scene_icontext1);
-  border-radius: var(--fcr_cornerradius_xxs);
-  /* background-color: var(--fcr_ui_scene_view_toast); */
-  backdrop-filter: blur(25px);
-  font-weight: var(--fcr_font_weight_m);
-  font-size: 10px;
-  display: inline-flex;
-  align-items: center;
-  max-width: calc(100% - 8px);
-  height: 18px;
-  overflow: hidden;
-}
-
 .fcr-user-window-actions-middle {
   inset: auto auto 26px 4px;
   font-size: 12px;
+  position: absolute;
 }
 
 .fcr-user-window-gallery .fcr-user-window-actions-bottom {
@@ -536,7 +527,7 @@
 .fcr-user-window-actions-name {
   padding: 0 8px;
   font-weight: var(--fcr_font_weight_s);
-  line-height: 1;
+  line-height: 1.5;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -546,18 +537,6 @@
   padding: 0 10px;
 }
 
-.fcr-user-window-actions-top {
-  height: 26px;
-  position: absolute;
-  inset: 3px 3px auto;
-  display: flex;
-  flex-flow: row-reverse nowrap;
-  gap: 5px;
-  font-size: 12px;
-  opacity: 0;
-  transition: opacity 0.2s;
-}
-
 .fcr-user-window:hover .fcr-user-window-actions-top {
   opacity: 1;
 }
@@ -655,3 +634,7 @@
 .participant-dialog-header-count {
   font-weight: 400;
 }
+
+.fcr-layout-content-gallery-row-onlyone {
+  border-radius: 0px !important;
+}

package/lib/modules/layout/components/index.js

@@ -4,6 +4,7 @@ require("core-js/modules/es.array.for-each.js");
 require("core-js/modules/es.object.define-property.js");
 require("core-js/modules/es.object.keys.js");
 require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/esnext.async-iterator.for-each.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.for-each.js");
 require("core-js/modules/web.dom-collections.for-each.js");

package/lib/modules/layout/index.d.ts

@@ -14,6 +14,7 @@ import { FcrUIVideoWindowDataSource } from '../../shared-data-source/video-windo
 import { FcrUIMemberSharedDataSource } from '../../shared-data-source/member-data';
 import { FcrUIScreenShareProvider } from '../../providers/screen-share-provider';
 import { FcrUISharedPinDataSource } from '../../shared-data-source/pin-data';
+import { FcrUIInterpreterProvider } from '../../providers/interpreter-provider';
 export declare class LayoutUIModule extends UIModule {
     private _store?;
     eventProvider?: FcrUIEventProvider;
@@ -30,6 +31,7 @@ export declare class LayoutUIModule extends UIModule {
     sharedMemberDataSource?: FcrUIMemberSharedDataSource;
     screenShareProvider?: FcrUIScreenShareProvider;
     sharedPinDataSource?: FcrUISharedPinDataSource;
+    interpreterProvider?: FcrUIInterpreterProvider;
     onNodeWillActive(): void;
     onNodeWillInactive(): void;
     getComponent(slots?: Partial<FcrLayoutSlots & {

package/lib/modules/layout/index.js

@@ -56,7 +56,8 @@ var LayoutUIModule = exports.LayoutUIModule = /*#__PURE__*/function (_UIModule)
         sharedVideoWindowDataSource: this.sharedVideoWindowDataSource,
         sharedMemberDataSource: this.sharedMemberDataSource,
         screenShareProvider: this.screenShareProvider,
-        sharedPinDataSource: this.sharedPinDataSource
+        sharedPinDataSource: this.sharedPinDataSource,
+        interpreterProvider: this.interpreterProvider
       });
     }
   }, {

package/lib/modules/layout/store.d.ts

@@ -19,6 +19,7 @@ import { FcrUIVideoWindowDataSource } from '../../shared-data-source/video-windo
 import { FcrUIMemberSharedDataSource } from '../../shared-data-source/member-data';
 import { FcrUIScreenShareProvider } from '../../providers/screen-share-provider';
 import { FcrUISharedPinDataSource } from '../../shared-data-source/pin-data';
+import { FcrUIInterpreterProvider } from '../../providers/interpreter-provider';
 export interface FcrLayoutSlots {
     participant: React.ReactNode;
     chat: React.ReactNode;
@@ -47,6 +48,7 @@ export interface LayoutStoreParams {
     sharedMemberDataSource: FcrUIMemberSharedDataSource;
     screenShareProvider: FcrUIScreenShareProvider;
     sharedPinDataSource: FcrUISharedPinDataSource;
+    interpreterProvider: FcrUIInterpreterProvider;
 }
 export default class LayoutStore implements FcrLayoutSlots, FcrUIEventObserver {
     private readonly logger;
@@ -72,6 +74,7 @@ export default class LayoutStore implements FcrLayoutSlots, FcrUIEventObserver {
     private _chatProvider;
     private _screenShareProvider;
     private _pinDataSource;
+    private _interpreterProvider;
     accessor participant: React.ReactNode;
     accessor chat: React.ReactNode;
     accessor chatAction: React.ReactNode;
@@ -88,12 +91,12 @@ export default class LayoutStore implements FcrLayoutSlots, FcrUIEventObserver {
     accessor userVolumeMap: Map<string, number>;
     accessor chatRoomState: FcrChatRoomConnectionState;
     accessor whiteboardActive: boolean;
-    accessor participantCount: number;
     accessor ownerUser: FcrUserInfo | undefined;
     get streamControl(): FcrStreamControl;
     get localUserRole(): FcrUserRole;
     get localUser(): FcrUserInfo;
     get shouldHideNonVideoParticipants(): boolean;
+    get shouldHideMyVideo(): boolean;
     get enableSpotlight(): boolean;
     get isWaterMarkEnabled(): boolean;
     get isMulti(): boolean;
@@ -127,6 +130,7 @@ export default class LayoutStore implements FcrLayoutSlots, FcrUIEventObserver {
     get interpreterUserList(): import("fcr-core/lib/room-control/interpreter-control/types").FcrInterpreterUserInfo[] | null;
     get isInterpreterEnabled(): boolean;
     constructor(params: LayoutStoreParams);
+    get participantCount(): number;
     get isVideoSuspended(): boolean;
     get asideContent(): import("../../type").FcrUIUpdateAsideParams;
     get participantsRenderAt(): "aside" | "dialog";
@@ -188,7 +192,6 @@ export default class LayoutStore implements FcrLayoutSlots, FcrUIEventObserver {
     private _switchToSpeaker;
     private _switchToGallery;
     private _setBarHovering;
-    private _onAllUserCountUpdated;
     private _initStream;
     private _isSetSpotlightEnable;
     private _handleConnectionUpdated;

package/lib/modules/layout/store.js

@@ -34,6 +34,10 @@ require("core-js/modules/es.object.values.js");
 require("core-js/modules/es.set.js");
 require("core-js/modules/es.string.iterator.js");
 require("core-js/modules/es.weak-map.js");
+require("core-js/modules/esnext.async-iterator.filter.js");
+require("core-js/modules/esnext.async-iterator.find.js");
+require("core-js/modules/esnext.async-iterator.for-each.js");
+require("core-js/modules/esnext.async-iterator.some.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.filter.js");
 require("core-js/modules/esnext.iterator.find.js");
@@ -103,7 +107,7 @@ var _view = require("./view");
 var _logger = require("../../utilities/logger");
 var _env = require("agora-foundation/lib/utilities/env");
 var _LayoutStore;
-var _initProto, _participantDecs, _init_participant, _chatDecs, _init_chat, _chatActionDecs, _init_chatAction, _stateBarDecs, _init_stateBar, _actionBarDecs, _init_actionBar, _layersDecs, _init_layers, _whiteboardDecs, _init_whiteboard, _init_collapsed, _init_aside, _init_barHovering, _init_barLocked, _init_barHidden, _init_asideWidth, _init_userVolumeMap, _init_chatRoomState, _init_whiteboardActive, _init_participantCount, _init_ownerUser, _addPinMessageDecs, _cancelPinMessageDecs, _setWhiteboardActiveDecs, _setAsideWidthDecs, _updateSlotsDecs, _toggleLayoutDecs, _toggleCollapsedDecs, _toggleAsideDecs, _asideWidthChangedDecs, _toggleLayoutBarLockDecs, _toggleLayoutBarHiddenDecs, _resetLockTimerDecs, _setHoveringHandlerDecs, _setHoveringLeaveHandlerDecs, _handleLiveLayoutChangeDecs, _onUserInfoUpdatedDecs, _handleLayoutUpdatedDecs, _init__handleLayoutUpdated, _handleFoldListChangedDecs, _handleMainListLengthChangedDecs, _handleMainListChangedDecs, _setBarHoveringDecs, _onAllUserCountUpdatedDecs, _handleConnectionUpdatedDecs, _onAudioVolumeUpdatedDecs, _ref;
+var _initProto, _participantDecs, _init_participant, _chatDecs, _init_chat, _chatActionDecs, _init_chatAction, _stateBarDecs, _init_stateBar, _actionBarDecs, _init_actionBar, _layersDecs, _init_layers, _whiteboardDecs, _init_whiteboard, _init_collapsed, _init_aside, _init_barHovering, _init_barLocked, _init_barHidden, _init_asideWidth, _init_userVolumeMap, _init_chatRoomState, _init_whiteboardActive, _init_ownerUser, _addPinMessageDecs, _cancelPinMessageDecs, _setWhiteboardActiveDecs, _setAsideWidthDecs, _updateSlotsDecs, _toggleLayoutDecs, _toggleCollapsedDecs, _toggleAsideDecs, _asideWidthChangedDecs, _toggleLayoutBarLockDecs, _toggleLayoutBarHiddenDecs, _resetLockTimerDecs, _setHoveringHandlerDecs, _setHoveringLeaveHandlerDecs, _handleLiveLayoutChangeDecs, _onUserInfoUpdatedDecs, _handleLayoutUpdatedDecs, _init__handleLayoutUpdated, _handleFoldListChangedDecs, _handleMainListLengthChangedDecs, _handleMainListChangedDecs, _setBarHoveringDecs, _handleConnectionUpdatedDecs, _onAudioVolumeUpdatedDecs, _ref;
 function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); }
 function _checkPrivateRedeclaration(e, t) { if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object"); }
 function _classPrivateFieldSet(s, a, r) { return s.set(_assertClassBrand(s, a), r), r; }
@@ -131,8 +135,7 @@ var _N = /*#__PURE__*/new WeakMap();
 var _O = /*#__PURE__*/new WeakMap();
 var _P = /*#__PURE__*/new WeakMap();
 var _Q = /*#__PURE__*/new WeakMap();
-var _R = /*#__PURE__*/new WeakMap();
-_ref = (_participantDecs = [_mobx.observable, _mobx.observable.ref], _chatDecs = [_mobx.observable, _mobx.observable.ref], _chatActionDecs = [_mobx.observable, _mobx.observable.ref], _stateBarDecs = [_mobx.observable, _mobx.observable.ref], _actionBarDecs = [_mobx.observable, _mobx.observable.ref], _layersDecs = [_mobx.observable, _mobx.observable.ref], _whiteboardDecs = [_mobx.observable, _mobx.observable.ref], _addPinMessageDecs = [_mobx.action, _mobx.action.bound], _cancelPinMessageDecs = [_mobx.action, _mobx.action.bound], _setWhiteboardActiveDecs = [_mobx.action, _mobx.action.bound], _setAsideWidthDecs = [_mobx.action, _mobx.action.bound], _updateSlotsDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutDecs = [_mobx.action, _mobx.action.bound], _toggleCollapsedDecs = [_mobx.action, _mobx.action.bound], _toggleAsideDecs = [_mobx.action, _mobx.action.bound], _asideWidthChangedDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutBarLockDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutBarHiddenDecs = [_mobx.action, _mobx.action.bound], _resetLockTimerDecs = [_mobx.action, _mobx.action.bound], _setHoveringHandlerDecs = [_mobx.action, _mobx.action.bound], _setHoveringLeaveHandlerDecs = [_mobx.action, _mobx.action.bound], _handleLiveLayoutChangeDecs = [_mobx.action, _mobx.action.bound], _onUserInfoUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleLayoutUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleFoldListChangedDecs = [_mobx.action, _mobx.action.bound], _handleMainListLengthChangedDecs = [_mobx.action, _mobx.action.bound], _handleMainListChangedDecs = [_mobx.action, _mobx.action.bound], _setBarHoveringDecs = [_mobx.action, _mobx.action.bound], _onAllUserCountUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleConnectionUpdatedDecs = [_mobx.action, _mobx.action.bound], _onAudioVolumeUpdatedDecs = [_mobx.action, _mobx.action.bound], "logger");
+_ref = (_participantDecs = [_mobx.observable, _mobx.observable.ref], _chatDecs = [_mobx.observable, _mobx.observable.ref], _chatActionDecs = [_mobx.observable, _mobx.observable.ref], _stateBarDecs = [_mobx.observable, _mobx.observable.ref], _actionBarDecs = [_mobx.observable, _mobx.observable.ref], _layersDecs = [_mobx.observable, _mobx.observable.ref], _whiteboardDecs = [_mobx.observable, _mobx.observable.ref], _addPinMessageDecs = [_mobx.action, _mobx.action.bound], _cancelPinMessageDecs = [_mobx.action, _mobx.action.bound], _setWhiteboardActiveDecs = [_mobx.action, _mobx.action.bound], _setAsideWidthDecs = [_mobx.action, _mobx.action.bound], _updateSlotsDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutDecs = [_mobx.action, _mobx.action.bound], _toggleCollapsedDecs = [_mobx.action, _mobx.action.bound], _toggleAsideDecs = [_mobx.action, _mobx.action.bound], _asideWidthChangedDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutBarLockDecs = [_mobx.action, _mobx.action.bound], _toggleLayoutBarHiddenDecs = [_mobx.action, _mobx.action.bound], _resetLockTimerDecs = [_mobx.action, _mobx.action.bound], _setHoveringHandlerDecs = [_mobx.action, _mobx.action.bound], _setHoveringLeaveHandlerDecs = [_mobx.action, _mobx.action.bound], _handleLiveLayoutChangeDecs = [_mobx.action, _mobx.action.bound], _onUserInfoUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleLayoutUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleFoldListChangedDecs = [_mobx.action, _mobx.action.bound], _handleMainListLengthChangedDecs = [_mobx.action, _mobx.action.bound], _handleMainListChangedDecs = [_mobx.action, _mobx.action.bound], _setBarHoveringDecs = [_mobx.action, _mobx.action.bound], _handleConnectionUpdatedDecs = [_mobx.action, _mobx.action.bound], _onAudioVolumeUpdatedDecs = [_mobx.action, _mobx.action.bound], "logger");
 var LayoutStore = exports["default"] = /*#__PURE__*/function () {
   function LayoutStore(params) {
     var _this = this;
@@ -163,10 +166,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     _classPrivateFieldInitSpec(this, _N, _init_userVolumeMap(this, new Map()));
     _classPrivateFieldInitSpec(this, _O, _init_chatRoomState(this, _type4.FcrChatRoomConnectionState.Disconnected));
     _classPrivateFieldInitSpec(this, _P, _init_whiteboardActive(this, false));
-    // @observable accessor spotlightStreamId = '';
-    // @observable accessor shouldHideNonVideoParticipants = false;
-    _classPrivateFieldInitSpec(this, _Q, _init_participantCount(this, 0));
-    _classPrivateFieldInitSpec(this, _R, _init_ownerUser(this, undefined));
+    _classPrivateFieldInitSpec(this, _Q, _init_ownerUser(this, undefined));
     (0, _defineProperty2["default"])(this, "getAllowedOperations", (0, _mobxUtils.computedFn)(function (targetRole, isSelf) {
       return _this._privilegeProvider.getAllowedOperations(targetRole, isSelf);
     }));
@@ -203,6 +203,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     this._screenShareProvider = params.screenShareProvider;
     this._pinDataSource = params.sharedPinDataSource;
     this.chatRoomState = this._chatRoomControl.getConnectionState();
+    this._interpreterProvider = params.interpreterProvider;
     this._addListeners();
     //@ts-ignore
     window.layoutStore = this;
@@ -212,9 +213,6 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     this._handleMainListLengthChanged();
     this._handleLayoutUpdated(this._videoWindowDataSource.layoutType);
     this.setWhiteboardActive(this._whiteBoardControl.getBoardActiveInfo().isActive);
-    (0, _mobx.runInAction)(function () {
-      _this.participantCount = _this._userControl.getAllUserCount();
-    });
   }
   return (0, _createClass2["default"])(LayoutStore, [{
     key: "participant",
@@ -345,21 +343,13 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
       _classPrivateFieldSet(_P, this, v);
     }
   }, {
-    key: "participantCount",
+    key: "ownerUser",
     get: function get() {
       return _classPrivateFieldGet(_Q, this);
     },
     set: function set(v) {
       _classPrivateFieldSet(_Q, this, v);
     }
-  }, {
-    key: "ownerUser",
-    get: function get() {
-      return _classPrivateFieldGet(_R, this);
-    },
-    set: function set(v) {
-      _classPrivateFieldSet(_R, this, v);
-    }
   }, {
     key: "streamControl",
     get: function get() {
@@ -380,6 +370,11 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     get: function get() {
       return this._sharedSettingDataSource.setting.shouldHideNonVideoParticipants || false;
     }
+  }, {
+    key: "shouldHideMyVideo",
+    get: function get() {
+      return this._sharedSettingDataSource.setting.shouldHideMyVideo || false;
+    }
   }, {
     key: "enableSpotlight",
     get: function get() {
@@ -419,7 +414,13 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
       var nonVideoStreamParticipantList = this.sourceList.filter(function (i) {
         return _this2._isVideoParticipantVisible(i);
       });
-      return this.shouldHideNonVideoParticipants ? nonVideoStreamParticipantList : this.sourceList;
+      var list = this.shouldHideNonVideoParticipants ? nonVideoStreamParticipantList : this.sourceList;
+      return list.filter(function (i) {
+        if (_this2.shouldHideMyVideo && i.isMySelf) {
+          return false;
+        }
+        return true;
+      });
     }
   }, {
     key: "mainList",
@@ -563,6 +564,11 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     get: function get() {
       return this._sharedInterpreterDataSource.isInterpreterEnabled;
     }
+  }, {
+    key: "participantCount",
+    get: function get() {
+      return this._sharedMemberDataSource.totalUserCount;
+    }
   }, {
     key: "isVideoSuspended",
     get: function get() {
@@ -905,9 +911,15 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
           if (isLoneyWindow) {
             this._videoWindowDataSource.removeBoard();
           } else {
-            var ownerUserId = this._whiteBoardControl.getBoardActiveInfo().ownerUserId;
-            var ownerUser = this._userControl.getUser(ownerUserId);
-            this._videoWindowDataSource.addBoard(ownerUser, ownerUserId === this.localUserId, this._privilegeProvider.hasWriteBoardPermission());
+            var _this$_whiteBoardCont = this._whiteBoardControl.getBoardActiveInfo(),
+              ownerUserId = _this$_whiteBoardCont.ownerUserId,
+              isActive = _this$_whiteBoardCont.isActive;
+            if (isActive) {
+              var ownerUser = this._userControl.getUser(ownerUserId);
+              this._videoWindowDataSource.addBoard(ownerUser, ownerUserId === this.localUserId, this._privilegeProvider.hasWriteBoardPermission());
+            } else {
+              this.logger.warn('LayoutStore onEvent, WhiteboardControlbarEvents.LONEYWINDOW isLoneyWindow false, boardActiveInfo isActive is false, ownerUserId is null');
+            }
           }
         }
         if (changeAction === _type3.WhiteboardBaseEvents.SET_OWNER_USER_ID) {
@@ -937,8 +949,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
         onStreamVolumeIndicationUpdated: this._onAudioVolumeUpdated
       };
       var userObserver = {
-        onUserInfoUpdated: this.onUserInfoUpdated,
-        onAllUserCountUpdated: this._onAllUserCountUpdated
+        onUserInfoUpdated: this.onUserInfoUpdated
       };
       var videoWindowObserver = {
         onLayoutUpdated: this._handleLayoutUpdated,
@@ -985,9 +996,13 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
         return _this5.whiteboardActive;
       }, function (opened) {
         if (opened) {
-          var ownerUserId = _this5._whiteBoardControl.getBoardActiveInfo().ownerUserId;
-          var ownerUser = _this5._userControl.getUser(ownerUserId);
-          _this5._videoWindowDataSource.addBoard(ownerUser, ownerUserId === _this5.localUserId);
+          var _this5$_whiteBoardCon = _this5._whiteBoardControl.getBoardActiveInfo(),
+            ownerUserId = _this5$_whiteBoardCon.ownerUserId,
+            isActive = _this5$_whiteBoardCon.isActive;
+          if (isActive) {
+            var ownerUser = _this5._userControl.getUser(ownerUserId);
+            _this5._videoWindowDataSource.addBoard(ownerUser, ownerUserId === _this5.localUserId);
+          }
           if (_this5.layout === _type2.FcrUIVideoWindowLayoutType.Gallery) {
             _this5.toggleLayout(_type2.FcrUIVideoWindowLayoutType.Speaker);
           }
@@ -1131,11 +1146,6 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
     value: function _setBarHovering(state) {
       this.barHovering = state;
     }
-  }, {
-    key: "_onAllUserCountUpdated",
-    value: function _onAllUserCountUpdated(_roomId, count) {
-      this.participantCount = count;
-    }
   }, {
     key: "_initStream",
     value: function _initStream() {
@@ -1237,8 +1247,11 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
         volume: 0
       };
       this.userVolumeMap.forEach(function (volume, id) {
+        var _this10$interpreterUs;
         var windowData = _this10.mainListMapByAudioStreamId.get(id);
-        if (id !== '0' && !res.streamId && volume > 0 && windowData !== null && windowData !== void 0 && windowData.hasMicrophoneAudioStream && windowData.videoSourceType !== _fcrCore.FcrVideoSourceType.SCREEN) {
+        if (id !== '0' && !res.streamId && volume > 45 && windowData !== null && windowData !== void 0 && windowData.hasMicrophoneAudioStream && windowData.videoSourceType !== _fcrCore.FcrVideoSourceType.SCREEN && !((_this10$interpreterUs = _this10.interpreterUserList) !== null && _this10$interpreterUs !== void 0 && _this10$interpreterUs.find(function (user) {
+          return user.userId === windowData.userId;
+        }))) {
           res = {
             streamId: windowData.windowId,
             volume: volume
@@ -1250,7 +1263,7 @@ var LayoutStore = exports["default"] = /*#__PURE__*/function () {
   }]);
 }();
 _LayoutStore = LayoutStore;
-var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_LayoutStore, [[_participantDecs, 17, "participant"], [_chatDecs, 17, "chat"], [_chatActionDecs, 17, "chatAction"], [_stateBarDecs, 17, "stateBar"], [_actionBarDecs, 17, "actionBar"], [_layersDecs, 17, "layers"], [_whiteboardDecs, 17, "whiteboard"], [_mobx.observable, 1, "collapsed"], [_mobx.observable, 1, "aside"], [_mobx.observable, 1, "barHovering"], [_mobx.observable, 1, "barLocked"], [_mobx.observable, 1, "barHidden"], [_mobx.observable, 1, "asideWidth"], [_mobx.observable, 1, "userVolumeMap"], [_mobx.observable, 1, "chatRoomState"], [_mobx.observable, 1, "whiteboardActive"], [_mobx.observable, 1, "participantCount"], [_mobx.observable, 1, "ownerUser"], [_mobx.computed, 3, "localUserRole"], [_mobx.computed, 3, "localUser"], [_mobx.computed, 3, "shouldHideNonVideoParticipants"], [_mobx.computed, 3, "enableSpotlight"], [_mobx.computed, 3, "isWaterMarkEnabled"], [_mobx.computed, 3, "isMulti"], [_mobx.computed, 3, "layout"], [_mobx.computed, 3, "manualLayout"], [_mobx.computed, 3, "sourceList"], [_mobx.computed, 3, "layoutMainList"], [_mobx.computed, 3, "mainList"], [_mobx.computed, 3, "mainListMapByAudioStreamId"], [_mobx.computed, 3, "spotlightStreamId"], [_mobx.computed, 3, "foldList"], [_mobx.computed, 3, "galleryList"], [_mobx.computed, 3, "asideLayout"], [_mobx.computed, 3, "carouselList"], [_mobx.computed, 3, "hasPinnedStream"], [_mobx.computed, 3, "isRobot"], [_mobx.computed, 3, "findSpotlightUser"], [_mobx.computed, 3, "microphoneEnabled"], [_mobx.computed, 3, "isHostOrCoHost"], [_mobx.computed, 3, "galleryMaxSize"], [_mobx.computed, 3, "localUserId"], [_mobx.computed, 3, "isVideoSuspended"], [_mobx.computed, 3, "asideContent"], [_mobx.computed, 3, "participantsRenderAt"], [_mobx.computed, 3, "chatRenderAt"], [_decorator.bound, 2, "getWaterMarkContent"], [_decorator.bound, 2, "hasMutePermission"], [_decorator.bound, 2, "hasUnmutePermission"], [_decorator.bound, 2, "hasRequestStartAudioPermission"], [_decorator.bound, 2, "toggleMainStream"], [_addPinMessageDecs, 18, "addPinMessage"], [_cancelPinMessageDecs, 18, "cancelPinMessage"], [_decorator.bound, 2, "addPin"], [_decorator.bound, 2, "removePin"], [_decorator.bound, 2, "setVideoOrientation"], [_decorator.bound, 2, "setAllowChat"], [_decorator.bound, 2, "handleSetPinState"], [_setWhiteboardActiveDecs, 18, "setWhiteboardActive"], [_setAsideWidthDecs, 18, "setAsideWidth"], [_updateSlotsDecs, 18, "updateSlots"], [_decorator.bound, 2, "closeParticipantFromAside"], [_decorator.bound, 2, "moveParticipantFromAsideToDialog"], [_decorator.bound, 2, "closeChatFromAside"], [_decorator.bound, 2, "closeAsideChat"], [_decorator.bound, 2, "moveChatFromAsideToDialog"], [_decorator.bound, 2, "openPrivateChat"], [_decorator.bound, 2, "openRenameDialog"], [_toggleLayoutDecs, 18, "toggleLayout"], [_toggleCollapsedDecs, 18, "toggleCollapsed"], [_toggleAsideDecs, 18, "toggleAside"], [_asideWidthChangedDecs, 18, "asideWidthChanged"], [_toggleLayoutBarLockDecs, 18, "toggleLayoutBarLock"], [_toggleLayoutBarHiddenDecs, 18, "toggleLayoutBarHidden"], [_resetLockTimerDecs, 18, "resetLockTimer"], [_setHoveringHandlerDecs, 18, "setHoveringHandler"], [_setHoveringLeaveHandlerDecs, 18, "setHoveringLeaveHandler"], [_handleLiveLayoutChangeDecs, 18, "handleLiveLayoutChange"], [_onUserInfoUpdatedDecs, 18, "onUserInfoUpdated"], [_decorator.bound, 2, "stopLocalPreview"], [_decorator.bound, 2, "startLocalPreview"], [_decorator.bound, 2, "setAllowChatWithPayload"], [_decorator.bound, 2, "muteAudio"], [_decorator.bound, 2, "sendParticipantEvent"], [_decorator.bound, 2, "onEvent"], [_decorator.bound, 2, "_addListeners"], [_mobx.computed, 3, "_hasVideoStreamUser"], [_handleFoldListChangedDecs, 18, "_handleFoldListChanged"], [_handleMainListLengthChangedDecs, 18, "_handleMainListLengthChanged"], [_handleMainListChangedDecs, 18, "_handleMainListChanged"], [_mobx.action, 2, "_switchToSpeaker"], [_mobx.action, 2, "_switchToGallery"], [_setBarHoveringDecs, 18, "_setBarHovering"], [_onAllUserCountUpdatedDecs, 18, "_onAllUserCountUpdated"], [_decorator.bound, 2, "_initStream"], [_decorator.bound, 2, "_isSetSpotlightEnable"], [_handleConnectionUpdatedDecs, 18, "_handleConnectionUpdated"], [_decorator.bound, 2, "_handleLiveStreamingStateUpdated"], [_decorator.bound, 2, "_handleStreamAdded"], [_decorator.bound, 2, "_onStreamsAdded"], [_decorator.bound, 2, "_onStreamsUpdated"], [_decorator.bound, 2, "_onStreamsRemoved"], [_onAudioVolumeUpdatedDecs, 18, "_onAudioVolumeUpdated"], [_handleLayoutUpdatedDecs, 16, "_handleLayoutUpdated"]], []).e, 20);
+var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_LayoutStore, [[_participantDecs, 17, "participant"], [_chatDecs, 17, "chat"], [_chatActionDecs, 17, "chatAction"], [_stateBarDecs, 17, "stateBar"], [_actionBarDecs, 17, "actionBar"], [_layersDecs, 17, "layers"], [_whiteboardDecs, 17, "whiteboard"], [_mobx.observable, 1, "collapsed"], [_mobx.observable, 1, "aside"], [_mobx.observable, 1, "barHovering"], [_mobx.observable, 1, "barLocked"], [_mobx.observable, 1, "barHidden"], [_mobx.observable, 1, "asideWidth"], [_mobx.observable, 1, "userVolumeMap"], [_mobx.observable, 1, "chatRoomState"], [_mobx.observable, 1, "whiteboardActive"], [_mobx.observable, 1, "ownerUser"], [_mobx.computed, 3, "isWaterMarkEnabled"], [_mobx.computed, 3, "isMulti"], [_mobx.computed, 3, "layout"], [_mobx.computed, 3, "manualLayout"], [_mobx.computed, 3, "sourceList"], [_mobx.computed, 3, "layoutMainList"], [_mobx.computed, 3, "mainList"], [_mobx.computed, 3, "mainListMapByAudioStreamId"], [_mobx.computed, 3, "spotlightStreamId"], [_mobx.computed, 3, "foldList"], [_mobx.computed, 3, "galleryList"], [_mobx.computed, 3, "asideLayout"], [_mobx.computed, 3, "carouselList"], [_mobx.computed, 3, "hasPinnedStream"], [_mobx.computed, 3, "isRobot"], [_mobx.computed, 3, "findSpotlightUser"], [_mobx.computed, 3, "microphoneEnabled"], [_mobx.computed, 3, "galleryMaxSize"], [_mobx.computed, 3, "isVideoSuspended"], [_mobx.computed, 3, "asideContent"], [_mobx.computed, 3, "participantsRenderAt"], [_mobx.computed, 3, "chatRenderAt"], [_decorator.bound, 2, "getWaterMarkContent"], [_decorator.bound, 2, "hasMutePermission"], [_decorator.bound, 2, "hasUnmutePermission"], [_decorator.bound, 2, "hasRequestStartAudioPermission"], [_decorator.bound, 2, "toggleMainStream"], [_addPinMessageDecs, 18, "addPinMessage"], [_cancelPinMessageDecs, 18, "cancelPinMessage"], [_decorator.bound, 2, "addPin"], [_decorator.bound, 2, "removePin"], [_decorator.bound, 2, "setVideoOrientation"], [_decorator.bound, 2, "setAllowChat"], [_decorator.bound, 2, "handleSetPinState"], [_setWhiteboardActiveDecs, 18, "setWhiteboardActive"], [_setAsideWidthDecs, 18, "setAsideWidth"], [_updateSlotsDecs, 18, "updateSlots"], [_decorator.bound, 2, "closeParticipantFromAside"], [_decorator.bound, 2, "moveParticipantFromAsideToDialog"], [_decorator.bound, 2, "closeChatFromAside"], [_decorator.bound, 2, "closeAsideChat"], [_decorator.bound, 2, "moveChatFromAsideToDialog"], [_decorator.bound, 2, "openPrivateChat"], [_decorator.bound, 2, "openRenameDialog"], [_toggleLayoutDecs, 18, "toggleLayout"], [_toggleCollapsedDecs, 18, "toggleCollapsed"], [_toggleAsideDecs, 18, "toggleAside"], [_asideWidthChangedDecs, 18, "asideWidthChanged"], [_toggleLayoutBarLockDecs, 18, "toggleLayoutBarLock"], [_toggleLayoutBarHiddenDecs, 18, "toggleLayoutBarHidden"], [_resetLockTimerDecs, 18, "resetLockTimer"], [_setHoveringHandlerDecs, 18, "setHoveringHandler"], [_setHoveringLeaveHandlerDecs, 18, "setHoveringLeaveHandler"], [_handleLiveLayoutChangeDecs, 18, "handleLiveLayoutChange"], [_onUserInfoUpdatedDecs, 18, "onUserInfoUpdated"], [_decorator.bound, 2, "stopLocalPreview"], [_decorator.bound, 2, "startLocalPreview"], [_decorator.bound, 2, "setAllowChatWithPayload"], [_decorator.bound, 2, "muteAudio"], [_decorator.bound, 2, "sendParticipantEvent"], [_decorator.bound, 2, "onEvent"], [_decorator.bound, 2, "_addListeners"], [_mobx.computed, 3, "_hasVideoStreamUser"], [_handleFoldListChangedDecs, 18, "_handleFoldListChanged"], [_handleMainListLengthChangedDecs, 18, "_handleMainListLengthChanged"], [_handleMainListChangedDecs, 18, "_handleMainListChanged"], [_mobx.action, 2, "_switchToSpeaker"], [_mobx.action, 2, "_switchToGallery"], [_setBarHoveringDecs, 18, "_setBarHovering"], [_decorator.bound, 2, "_initStream"], [_decorator.bound, 2, "_isSetSpotlightEnable"], [_handleConnectionUpdatedDecs, 18, "_handleConnectionUpdated"], [_decorator.bound, 2, "_handleLiveStreamingStateUpdated"], [_decorator.bound, 2, "_handleStreamAdded"], [_decorator.bound, 2, "_onStreamsAdded"], [_decorator.bound, 2, "_onStreamsUpdated"], [_decorator.bound, 2, "_onStreamsRemoved"], [_onAudioVolumeUpdatedDecs, 18, "_onAudioVolumeUpdated"], [_handleLayoutUpdatedDecs, 16, "_handleLayoutUpdated"]], []).e, 19);
 _init_participant = _applyDecs$e[0];
 _init_chat = _applyDecs$e[1];
 _init_chatAction = _applyDecs$e[2];
@@ -1267,9 +1280,8 @@ _init_asideWidth = _applyDecs$e[12];
 _init_userVolumeMap = _applyDecs$e[13];
 _init_chatRoomState = _applyDecs$e[14];
 _init_whiteboardActive = _applyDecs$e[15];
-_init_participantCount = _applyDecs$e[16];
-_init_ownerUser = _applyDecs$e[17];
-_init__handleLayoutUpdated = _applyDecs$e[18];
-_initProto = _applyDecs$e[19];
+_init_ownerUser = _applyDecs$e[16];
+_init__handleLayoutUpdated = _applyDecs$e[17];
+_initProto = _applyDecs$e[18];
 (0, _defineProperty2["default"])(LayoutStore, "MIN_USERS_TO_ENABLE_SPOTLIGHT", 2);
 var StoreContext = exports.StoreContext = /*#__PURE__*/(0, _react.createContext)(null);

package/lib/modules/layout/type.d.ts

@@ -65,3 +65,7 @@ export declare enum FcrUIWindowType {
     VIDEO = 1,
     BOARD = 2
 }
+export declare enum FcrUILayoutType {
+    CAROUSEL = "carousel",
+    GALLERY = "gallery"
+}

package/lib/modules/layout/type.js

@@ -4,11 +4,9 @@ require("core-js/modules/es.object.define-property.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.VideoRatio = exports.GalleryMaxSize = exports.FcrUIWindowType = exports.FcrUIVideoWindowMainSortingPriority = exports.FcrUIVideoWindowLayoutType = exports.FcrUIVideoWindowFoldSortingPriority = void 0;
+exports.VideoRatio = exports.GalleryMaxSize = exports.FcrUIWindowType = exports.FcrUIVideoWindowMainSortingPriority = exports.FcrUIVideoWindowLayoutType = exports.FcrUIVideoWindowFoldSortingPriority = exports.FcrUILayoutType = void 0;
 var FcrUIVideoWindowLayoutType = exports.FcrUIVideoWindowLayoutType = /*#__PURE__*/function (FcrUIVideoWindowLayoutType) {
-  /** Show a carousel on top and a big video on the rest of the screen. */
   FcrUIVideoWindowLayoutType["Speaker"] = "speaker";
-  /** Show videos in grid, filling the screen. */
   FcrUIVideoWindowLayoutType["Gallery"] = "gallery";
   return FcrUIVideoWindowLayoutType;
 }({});
@@ -51,4 +49,9 @@ var FcrUIWindowType = exports.FcrUIWindowType = /*#__PURE__*/function (FcrUIWind
   FcrUIWindowType[FcrUIWindowType["VIDEO"] = 1] = "VIDEO";
   FcrUIWindowType[FcrUIWindowType["BOARD"] = 2] = "BOARD";
   return FcrUIWindowType;
+}({});
+var FcrUILayoutType = exports.FcrUILayoutType = /*#__PURE__*/function (FcrUILayoutType) {
+  FcrUILayoutType["CAROUSEL"] = "carousel";
+  FcrUILayoutType["GALLERY"] = "gallery";
+  return FcrUILayoutType;
 }({});

package/lib/modules/live-streaming/store.d.ts

@@ -15,6 +15,7 @@ export default class LiveStreamingStore {
     private _messageProvider;
     private _sharedVideoWindowDataSource;
     private _sharedMemberDataSource;
+    private _hasDoneRequestStartLiveStreaming;
     get liveStreamingState(): FcrLiveStreamingState;
     get videoStreamingUrl(): string;
     get videoStreamingKey(): string;

package/lib/modules/live-streaming/store.js

@@ -43,6 +43,7 @@ require("core-js/modules/es.array.push.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/es.string.iterator.js");
 require("core-js/modules/es.weak-map.js");
+require("core-js/modules/esnext.async-iterator.for-each.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.for-each.js");
 require("core-js/modules/esnext.weak-map.delete-all.js");
@@ -73,7 +74,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 function _setFunctionName(e, t, n) { "symbol" == _typeof(t) && (t = (t = t.description) ? "[" + t + "]" : ""); try { Object.defineProperty(e, "name", { configurable: !0, value: n ? n + " " + t : t }); } catch (e) {} return e; }
 function _checkInRHS(e) { if (Object(e) !== e) throw TypeError("right-hand side of 'in' should be an object, got " + (null !== e ? _typeof(e) : "null")); return e; }
 var _A = /*#__PURE__*/new WeakMap();
-_ref = (_onLiveButtonClickDecs = [_mobx.action, _mobx.action.bound], _startLiveStreamingDecs = [_mobx.action, _mobx.action.bound], "logger");
+_ref = (_onLiveButtonClickDecs = [_mobx.action, _mobx.action.bound, void 0, (0, _decorator.debounced)(800)], _startLiveStreamingDecs = [_mobx.action, _mobx.action.bound], "logger");
 var LiveStreamingStore = exports["default"] = /*#__PURE__*/function () {
   function LiveStreamingStore(_ref2) {
     var _this = this;
@@ -89,6 +90,7 @@ var LiveStreamingStore = exports["default"] = /*#__PURE__*/function () {
     })));
     _classPrivateFieldInitSpec(this, _A, _init_isStartError(this, false));
     (0, _defineProperty2["default"])(this, "_disposers", []);
+    (0, _defineProperty2["default"])(this, "_hasDoneRequestStartLiveStreaming", true);
     this._roomControl = roomControl;
     this._roomProvider = roomProvider;
     this._dialogProvider = dialogProvider;
@@ -193,31 +195,41 @@ var LiveStreamingStore = exports["default"] = /*#__PURE__*/function () {
           while (1) switch (_context2.prev = _context2.next) {
             case 0:
               _context2.prev = 0;
-              _context2.next = 3;
+              if (!this._hasDoneRequestStartLiveStreaming) {
+                _context2.next = 7;
+                break;
+              }
+              this._hasDoneRequestStartLiveStreaming = false;
+              _context2.next = 5;
               return this._roomProvider.startLiveStreaming({
                 pushStreamingUrl: videoSteamingUrl,
                 pullStreamingUrl: playUrl,
                 pushStreamingKey: videoStreamingKey,
                 layoutType: this._layoutView === 'speaker' ? _type.FcrLiveStreamingLayoutType.SPEAKER : _type.FcrLiveStreamingLayoutType.GALLERY
               });
-            case 3:
+            case 5:
               (0, _mobx.runInAction)(function () {
                 _this2.isStartError = false;
               });
               this._dialogProvider.closeLiveStreamingDialog();
-              _context2.next = 10;
-              break;
             case 7:
-              _context2.prev = 7;
+              _context2.next = 12;
+              break;
+            case 9:
+              _context2.prev = 9;
               _context2.t0 = _context2["catch"](0);
               (0, _mobx.runInAction)(function () {
                 _this2.isStartError = true;
               });
-            case 10:
+            case 12:
+              _context2.prev = 12;
+              this._hasDoneRequestStartLiveStreaming = true;
+              return _context2.finish(12);
+            case 15:
             case "end":
               return _context2.stop();
           }
-        }, _callee2, this, [[0, 7]]);
+        }, _callee2, this, [[0, 9, 12, 15]]);
       }));
       function _startLiveStreaming(_x4, _x5, _x6) {
         return _startLiveStreaming2.apply(this, arguments);

package/lib/modules/notification/interpreter-status/index.js

@@ -8,8 +8,7 @@ exports.InterpreterStatus = void 0;
 require("core-js/modules/es.array.concat.js");
 require("core-js/modules/es.array.join.js");
 require("core-js/modules/es.array.map.js");
-require("core-js/modules/es.object.to-string.js");
-require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.async-iterator.map.js");
 require("core-js/modules/esnext.iterator.map.js");
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");

package/lib/modules/offscreen-pulling/index.js

@@ -15,6 +15,7 @@ require("core-js/modules/es.map.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/es.parse-int.js");
 require("core-js/modules/es.string.iterator.js");
+require("core-js/modules/esnext.async-iterator.for-each.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.for-each.js");
 require("core-js/modules/esnext.map.delete-all.js");

package/lib/modules/participant/components/confirm-input/index.d.ts

@@ -1,6 +1,6 @@
-declare function ConfirmInput(props: {
+export declare const FcrConfirmInput: (props: {
     onChange: (name: string | number) => void;
     placeholder?: string;
-    type?: 'number' | 'text';
-}): import("react/jsx-runtime").JSX.Element;
-export default ConfirmInput;
+    type?: "number" | "text";
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const FcrWrapConfirmRenameForm: () => import("react/jsx-runtime").JSX.Element;