fcr-ui-scene 3.8.1 → 3.9.0-alpha

package/lib/modules/invite/components/pstn-invite.js

@@ -24,8 +24,8 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _classnames = _interopRequireDefault(require("classnames"));
 var _mobxReact = require("mobx-react");
 var _react = _interopRequireWildcard(require("react"));
+var _regex = require("agora-foundation/lib/utilities/regex");
 var _store = require("../store");
-var _regex = require("../../../utilities/regex");
 var _actionPhone = require("agora-ui-foundation/lib/components/action-phone");
 var _button = require("agora-ui-foundation/lib/components/button");
 var _input = require("agora-ui-foundation/lib/components/input");
@@ -33,7 +33,8 @@ var _zonePhone = require("agora-ui-foundation/lib/components/zone-phone");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _errorTips = require("./error-tips");
 var _enums = require("../enums");
-var _browserApi = require("../../../utilities/browser-api");
+var _copyText = require("agora-ui-foundation/lib/utilities/copy-text");
+var _type = require("../../../modules/toast-manager/type");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var PSTNInvite = exports.PSTNInvite = (0, _mobxReact.observer)(function () {
@@ -86,10 +87,9 @@ var PSTNInvite = exports.PSTNInvite = (0, _mobxReact.observer)(function () {
     setError(input.trim().length === 0);
   }, []);
   var handleCopyMeetingDetail = (0, _react.useCallback)(function () {
-    (0, _browserApi.copyText)(roomDetailCopyText).then(function () {
+    (0, _copyText.copyText)(roomDetailCopyText).then(function () {
       showToast({
-        type: 'info',
-        message: transI18n('fmt_statusbar_status_coppied')
+        key: _type.FcrUIToastKey.FMT_STATUSBAR_STATUS_COPPIED
       });
     });
   }, []);

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

@@ -1,10 +1,13 @@
 import { UIModule } from '../../base';
 import InviteStore from './store';
 import './index.css';
+import { ReactNode } from 'react';
 export declare class InviteUIModule extends UIModule {
     private _store;
     get store(): InviteStore;
     onNodeWillActive(): void;
     onNodeWillInactive(): void;
-    getComponent(): import("react/jsx-runtime").JSX.Element;
+    getComponent(params: {
+        contactsChildren: ReactNode;
+    }): import("react/jsx-runtime").JSX.Element;
 }

package/lib/modules/invite/index.js

@@ -68,10 +68,13 @@ var InviteUIModule = exports.InviteUIModule = /*#__PURE__*/function (_UIModule)
     }
   }, {
     key: "getComponent",
-    value: function getComponent() {
+    value: function getComponent(params) {
+      var contactsChildren = params.contactsChildren;
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_store.StoreContext.Provider, {
         value: this.store,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_view.View, {})
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_view.View, {
+          contactsChildren: contactsChildren
+        })
       });
     }
   }]);

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

@@ -1,8 +1,8 @@
 import { FcrIPConnectorSessionType, FcrRoomConnectorIpInfo, FcrRoomConnectorPhoneInfo, FcrRoomConnectorPhoneRegion } from 'fcr-core/lib/room-control/room-connector-control/type';
-import { FcrUIToastParams } from '../../type';
 import { InviteStoreArgs, PstnInfo, VoipInfo } from './types';
 import { FcrRoomInfo, FcrRoomSchedule } from 'fcr-core/lib/type';
 import { FcrUIManagedObject } from '../../object-manager';
+import { FcrUIMessageShowToastbyKeyParams } from '../../providers/message/type';
 export default class InviteStore implements FcrUIManagedObject {
     protected logger: import("agora-foundation/lib/logger").Logger;
     private _pstnSessionId;
@@ -12,7 +12,10 @@ export default class InviteStore implements FcrUIManagedObject {
     private _sharedMeetingTimeDataSource;
     private _mainRoomControl;
     private _messageProvider;
+    private _widgetProvider;
     private _roomConnectorControl;
+    private _dialogProvider;
+    private _dialogProviderObserver;
     accessor roomInfo: FcrRoomInfo;
     accessor roomSchedule: FcrRoomSchedule;
     accessor meetingId: string;
@@ -38,13 +41,14 @@ export default class InviteStore implements FcrUIManagedObject {
     get meetingTimeStatus(): import("../../shared-data/meeting-time").MeetingStatus;
     get meetingTime(): string;
     get roomId(): string;
+    get widgetConfigByContacts(): import("../../type").FcrUIWebWidgetConfig | undefined;
     constructor({ objectManager }: InviteStoreArgs);
     closeInviteDialog(): void;
     release(): void;
     stopSession(type: 'pstn' | 'voip'): Promise<void>;
     startSessionByPhone({ phoneNumber, userName, zone }: PstnInfo): Promise<void>;
     startSessionByVoip(address: string, ipType: FcrIPConnectorSessionType): Promise<void>;
-    showToast(params: FcrUIToastParams): void;
+    showToast(params: FcrUIMessageShowToastbyKeyParams): void;
     private _getRoomConnectorIpInfo;
     private _getRoomConnectorPhoneInfo;
     private handleError;

package/lib/modules/invite/store.js

@@ -38,12 +38,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = exports.StoreContext = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+require("core-js/modules/es.array.find.js");
 require("core-js/modules/es.array.iterator.js");
 require("core-js/modules/es.array.map.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.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.find.js");
 require("core-js/modules/esnext.iterator.map.js");
 require("core-js/modules/esnext.weak-map.delete-all.js");
 require("core-js/modules/esnext.weak-map.emplace.js");
@@ -58,10 +60,12 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _mobx = require("mobx");
 var _type = require("fcr-core/lib/room-control/room-connector-control/type");
 var _react = require("react");
+var _type2 = require("../../type");
 var _enums = require("./enums");
 var _objectManager = require("../../object-manager");
 var _logger = require("../../utilities/logger");
 var _meetingDetail = require("../../utilities/meeting-detail");
+var _constant = require("../../utilities/constant");
 var _InviteStore;
 var _initProto, _init_InviteStatus, _init_isPstnCalling, _init_isVoipCalling, _init_ipInfo, _init_phoneInfo, _init_calledPstnInfo, _init_calledVoipInfo, _stopSessionDecs, _startSessionByPhoneDecs, _startSessionByVoipDecs, _showToastDecs, _getRoomConnectorIpInfoDecs, _getRoomConnectorPhoneInfoDecs, _handleErrorDecs, _updateInviteStatusDecs, _resetpstnStatusDecs, _resetVoipStatusDecs, _handlePhoneConnectorSessionStateUpdatedDecs, _handleIPConnectorSessionStateUpdatedDecs, _ref;
 function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); }
@@ -88,7 +92,8 @@ var _K = /*#__PURE__*/new WeakMap();
 _ref = (_stopSessionDecs = [_mobx.action, _mobx.action.bound], _startSessionByPhoneDecs = [_mobx.action, _mobx.action.bound], _startSessionByVoipDecs = [_mobx.action, _mobx.action.bound], _showToastDecs = [_mobx.action, _mobx.action.bound], _getRoomConnectorIpInfoDecs = [_mobx.action, _mobx.action.bound], _getRoomConnectorPhoneInfoDecs = [_mobx.action, _mobx.action.bound], _handleErrorDecs = [_mobx.action, _mobx.action.bound], _updateInviteStatusDecs = [_mobx.action, _mobx.action.bound], _resetpstnStatusDecs = [_mobx.action, _mobx.action.bound], _resetVoipStatusDecs = [_mobx.action, _mobx.action.bound], _handlePhoneConnectorSessionStateUpdatedDecs = [_mobx.action, _mobx.action.bound], _handleIPConnectorSessionStateUpdatedDecs = [_mobx.action, _mobx.action.bound], "logger");
 var InviteStore = exports["default"] = /*#__PURE__*/function () {
   function InviteStore(_ref2) {
-    var _ref3;
+    var _this = this,
+      _ref3;
     var objectManager = _ref2.objectManager;
     (0, _classCallCheck2["default"])(this, InviteStore);
     (0, _defineProperty2["default"])(this, _ref, (_initProto(this), (0, _logger.createLogger)({
@@ -100,6 +105,28 @@ var InviteStore = exports["default"] = /*#__PURE__*/function () {
       onPhoneConnectorSessionStateUpdated: this._handlePhoneConnectorSessionStateUpdated,
       onIPConnectorSessionStateUpdated: this._handleIPConnectorSessionStateUpdated
     });
+    (0, _defineProperty2["default"])(this, "_dialogProviderObserver", {
+      onDialogClose: function onDialogClose(dialogKey) {
+        if (dialogKey === _constant.FcrUIDialogKey.INVITE) {
+          var widgetConfigByContacts = _this.widgetConfigByContacts;
+          if (widgetConfigByContacts) {
+            _this._widgetProvider.closeWidget(widgetConfigByContacts.id);
+          } else {
+            _this.logger.info('widgetConfigByContacts closed');
+          }
+        }
+      },
+      onDialogOpen: function onDialogOpen(dialogKey) {
+        if (dialogKey === _constant.FcrUIDialogKey.INVITE) {
+          var widgetConfigByContacts = _this.widgetConfigByContacts;
+          if (widgetConfigByContacts) {
+            _this._widgetProvider.openWidget(widgetConfigByContacts.id);
+          } else {
+            _this.logger.info('widgetConfigByContacts not found');
+          }
+        }
+      }
+    });
     _classPrivateFieldInitSpec(this, _A, void 0);
     _classPrivateFieldInitSpec(this, _B, void 0);
     _classPrivateFieldInitSpec(this, _C, '');
@@ -126,6 +153,8 @@ var InviteStore = exports["default"] = /*#__PURE__*/function () {
     this._roomConnectorControl = this._mainRoomControl.getRoomConnectorControl();
     this._sharedMemberDataSource = objectManager.getObject(_objectManager.FcrUIObjectKeys.S_SHARED_MEMBER_DATA_SOURCE);
     this._sharedMeetingTimeDataSource = objectManager.getObject(_objectManager.FcrUIObjectKeys.S_SHARED_MEETING_TIME_DATA_SOURCE);
+    this._widgetProvider = objectManager.getObject(_objectManager.FcrUIObjectKeys.P_WIDGET_PROVIDER);
+    this._dialogProvider = objectManager.getObject(_objectManager.FcrUIObjectKeys.P_DIALOG_PROVIDER);
     this._roomConnectorControl.addObserver(this._roomConnectorObserver);
     this._getRoomConnectorPhoneInfo();
     this._getRoomConnectorIpInfo();
@@ -133,6 +162,7 @@ var InviteStore = exports["default"] = /*#__PURE__*/function () {
     this.roomSchedule = this._mainRoomControl.getRoomSchedule();
     this.meetingId = (_ref3 = this._mainRoomControl.getRoomPropertiesByKeyPath('meetingId')) !== null && _ref3 !== void 0 ? _ref3 : this.roomId;
     this.localUserName = this._mainRoomControl.getUserControl().getLocalUser().userName;
+    this._dialogProvider.addObserver(this._dialogProviderObserver);
   }
   return (0, _createClass2["default"])(InviteStore, [{
     key: "roomInfo",
@@ -275,6 +305,14 @@ var InviteStore = exports["default"] = /*#__PURE__*/function () {
     get: function get() {
       return this.roomInfo.roomId;
     }
+  }, {
+    key: "widgetConfigByContacts",
+    get: function get() {
+      var contacts = this._widgetProvider.supportedWidgetConfigs.find(function (widgetConfig) {
+        return widgetConfig.id === _type2.CONTACTS_WIDGET_ID;
+      });
+      return contacts;
+    }
   }, {
     key: "closeInviteDialog",
     value: function closeInviteDialog() {
@@ -289,6 +327,7 @@ var InviteStore = exports["default"] = /*#__PURE__*/function () {
     key: "release",
     value: function release() {
       this._roomConnectorControl.removeObserver(this._roomConnectorObserver);
+      this._dialogProvider.removeObserver(this._dialogProviderObserver);
     }
   }, {
     key: "stopSession",
@@ -411,7 +450,7 @@ var InviteStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "showToast",
     value: function showToast(params) {
-      this._messageProvider.showToast(params);
+      this._messageProvider.showToastByKey(params);
     }
   }, {
     key: "_getRoomConnectorIpInfo",
@@ -460,13 +499,13 @@ var InviteStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "handleError",
     value: function handleError(info, error, sessionType) {
-      var _this = this;
+      var _this2 = this;
       this.updateInviteStatus(info, _enums.InviteStatus.ERROR);
       setTimeout(function () {
         if (sessionType === 'pstn') {
-          _this.isPstnCalling = false;
+          _this2.isPstnCalling = false;
         } else if (sessionType === 'voip') {
-          _this.isVoipCalling = false;
+          _this2.isVoipCalling = false;
         }
       }, 1500);
     }
@@ -490,7 +529,7 @@ var InviteStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_handlePhoneConnectorSessionStateUpdated",
     value: function _handlePhoneConnectorSessionStateUpdated(session, state, reason) {
-      var _this2 = this;
+      var _this3 = this;
       if (session.phoneNumber !== this.calledPstnInfo.phoneNumber) {
         return;
       }
@@ -505,14 +544,14 @@ var InviteStore = exports["default"] = /*#__PURE__*/function () {
       }
       if (state === _type.FcrRoomConnectorSessionState.END) {
         setTimeout(function () {
-          _this2._resetpstnStatus();
+          _this3._resetpstnStatus();
         }, 1.5 * 1000);
       }
     }
   }, {
     key: "_handleIPConnectorSessionStateUpdated",
     value: function _handleIPConnectorSessionStateUpdated(session, state, reason) {
-      var _this3 = this;
+      var _this4 = this;
       if (session.address !== this.calledVoipInfo.address) {
         return;
       }
@@ -527,14 +566,14 @@ var InviteStore = exports["default"] = /*#__PURE__*/function () {
       }
       if (state === _type.FcrRoomConnectorSessionState.END) {
         setTimeout(function () {
-          _this3._resetVoipStatus();
+          _this4._resetVoipStatus();
         }, 1.5 * 1000);
       }
     }
   }]);
 }();
 _InviteStore = InviteStore;
-var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_InviteStore, [[_mobx.observable, 1, "InviteStatus"], [_mobx.observable, 1, "isPstnCalling"], [_mobx.observable, 1, "isVoipCalling"], [_mobx.observable, 1, "ipInfo"], [_mobx.observable, 1, "phoneInfo"], [_mobx.observable, 1, "calledPstnInfo"], [_mobx.observable, 1, "calledVoipInfo"], [_stopSessionDecs, 18, "stopSession"], [_startSessionByPhoneDecs, 18, "startSessionByPhone"], [_startSessionByVoipDecs, 18, "startSessionByVoip"], [_showToastDecs, 18, "showToast"], [_getRoomConnectorIpInfoDecs, 18, "_getRoomConnectorIpInfo"], [_getRoomConnectorPhoneInfoDecs, 18, "_getRoomConnectorPhoneInfo"], [_handleErrorDecs, 18, "handleError"], [_updateInviteStatusDecs, 18, "updateInviteStatus"], [_resetpstnStatusDecs, 18, "_resetpstnStatus"], [_resetVoipStatusDecs, 18, "_resetVoipStatus"], [_handlePhoneConnectorSessionStateUpdatedDecs, 18, "_handlePhoneConnectorSessionStateUpdated"], [_handleIPConnectorSessionStateUpdatedDecs, 18, "_handleIPConnectorSessionStateUpdated"]], []).e, 8);
+var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_InviteStore, [[_mobx.observable, 1, "InviteStatus"], [_mobx.observable, 1, "isPstnCalling"], [_mobx.observable, 1, "isVoipCalling"], [_mobx.observable, 1, "ipInfo"], [_mobx.observable, 1, "phoneInfo"], [_mobx.observable, 1, "calledPstnInfo"], [_mobx.observable, 1, "calledVoipInfo"], [_mobx.computed, 3, "widgetConfigByContacts"], [_stopSessionDecs, 18, "stopSession"], [_startSessionByPhoneDecs, 18, "startSessionByPhone"], [_startSessionByVoipDecs, 18, "startSessionByVoip"], [_showToastDecs, 18, "showToast"], [_getRoomConnectorIpInfoDecs, 18, "_getRoomConnectorIpInfo"], [_getRoomConnectorPhoneInfoDecs, 18, "_getRoomConnectorPhoneInfo"], [_handleErrorDecs, 18, "handleError"], [_updateInviteStatusDecs, 18, "updateInviteStatus"], [_resetpstnStatusDecs, 18, "_resetpstnStatus"], [_resetVoipStatusDecs, 18, "_resetVoipStatus"], [_handlePhoneConnectorSessionStateUpdatedDecs, 18, "_handlePhoneConnectorSessionStateUpdated"], [_handleIPConnectorSessionStateUpdatedDecs, 18, "_handleIPConnectorSessionStateUpdated"]], []).e, 8);
 _init_InviteStatus = _applyDecs$e[0];
 _init_isPstnCalling = _applyDecs$e[1];
 _init_isVoipCalling = _applyDecs$e[2];

package/lib/modules/invite/view.d.ts

@@ -1 +1,4 @@
-export declare const View: () => import("react/jsx-runtime").JSX.Element;
+import { ReactNode } from 'react';
+export declare const View: (props: {
+    contactsChildren: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/invite/view.js

@@ -6,6 +6,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.View = void 0;
+require("core-js/modules/es.array.push.js");
+require("core-js/modules/es.function.name.js");
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _mobxReact = require("mobx-react");
 var _react = require("react");
@@ -14,26 +16,39 @@ var _voipInvite = require("./components/voip-invite");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _tabFrame = _interopRequireDefault(require("../components/tab-frame"));
 var _enums = require("./enums");
+var _store = require("./store");
 var _jsxRuntime = require("react/jsx-runtime");
-var View = exports.View = (0, _mobxReact.observer)(function () {
+var View = exports.View = (0, _mobxReact.observer)(function (props) {
+  var contactsChildren = props.contactsChildren;
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    widgetConfigByContacts = _useContext.widgetConfigByContacts;
+  var widgetConfigByContactsId = widgetConfigByContacts === null || widgetConfigByContacts === void 0 ? void 0 : widgetConfigByContacts.id;
   var _useState = (0, _react.useState)(_enums.InviteType.PSTN),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     currentInviteType = _useState2[0],
     setCurrentInviteType = _useState2[1];
   var transI18n = (0, _i18n.useI18n)();
+  var tabs = [{
+    label: "".concat(transI18n('fmt_pstn_label_phonecall')),
+    key: _enums.InviteType.PSTN,
+    content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pstnInvite.PSTNInvite, {})
+  }, {
+    label: "".concat(transI18n('fmt_sip_options_H323')),
+    key: _enums.InviteType.VOIP,
+    content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_voipInvite.VoipInvite, {})
+  }];
+  if (widgetConfigByContacts) {
+    tabs.push({
+      label: widgetConfigByContacts.name,
+      key: widgetConfigByContactsId,
+      content: contactsChildren
+    });
+  }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tabFrame["default"], {
     activeKey: currentInviteType,
     onChange: function onChange(key) {
       return setCurrentInviteType(key);
     },
-    tabs: [{
-      label: "".concat(transI18n('fmt_pstn_label_phonecall')),
-      key: _enums.InviteType.PSTN,
-      content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_pstnInvite.PSTNInvite, {})
-    }, {
-      label: "".concat(transI18n('fmt_sip_options_H323')),
-      key: _enums.InviteType.VOIP,
-      content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_voipInvite.VoipInvite, {})
-    }]
+    tabs: tabs
   });
 });

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

@@ -14,7 +14,7 @@ var _react = require("react");
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
 var _windowHeader = require("agora-ui-foundation/lib/components/window-header");
-var _hooks = require("../../../utilities/hooks");
+var _hooks = require("agora-ui-foundation/lib/utilities/hooks");
 var _store = require("../store.base");
 var _utils = require("./utils");
 var _i18n = require("agora-ui-foundation/lib/i18n");

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

@@ -14,7 +14,7 @@ var _mobxReact = require("mobx-react");
 var _react = require("react");
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
-var _hooks = require("../../../utilities/hooks");
+var _hooks = require("agora-ui-foundation/lib/utilities/hooks");
 var _store = require("../store.base");
 var _type2 = require("../type");
 var _utils = require("./utils");

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

@@ -112,7 +112,11 @@ var CommonVideoRenderer = exports.CommonVideoRenderer = (0, _mobxReact.observer)
     localUser = _useContext3.localUser,
     hasMutePermission = _useContext3.hasMutePermission,
     hasUnmutePermission = _useContext3.hasUnmutePermission,
-    hasRequestStartAudioPermission = _useContext3.hasRequestStartAudioPermission;
+    hasRequestStartAudioPermission = _useContext3.hasRequestStartAudioPermission,
+    setControlbarEnabled = _useContext3.setControlbarEnabled,
+    controlbarEnabled = _useContext3.controlbarEnabled,
+    isAnnotationOpened = _useContext3.isAnnotationOpened,
+    hasAnnotationWritePermission = _useContext3.hasAnnotationWritePermission;
   var getFormatWindowData = useFormatWindowData();
   var commonProps = useCommonProps(layoutType);
   var toggleFullScreen = function toggleFullScreen() {
@@ -204,6 +208,8 @@ var CommonVideoRenderer = exports.CommonVideoRenderer = (0, _mobxReact.observer)
     setScaleValue(1);
     return false;
   }, [scalcValue]);
+  var showEnterBoardEdit = isAnnotationOpened ? !controlbarEnabled : false;
+  var showExitBoardEdit = isAnnotationOpened ? controlbarEnabled : false;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
     children: data.map(function (windowData) {
       var windowId = windowData.windowId,
@@ -234,14 +240,18 @@ var CommonVideoRenderer = exports.CommonVideoRenderer = (0, _mobxReact.observer)
             height: dimensions.height
           },
           className: clsWithShareControlBar,
-          children: [isMainWindowInScreenSharing && screenShareControl, isMainWindowInScreenSharing && /*#__PURE__*/(0, _jsxRuntime.jsx)(_controlBar.WhiteboardControlbar, {
+          children: [isMainWindowInScreenSharing && screenShareControl, isMainWindowInScreenSharing && /*#__PURE__*/(0, _jsxRuntime.jsx)(_controlBar.ScreenShareControlbar, {
             ownerUserName: windowData.userName,
-            sharingType: 'annotation',
             onZoomIn: handleZoomIn,
             onZoomOut: handleZoomOut,
             onAdaptive: handleAdaptive,
             onOrigin: handleOrigin,
-            isSharingAudio: windowData.hasLoopbackSharing && windowData.hasMicrophoneAudioStream
+            isSharingAudio: windowData.hasLoopbackSharing && windowData.hasMicrophoneAudioStream,
+            onEnable: setControlbarEnabled,
+            controlEnabled: controlbarEnabled,
+            showEnterBoardEdit: showEnterBoardEdit,
+            showExitBoardEdit: showExitBoardEdit,
+            canWriteBoard: hasAnnotationWritePermission
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_memberWindow.MemberWindow, {
             memberWindowPreviewType: commonProps.memberWindowPreviewType,
             canShowSpeakerSpotlight: commonProps.canShowSpeakerSpotlight,

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

@@ -31,7 +31,7 @@ var _mobxReact = require("mobx-react");
 var _react = require("react");
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
-var _hooks = require("../../../utilities/hooks");
+var _hooks = require("agora-ui-foundation/lib/utilities/hooks");
 var _store = require("../store.base");
 var _type2 = require("../type");
 var _utils = require("./utils");

package/lib/modules/layout/index.css

@@ -26,34 +26,3 @@
   z-index: 1000;
   height: 0;
 }
-
-.login-confirm-dialog-content {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-  padding: 20px;
-}
-
-.login-confirm-dialog-content img {
-  margin-top: -36px;
-  margin-bottom: 24px;
-}
-
-.login-confirm-dialog-title {
-  font-weight: 600;
-  font-size: 16px;
-  margin-bottom: 10px;
-}
-
-.login-confirm-dialog-desc {
-  margin-bottom: 20px;
-}
-
-.login-confirm-dialog-btn {
-  width: 100%;
-}
-
-.login-confirm-dialog-content .fcr-button {
-  width: 100%;
-}

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

@@ -1,6 +1,6 @@
 import { FcrPrivilegeUserRole, FcrStreamControl } from 'fcr-core';
 import { FcrUserInfo, FcrUserRole } from 'fcr-core/lib/type';
-import { FcrLayoutSlots, FcrUIVideoWindowData, FcrUIVideoWindowLayoutType, LayoutStoreArgs } from './type';
+import { FcrLayoutSlots, FcrUIVideoWindowLayoutType, LayoutStoreArgs } from './type';
 import { FcrChatRoomConnectionState } from 'fcr-core/lib/room-control/chatroom-control/type';
 import { FcrUserUpdatedEvent } from 'fcr-core/lib/room-control/user-control/type';
 import { FcrUIEventObserver, FcrUIEventProvider } from '../../providers/event-provider';
@@ -9,8 +9,9 @@ import { FcrUIManagedObject } from '../../object-manager';
 import { FcrUIDisplayDistributionContentType, SharingType } from '../secondary-window/type';
 import { FcrUIDialogProvider } from '../../providers/dialog/type';
 export declare abstract class LayoutStoreBase implements FcrLayoutSlots, FcrUIEventObserver, FcrUIManagedObject {
-    private readonly logger;
+    protected readonly logger: import("agora-foundation/lib/logger").Logger;
     private _videoWindowDataSource;
+    private _sharedUserAudioVolumeDataSource;
     protected _eventProvider: FcrUIEventProvider;
     private _messageProvider;
     protected _dialogProvider: FcrUIDialogProvider;
@@ -32,10 +33,7 @@ export declare abstract class LayoutStoreBase implements FcrLayoutSlots, FcrUIEv
     private _chatProvider;
     private _pinDataSource;
     private _sharedScreenShareDataSource;
-    private _roomProvider;
-    private _roomProviderObserver;
-    private _roomObserver;
-    private _streamObserverByVolumeIndicationUpdated;
+    private _annotationProvider;
     accessor participant: React.ReactNode;
     accessor chat: React.ReactNode;
     accessor chatAction: React.ReactNode;
@@ -54,7 +52,6 @@ export declare abstract class LayoutStoreBase implements FcrLayoutSlots, FcrUIEv
     accessor barLocked: boolean;
     accessor barHidden: boolean;
     accessor asideWidth: number;
-    accessor userVolumeMap: Map<string, number>;
     accessor chatRoomState: FcrChatRoomConnectionState;
     accessor whiteboardActive: boolean;
     accessor ownerUser: FcrUserInfo | undefined;
@@ -63,17 +60,15 @@ export declare abstract class LayoutStoreBase implements FcrLayoutSlots, FcrUIEv
     get localUser(): FcrUserInfo;
     get shouldHideNonVideoParticipants(): boolean;
     get shouldHideMyVideo(): boolean;
-    get enableSpotlight(): boolean;
+    get userVolumeMap(): Map<string, number>;
     get isWaterMarkEnabled(): boolean;
     get isMulti(): boolean;
     get layout(): import("../../type").FcrUIVideoWindowLayoutType;
     get manualLayout(): import("../../type").FcrUIVideoWindowLayoutType | undefined;
     get scalcValue(): number;
-    get annotationHasStart(): boolean;
     get sourceList(): import("../../shared-data/video-window").FcrUIVideoWindowDataImpl[];
     get layoutMainList(): import("../../shared-data/video-window").FcrUIVideoWindowDataImpl[];
     get mainList(): import("../../shared-data/video-window").FcrUIVideoWindowDataImpl[];
-    get mainListMapByAudioStreamId(): Map<string, FcrUIVideoWindowData>;
     get spotlightStreamId(): string;
     get foldList(): import("../../shared-data/video-window").FcrUIVideoWindowDataImpl[];
     get currentShareData(): import("../../shared-data/video-window").FcrUIVideoWindowDataImpl | undefined;
@@ -113,6 +108,9 @@ export declare abstract class LayoutStoreBase implements FcrLayoutSlots, FcrUIEv
     get participantsRenderAt(): "aside" | "dialog";
     get chatRenderAt(): "aside" | "dialog";
     get subtitlesHistoryRenderAt(): "aside" | "dialog";
+    get controlbarEnabled(): boolean;
+    get isAnnotationOpened(): boolean;
+    get hasAnnotationWritePermission(): boolean;
     getWaterMarkContent(): string;
     hasMutePermission(targetRole: FcrPrivilegeUserRole | FcrUserRole): boolean;
     hasUnmutePermission(targetRole: FcrPrivilegeUserRole | FcrUserRole): boolean;
@@ -160,6 +158,7 @@ export declare abstract class LayoutStoreBase implements FcrLayoutSlots, FcrUIEv
     setAllowChatWithPayload(type: 'public' | 'private_to_manager'): void;
     setScaleValue(scale: number): void;
     muteAudio(mute: boolean, userId: string): void;
+    setControlbarEnabled(enabled: boolean): void;
     sendParticipantEvent(payload: unknown): void;
     onEvent(action: FcrUIAction.TOGGLE_LAYOUT_BAR_LOCK, payload: boolean): void;
     /**
@@ -180,15 +179,10 @@ export declare abstract class LayoutStoreBase implements FcrLayoutSlots, FcrUIEv
     private _handleConnectionUpdated;
     private _findVideoWindowByUserId;
     private _onRemoteUsersLeft;
-    private _handleRoutingChanged;
-    private _handleRoomProviderLiveStreamingStateUpdated;
     private _handleLiveStreamingStateUpdated;
     private _handleStreamAdded;
     private _onStreamsAdded;
     private _onStreamsUpdated;
     private _onStreamsRemoved;
-    private _onAudioVolumeUpdated;
-    private _setSpotlightStream;
-    private _findSpotlightStream;
 }
 export declare const StoreContext: import("react").Context<LayoutStoreBase>;