fcr-ui-scene 3.1.1 → 3.3.0

package/lib/modules/state-bar/context.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import StateBarStore from './store';
 export declare const StoreContext: import("react").Context<StateBarStore>;

package/lib/modules/state-bar/index.css

@@ -486,7 +486,7 @@
 .fcr-state-bar__meeting-info-drop .fcr-drop-menu {
   width: 100%;
   border: 1px solid var(--fcr_ui_scene_line1);
-  box-shadow: 0 0 15px 0 var(--fcr_web_light_dropup_m);
+  box-shadow: var(--fcr_web_light_dropup_m);
 }
 .fcr-state-bar__meeting-info-drop .fcr-drop-menu-option-text {
   overflow: hidden;
@@ -527,7 +527,7 @@
 .fcr-state-bar__meeting-info-drop .fcr-drop-menu {
   width: 100%;
   border: 1px solid var(--fcr_ui_scene_line1);
-  box-shadow: 0 0 15px 0 var(--fcr_web_light_dropup_m);
+  box-shadow: var(--fcr_web_light_dropup_m);
 }
 .fcr-state-bar__meeting-info-drop .fcr-drop-menu-option-text {
   overflow: hidden;

package/lib/modules/state-bar/index.d.ts

@@ -1,13 +1,13 @@
 import { UIModule } from '../../base';
 import './index.css';
-import { FcrMainRoomControl } from 'agora-edu-core';
 import { FcrUIEventStore } from '../../common/event-store';
 import { FcrSecurityStore } from '../../common/security-store';
 import { FcrUISceneConfig } from '../../type';
+import { FcrMainRoomControl, FcrWaitingRoomControl } from 'agora-edu-core/lib/room-control/type';
 export declare class StateBarUIModule extends UIModule {
     private _store;
     constructor({ roomControl, uiEventStore, securityStore, config, }: {
-        roomControl: FcrMainRoomControl;
+        roomControl: FcrMainRoomControl | FcrWaitingRoomControl;
         uiEventStore: FcrUIEventStore;
         securityStore: FcrSecurityStore;
         config: FcrUISceneConfig;

package/lib/modules/state-bar/index.dev.js

@@ -16,7 +16,7 @@ var _jsxRuntime = require("react/jsx-runtime");
 var App = (0, _root.hot)(function () {
   return null;
 });
-_reactDom["default"].render( /*#__PURE__*/(0, _jsxRuntime.jsx)(App, {}), document.querySelector('#root'));
+_reactDom["default"].render(/*#__PURE__*/(0, _jsxRuntime.jsx)(App, {}), document.querySelector('#root'));
 var Layout = function Layout(props) {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     style: {
@@ -26,25 +26,27 @@ var Layout = function Layout(props) {
     children: props.children
   });
 };
-window.__DEV_ENGINE_IS_READY__.then( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
-  var engine, roomId, roomControl, uiEventStore, securityStore, uiModule, App;
+window.__DEV_ENGINE_IS_READY__.then(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
+  var engine, roomId, token, roomControl, uiEventStore, securityStore, uiModule, App;
   return _regenerator["default"].wrap(function _callee$(_context) {
     while (1) switch (_context.prev = _context.next) {
       case 0:
         engine = window.__DEV_ENGINE__;
         roomId = window.__DEV_ROOM_ID__;
-        _context.next = 4;
+        token = window.__DEV_USER_TOKEN__;
+        _context.next = 5;
         return engine.login();
-      case 4:
-        roomControl = engine.createRoomControl(roomId);
-        _context.next = 7;
+      case 5:
+        roomControl = engine.createMainRoomControl(roomId);
+        _context.next = 8;
         return roomControl.join({
           userRole: _type.FcrUserRole.HOST,
           userName: 'test-user',
+          roomToken: token,
           streamLatency: _type.FcrStreamLatencyLevel.ULTRA_LOW,
           createStreamConfigs: []
         });
-      case 7:
+      case 8:
         setInterval(function () {
           //@ts-ignore
           roomControl._observable.notifyObservers('onNetworkStatsUpdated', roomId, {
@@ -71,10 +73,10 @@ window.__DEV_ENGINE_IS_READY__.then( /*#__PURE__*/(0, _asyncToGenerator2["defaul
           }, []);
           return uiModule.getComponent();
         });
-        _reactDom["default"].render( /*#__PURE__*/(0, _jsxRuntime.jsx)(Layout, {
+        _reactDom["default"].render(/*#__PURE__*/(0, _jsxRuntime.jsx)(Layout, {
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(App, {})
         }), document.querySelector('#root'));
-      case 13:
+      case 14:
       case "end":
         return _context.stop();
     }

package/lib/modules/state-bar/layout-config.js

@@ -8,6 +8,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.LayoutConfig = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 require("core-js/modules/es.array.map.js");
+require("core-js/modules/esnext.async-iterator.map.js");
+require("core-js/modules/esnext.iterator.map.js");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _mobxReact = require("mobx-react");
 var _useNamespace = require("../../utilities/useNamespace");

package/lib/modules/state-bar/live-streaming-state.js

@@ -8,6 +8,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.LiveStreamingState = void 0;
 require("core-js/modules/es.array.filter.js");
 require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/esnext.async-iterator.filter.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.filter.js");
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");

package/lib/modules/state-bar/meeting-detail.css

@@ -18,15 +18,17 @@
 }
 
 .meeting-details__content {
-  margin-top: 10px;
+  margin-top: 12px;
 }
 
 .meeting-details__content-meeting-subject {
   font-size: 12px;
-  font-weight: 500;
+  font-weight: 600;
   color: var(--fcr_ui_scene_icontext1, #ffffff);
   word-break: break-all;
   text-align: left;
+  min-height: 32px;
+  line-height: 32px;
 }
 
 .meeting-details__content-meeting-id,
@@ -78,8 +80,8 @@
 .meeting-details__content-meeting-id > div > svg:hover,
 .meeting-details__content-code > div > svg:hover,
 .meeting-details__content-share-link > div > svg:hover {
-  background-color: var(--fcr_web_ui_scene_hover, #c9cfe04d);
-  fill: var(--fcr_web_ui_scene_hover, #c9cfe04d);
+  background-color: var(--fcr_web_ui_scene_hover);
+  fill: var(--fcr_web_ui_scene_mainicon2);
 }
 
 .meeting-details__footer {

package/lib/modules/state-bar/meeting-details.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MeetingDetails = void 0;
+require("core-js/modules/es.array.concat.js");
 require("core-js/modules/es.regexp.exec.js");
 require("core-js/modules/es.string.replace.js");
 var _button = require("agora-ui-foundation/lib/components/button");
@@ -27,17 +28,20 @@ var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function
     localUser = _useContext.localUser,
     roomInfo = _useContext.roomInfo,
     scheduleInfo = _useContext.scheduleInfo,
-    getShareLink = _useContext.getShareLink;
+    getShareLink = _useContext.getShareLink,
+    password = _useContext.password,
+    toastCopyInfo = _useContext.toastCopyInfo;
   var shareLink = (0, _react.useMemo)(function () {
     return getShareLink();
   }, []);
   if (!roomInfo || !localUser) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
   var displayMeetingId = roomInfo.roomId.replace(/(.{3})/g, '$1 ');
-  var detailText = t('fmt_sharing_label_invitationdetailed', {
+  var detailText = t('fmt_link_invitation', {
     reason1: localUser.userName,
     reason2: roomInfo === null || roomInfo === void 0 ? void 0 : roomInfo.roomName,
     reason3: (0, _dayjs["default"])((_scheduleInfo$startTi = scheduleInfo === null || scheduleInfo === void 0 ? void 0 : scheduleInfo.startTime) !== null && _scheduleInfo$startTi !== void 0 ? _scheduleInfo$startTi : 0).format('YYYY-MM-DD HH:mm:ss'),
-    reason4: shareLink
+    reason4: shareLink,
+    reason5: !!password ? "".concat(t('fmt_meeting_creatpage_label_password'), ": ").concat(password) : ''
   });
   function handleCopyMeetingId(meetingId) {
     (0, _copyText.copyText)(meetingId).then(function () {
@@ -56,6 +60,13 @@ var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function
       });
     });
   }
+  function handleCopyMeetingPassword(password) {
+    (0, _copyText.copyText)(password).then(function () {
+      toastCopyInfo('info', t('fmt_uimanager_tips_passwordcopied'));
+    })["catch"](function () {
+      toastCopyInfo('warn', t('fmt_settings_tips_passwordcopyfailed'));
+    });
+  }
   function handlerCopyMeetingShareLink(shareLink) {
     (0, _copyText.copyText)(shareLink).then(function () {
       _toast.FcrToastApi.open({
@@ -130,6 +141,21 @@ var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function
             size: 22
           })
         })]
+      }), !!password && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "meeting-details__content-share-link",
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
+          children: t('fmt_meeting_creatpage_label_password')
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          children: password
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          onClick: function onClick() {
+            return handleCopyMeetingPassword(password !== null && password !== void 0 ? password : '');
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+            type: _type.FcrIconType.FCR_COPY,
+            size: 22
+          })
+        })]
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "meeting-details__footer",

package/lib/modules/state-bar/meeting-network-state.css

@@ -11,18 +11,28 @@
 .meeting-network-state__connection {
   display: flex;
   flex-direction: column;
+  align-items: start;
   border-radius: var(--fcr_cornerradius_l, 8px);
-  padding: 18px 15px;
+  padding: 18px 15px 20px 15px;
   background-color: var(--fcr_web_ui_scene_fill4_popup, #43434e);
 }
 
 .meeting-network-state__connection > label {
   font-size: 14px;
+  height: 30px;
+  line-height: 30px;
+  font-weight: 600;
+}
+
+.meeting-network-state__connection .meeting-network-state_text {
+  vertical-align: middle;
 }
 
 .meeting-network-state__connection > span {
-  margin-top: 8px;
+  margin-top: 6px;
   font-size: 22px;
+  font-weight: 600;
+  height: 24px;
 }
 
 .meeting-network-state__connection > span.excellent {
@@ -47,7 +57,7 @@
 }
 
 .meeting-network-state__loss-rate {
-  margin-bottom: 10px;
+  /* margin-bottom: 10px; */
 }
 
 .meeting-network-state__delay,
@@ -87,6 +97,7 @@
 .meeting-network-state__loss-rate__value > div {
   display: flex;
   line-height: 32px;
+  text-align: left;
 }
 
 .meeting-network-state__loss-rate__value > div > span:first-child {

package/lib/modules/state-bar/meeting-network-state.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MeetingNetworkState = void 0;
+require("core-js/modules/es.array.concat.js");
 var _react = require("react");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _mobxReact = require("mobx-react");
@@ -51,16 +52,21 @@ var MeetingNetworkState = exports.MeetingNetworkState = (0, _mobxReact.observer)
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
         children: t('fmt_networkstatus_window_title')
       }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-        className: networkStatusData.text.toLowerCase(),
-        children: [networkStatusData.text, " ", networkStatusData.icon]
+        className: networkStatus,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+          className: "meeting-network-state_text",
+          children: [networkStatusData.text, " "]
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          children: networkStatusData.icon
+        })]
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "meeting-network-state__delay",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
         children: t('fmt_networkstatus_window_latency')
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: "meeting-network-state__delay__value",
-        children: [networkStats.networkDelay, " ", t('fmt_statusbar_label_millisecond')]
+        children: "".concat(networkStats.networkDelay, " ").concat(t('fmt_statusbar_label_millisecond'))
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "meeting-network-state__loss-rate",

package/lib/modules/state-bar/recording.js

@@ -20,7 +20,7 @@ var _context = require("./context");
 var _store = require("./store");
 var _jsxRuntime = require("react/jsx-runtime");
 var colors = {
-  iconPrimary: 'currentColor'
+  iconPrimary: 'var(--fcr_ui_scene_icontext2)'
 };
 var Recording = exports.Recording = (0, _mobxReact.observer)(function () {
   var t = (0, _i18n.useI18n)();
@@ -43,7 +43,7 @@ var Recording = exports.Recording = (0, _mobxReact.observer)(function () {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
       type: _type2.FcrIconType.FCR_CLOUDRECORD,
       colors: {
-        iconPrimary: galleryWidth < _store.GALLERY_MIN_SIZE ? '' : 'currentColor'
+        iconPrimary: galleryWidth < _store.GALLERY_MIN_SIZE ? '' : 'var(--fcr_ui_scene_icontext2)'
       }
     }), galleryWidth >= _store.GALLERY_MIN_SIZE && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       className: ns.e('record-text'),
@@ -53,9 +53,7 @@ var Recording = exports.Recording = (0, _mobxReact.observer)(function () {
     className: ns.e('record-tag'),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
       type: _type2.FcrIconType.FCR_CLOUDRECORD,
-      colors: {
-        iconPrimary: 'currentColor'
-      }
+      colors: colors
     }), galleryWidth >= _store.GALLERY_MIN_SIZE && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       className: ns.e('record-text'),
       children: "REC"
@@ -100,11 +98,11 @@ var Recording = exports.Recording = (0, _mobxReact.observer)(function () {
   if (!hasStartCloudRecordingPermission && (isPaused || isStarting)) {
     return null;
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
-    content: isPaused ? t('fmt_statusbar_label_cloudrecordingpaused') : isStarting ? t('fmt_record_tips_Cloudrecording_Start') : t('fmt_record_tips_Cloudrecording_inprogress'),
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: ns.e('record'),
-      children: [tag, galleryWidth >= _store.GALLERY_MIN_SIZE && buttons]
-    })
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: ns.e('record'),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+      content: isPaused ? t('fmt_statusbar_label_cloudrecordingpaused') : isStarting ? t('fmt_record_tips_Cloudrecording_Start') : t('fmt_record_tips_Cloudrecording_inprogress'),
+      children: tag
+    }), galleryWidth >= _store.GALLERY_MIN_SIZE && buttons]
   });
 });

package/lib/modules/state-bar/store.d.ts

@@ -1,9 +1,9 @@
-import { FcrMainRoomControl } from 'agora-edu-core/lib/room-control';
-import { FcrRecordingState, FcrRoomInfo, FcrScheduleInfo, FcrUserInfo } from 'agora-edu-core/lib/type';
+import { FcrRecordingState, FcrRoomInfo, FcrRoomSchedule, FcrUserInfo } from 'agora-edu-core/lib/type';
 import { FcrUIEventStore } from '../../common/event-store';
 import { DeviceSettingDialogConfig } from '../setting/store';
 import { FcrSecurityStore } from '../../common/security-store';
 import { FcrUISceneConfig } from '../../type';
+import { FcrMainRoomControl, FcrWaitingRoomControl } from 'agora-edu-core/lib/room-control/type';
 export type NetworkStatus = 'excellent' | 'average' | 'poor' | 'unknown';
 export declare const GALLERY_MIN_SIZE = 825;
 export default class StateBarStore {
@@ -17,7 +17,7 @@ export default class StateBarStore {
     accessor networkStatus: NetworkStatus;
     accessor localUser: FcrUserInfo | undefined;
     accessor roomInfo: FcrRoomInfo | undefined;
-    accessor scheduleInfo: FcrScheduleInfo | undefined;
+    accessor scheduleInfo: FcrRoomSchedule | undefined;
     accessor isLiveStreaming: boolean;
     accessor liveStreamingPlayUrl: string;
     accessor galleryWidth: number;
@@ -37,8 +37,9 @@ export default class StateBarStore {
     get hasStartCloudRecordingPermission(): boolean;
     get hasStopLiveStreamingPermission(): boolean;
     get hasGetLiveStreamingLinkPermission(): boolean;
+    get password(): string | undefined;
     constructor({ roomControl, uiEventStore, securityStore, config, }: {
-        roomControl: FcrMainRoomControl;
+        roomControl: FcrMainRoomControl | FcrWaitingRoomControl;
         uiEventStore: FcrUIEventStore;
         securityStore: FcrSecurityStore;
         config: FcrUISceneConfig;
@@ -47,7 +48,7 @@ export default class StateBarStore {
     setNetworkStatus(networkStatus: NetworkStatus): void;
     setLocalUser(localUser: FcrUserInfo): void;
     setRoomInfo(roomInfo: FcrRoomInfo | undefined): void;
-    setScheduleInfo(scheduleInfo: FcrScheduleInfo): void;
+    setScheduleInfo(scheduleInfo: FcrRoomSchedule): void;
     toggleLayout(layout: 'speaker' | 'gallery'): void;
     toggleLayoutBarLock(state: boolean): void;
     openVideoWindowDialog(): void;
@@ -60,6 +61,7 @@ export default class StateBarStore {
     resumeCloudRecording(): void;
     stopCloudRecording(): void;
     getShareLink(): string;
+    toastCopyInfo(type: 'error' | 'warn' | 'info' | 'normal', content: string): void;
     private _onNetworkQualityUpdated;
     private _uiEvents;
     private _setBrowserWidth;

package/lib/modules/state-bar/store.js

@@ -12,6 +12,22 @@ require("core-js/modules/es.number.constructor.js");
 require("core-js/modules/es.object.create.js");
 require("core-js/modules/es.object.define-property.js");
 require("core-js/modules/es.object.get-own-property-descriptor.js");
+require("core-js/modules/esnext.function.metadata.js");
+require("core-js/modules/esnext.map.delete-all.js");
+require("core-js/modules/esnext.map.emplace.js");
+require("core-js/modules/esnext.map.every.js");
+require("core-js/modules/esnext.map.filter.js");
+require("core-js/modules/esnext.map.find.js");
+require("core-js/modules/esnext.map.find-key.js");
+require("core-js/modules/esnext.map.includes.js");
+require("core-js/modules/esnext.map.key-of.js");
+require("core-js/modules/esnext.map.map-keys.js");
+require("core-js/modules/esnext.map.map-values.js");
+require("core-js/modules/esnext.map.merge.js");
+require("core-js/modules/esnext.map.reduce.js");
+require("core-js/modules/esnext.map.some.js");
+require("core-js/modules/esnext.map.update.js");
+require("core-js/modules/esnext.symbol.metadata.js");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
@@ -34,6 +50,34 @@ require("core-js/modules/es.set.js");
 require("core-js/modules/es.string.includes.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.set.add-all.js");
+require("core-js/modules/esnext.set.delete-all.js");
+require("core-js/modules/esnext.set.difference.v2.js");
+require("core-js/modules/esnext.set.difference.js");
+require("core-js/modules/esnext.set.every.js");
+require("core-js/modules/esnext.set.filter.js");
+require("core-js/modules/esnext.set.find.js");
+require("core-js/modules/esnext.set.intersection.v2.js");
+require("core-js/modules/esnext.set.intersection.js");
+require("core-js/modules/esnext.set.is-disjoint-from.v2.js");
+require("core-js/modules/esnext.set.is-disjoint-from.js");
+require("core-js/modules/esnext.set.is-subset-of.v2.js");
+require("core-js/modules/esnext.set.is-subset-of.js");
+require("core-js/modules/esnext.set.is-superset-of.v2.js");
+require("core-js/modules/esnext.set.is-superset-of.js");
+require("core-js/modules/esnext.set.join.js");
+require("core-js/modules/esnext.set.map.js");
+require("core-js/modules/esnext.set.reduce.js");
+require("core-js/modules/esnext.set.some.js");
+require("core-js/modules/esnext.set.symmetric-difference.v2.js");
+require("core-js/modules/esnext.set.symmetric-difference.js");
+require("core-js/modules/esnext.set.union.v2.js");
+require("core-js/modules/esnext.set.union.js");
+require("core-js/modules/esnext.weak-map.delete-all.js");
+require("core-js/modules/esnext.weak-map.emplace.js");
 require("core-js/modules/web.btoa.js");
 require("core-js/modules/web.dom-collections.for-each.js");
 require("core-js/modules/web.dom-collections.iterator.js");
@@ -54,8 +98,8 @@ var _debounce = _interopRequireDefault(require("lodash/debounce"));
 var _components = require("../layout/components");
 var _StateBarStore;
 var _initProto, _init_networkStatus, _init_localUser, _init_roomInfo, _init_scheduleInfo, _init_isLiveStreaming, _init_liveStreamingPlayUrl, _init_galleryWidth, _init_browserWidth, _init_networkStats, _init_attendeeCount, _init_asideOpenedItem, _init_layoutSize, _init_layoutView, _init_cloudRecordingState, _setNetworkStatusDecs, _setLocalUserDecs, _setRoomInfoDecs, _setScheduleInfoDecs, _stopLiveStreamingDialogDecs, _uiEventsDecs, _setBrowserWidthDecs, _onNetworkStatsUpdatedDecs, _onLiveStreamingStateUpdatedDecs, _ref;
-function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedeclaration(obj, privateMap); privateMap.set(obj, value); }
-function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
+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; }
 function _classPrivateFieldGet(s, a) { return s.get(_assertClassBrand(s, a)); }
 function _assertClassBrand(e, t, n) { if ("function" == typeof e ? e === t : e.has(t)) return arguments.length < 3 ? t : n; throw new TypeError("Private element is not present on this object"); }
@@ -276,6 +320,12 @@ var StateBarStore = exports["default"] = /*#__PURE__*/function () {
     get: function get() {
       return this._securityStore.hasGetLiveStreamingLinkPermission();
     }
+  }, {
+    key: "password",
+    get: function get() {
+      var _this$_roomControl$ge2;
+      return (_this$_roomControl$ge2 = this._roomControl.getRoomInfo()) === null || _this$_roomControl$ge2 === void 0 ? void 0 : _this$_roomControl$ge2.password;
+    }
   }, {
     key: "isLockRoomEnabled",
     value: function isLockRoomEnabled() {
@@ -317,7 +367,8 @@ var StateBarStore = exports["default"] = /*#__PURE__*/function () {
     key: "toggleLayout",
     value: function toggleLayout(layout) {
       this._uiEventStore.toggleLayout({
-        layout: layout
+        layout: layout,
+        manual: true
       });
     }
   }, {
@@ -394,6 +445,14 @@ var StateBarStore = exports["default"] = /*#__PURE__*/function () {
       }
       return "".concat(baseLink, "?").concat(strArgs);
     }
+  }, {
+    key: "toastCopyInfo",
+    value: function toastCopyInfo(type, content) {
+      this._uiEventStore.showToast({
+        type: type,
+        message: content
+      });
+    }
   }, {
     key: "_onNetworkQualityUpdated",
     value: function _onNetworkQualityUpdated(_roomId, event) {
@@ -408,6 +467,7 @@ var StateBarStore = exports["default"] = /*#__PURE__*/function () {
         case 3:
         case 4:
         case 5:
+        case 6:
           this.setNetworkStatus('poor');
           break;
         default:
@@ -486,18 +546,18 @@ var StateBarStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "_initRoomInfo",
     value: function _initRoomInfo() {
-      var _this$_roomControl$ge2;
+      var _this$_roomControl$ge3;
       var info = this._roomControl.getRoomInfo();
       this.setRoomInfo(info);
-      var user = (_this$_roomControl$ge2 = this._roomControl.getUserControl()) === null || _this$_roomControl$ge2 === void 0 ? void 0 : _this$_roomControl$ge2.getLocalUser();
+      var user = (_this$_roomControl$ge3 = this._roomControl.getUserControl()) === null || _this$_roomControl$ge3 === void 0 ? void 0 : _this$_roomControl$ge3.getLocalUser();
       this.setLocalUser(user);
-      var scheduleInfo = this._roomControl.getScheduleInfo();
-      this.setScheduleInfo(scheduleInfo);
+      var scheduleInfo = this._roomControl.getRoomSchedule();
+      scheduleInfo && this.setScheduleInfo(scheduleInfo);
     }
   }]);
 }();
 _StateBarStore = StateBarStore;
-var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_StateBarStore, [[_mobx.observable, 1, "networkStatus"], [_mobx.observable, 1, "localUser"], [_mobx.observable, 1, "roomInfo"], [_mobx.observable, 1, "scheduleInfo"], [_mobx.observable, 1, "isLiveStreaming"], [_mobx.observable, 1, "liveStreamingPlayUrl"], [_mobx.observable, 1, "galleryWidth"], [_mobx.observable, 1, "browserWidth"], [_mobx.observable, 1, "networkStats"], [_mobx.observable, 1, "attendeeCount"], [_mobx.observable, 1, "asideOpenedItem"], [_mobx.observable, 1, "layoutSize"], [_mobx.observable, 1, "layoutView"], [_mobx.observable, 1, "cloudRecordingState"], [_mobx.computed, 3, "isUserHost"], [_mobx.computed, 3, "shouldShowMeetingTime"], [_mobx.computed, 3, "hasStartCloudRecordingPermission"], [_mobx.computed, 3, "hasStopLiveStreamingPermission"], [_mobx.computed, 3, "hasGetLiveStreamingLinkPermission"], [_decorator.bound, 2, "isLockRoomEnabled"], [_setNetworkStatusDecs, 18, "setNetworkStatus"], [_setLocalUserDecs, 18, "setLocalUser"], [_setRoomInfoDecs, 18, "setRoomInfo"], [_setScheduleInfoDecs, 18, "setScheduleInfo"], [_mobx.action, 2, "refreshLayoutSize"], [_decorator.bound, 2, "openDeviceSettingDialog"], [_stopLiveStreamingDialogDecs, 18, "stopLiveStreamingDialog"], [_decorator.bound, 2, "startCloudRecording"], [_decorator.bound, 2, "pauseCloudRecording"], [_decorator.bound, 2, "resumeCloudRecording"], [_decorator.bound, 2, "stopCloudRecording"], [_decorator.bound, 2, "getShareLink"], [_uiEventsDecs, 18, "_uiEvents"], [_setBrowserWidthDecs, 18, "_setBrowserWidth"], [_onNetworkStatsUpdatedDecs, 18, "_onNetworkStatsUpdated"], [_onLiveStreamingStateUpdatedDecs, 18, "_onLiveStreamingStateUpdated"]], []).e, 15);
+var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_StateBarStore, [[_mobx.observable, 1, "networkStatus"], [_mobx.observable, 1, "localUser"], [_mobx.observable, 1, "roomInfo"], [_mobx.observable, 1, "scheduleInfo"], [_mobx.observable, 1, "isLiveStreaming"], [_mobx.observable, 1, "liveStreamingPlayUrl"], [_mobx.observable, 1, "galleryWidth"], [_mobx.observable, 1, "browserWidth"], [_mobx.observable, 1, "networkStats"], [_mobx.observable, 1, "attendeeCount"], [_mobx.observable, 1, "asideOpenedItem"], [_mobx.observable, 1, "layoutSize"], [_mobx.observable, 1, "layoutView"], [_mobx.observable, 1, "cloudRecordingState"], [_mobx.computed, 3, "isUserHost"], [_mobx.computed, 3, "shouldShowMeetingTime"], [_mobx.computed, 3, "hasStartCloudRecordingPermission"], [_mobx.computed, 3, "hasStopLiveStreamingPermission"], [_mobx.computed, 3, "hasGetLiveStreamingLinkPermission"], [_mobx.computed, 3, "password"], [_decorator.bound, 2, "isLockRoomEnabled"], [_setNetworkStatusDecs, 18, "setNetworkStatus"], [_setLocalUserDecs, 18, "setLocalUser"], [_setRoomInfoDecs, 18, "setRoomInfo"], [_setScheduleInfoDecs, 18, "setScheduleInfo"], [_mobx.action, 2, "refreshLayoutSize"], [_decorator.bound, 2, "openDeviceSettingDialog"], [_stopLiveStreamingDialogDecs, 18, "stopLiveStreamingDialog"], [_decorator.bound, 2, "startCloudRecording"], [_decorator.bound, 2, "pauseCloudRecording"], [_decorator.bound, 2, "resumeCloudRecording"], [_decorator.bound, 2, "stopCloudRecording"], [_decorator.bound, 2, "getShareLink"], [_decorator.bound, 2, "toastCopyInfo"], [_uiEventsDecs, 18, "_uiEvents"], [_setBrowserWidthDecs, 18, "_setBrowserWidth"], [_onNetworkStatsUpdatedDecs, 18, "_onNetworkStatsUpdated"], [_onLiveStreamingStateUpdatedDecs, 18, "_onLiveStreamingStateUpdated"]], []).e, 15);
 _init_networkStatus = _applyDecs$e[0];
 _init_localUser = _applyDecs$e[1];
 _init_roomInfo = _applyDecs$e[2];

package/lib/modules/state-bar/view.js

@@ -12,7 +12,6 @@ var _i18n = require("agora-ui-foundation/lib/i18n");
 var _mobxReact = require("mobx-react");
 require("./index.css");
 var _useNamespace = require("../../utilities/useNamespace");
-var _stateBarLogo = _interopRequireDefault(require("../../../public/assets/state-bar-logo.png"));
 var _stepGradient = _interopRequireDefault(require("../../../public/assets/step-gradient.svg"));
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
@@ -37,7 +36,7 @@ var MyFcrToolTip = exports.MyFcrToolTip = function MyFcrToolTip(props) {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
     content: props.content,
     trigger: "hover",
-    placement: "bottom",
+    placement: props.placement || 'bottom',
     mouseEnterDelay: 0,
     children: props.children
   });
@@ -68,7 +67,7 @@ var View = exports.View = (0, _mobxReact.observer)(function () {
     (0, _copyText.copyText)(roomInfo.roomId).then(function () {
       _toast.FcrToastApi.open({
         toastProps: {
-          type: 'info',
+          type: 'normal',
           content: t('fmt_information_tips_beencopied')
         }
       });
@@ -86,11 +85,7 @@ var View = exports.View = (0, _mobxReact.observer)(function () {
     className: ns.b(),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: ns.e('left-nav'),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-        src: _stateBarLogo["default"],
-        alt: "logo",
-        className: ns.e('logo')
-      }), isLockRoomEnabled() && /*#__PURE__*/(0, _jsxRuntime.jsx)(MyFcrToolTip, {
+      children: [isLockRoomEnabled() && /*#__PURE__*/(0, _jsxRuntime.jsx)(MyFcrToolTip, {
         content: "".concat(t('fmt_role_host')).concat(t('fmt_information_tips_lockedbyhost', {
           reason1: isUserHost ? t('fmt_participant_label_Me') : ''
         }), ")"),
@@ -164,6 +159,7 @@ var View = exports.View = (0, _mobxReact.observer)(function () {
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_layoutConfig.LayoutConfig, {})
         })
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(MyFcrToolTip, {
+        placement: "left",
         content: isFullScreen ? t('fmt_statusbar_label_exitfullscreen') : t('fmt_statusbar_label_fullscreen'),
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           className: ns.e('full-screen'),

package/lib/modules/video-window/context.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import store from './store';
 export declare const StoreContext: import("react").Context<store>;

package/lib/modules/video-window/deviceState/index.d.ts

@@ -8,8 +8,8 @@ interface DeviceStateProps {
 }
 export declare const DeviceState: ({ connectType, openConnection, microphoneVolumeLevel, enableMicrophone, microphoneEnabled, }: DeviceStateProps) => import("react/jsx-runtime").JSX.Element;
 export declare const AudioRecordinDeviceIcon: ({ size, micEnabled, volume, }: {
-    size?: number | undefined;
-    micEnabled?: boolean | undefined;
-    volume?: number | undefined;
+    size?: number;
+    micEnabled?: boolean;
+    volume?: number;
 }) => import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/modules/video-window/index.css

@@ -8,6 +8,7 @@ body {
   height: 100%;
   width: 100%;
   box-sizing: border-box;
+  overflow: hidden;
 }
 .fcr-video-window-dialog-wrapper.electron {
   border: none !important;