fcr-ui-scene 3.4.0 → 3.4.2

package/lib/modules/control-bar/types.d.ts

@@ -0,0 +1,20 @@
+import { TransferPosition } from './enums';
+export interface MorePopoverContentProps {
+    hasChatPermission: boolean;
+    closePopover?: () => void;
+}
+export interface IShareStateNav {
+    onShareStateNavTransferPosition: (targetPosition: TransferPosition) => void;
+    onStopShare: () => void;
+    currentPosition: TransferPosition;
+}
+export interface ITransferPositionIconProps {
+    currentPosition: TransferPosition;
+    onTransferPositionButtonClick: (targetPosition: TransferPosition) => void;
+}
+export type CurrentShareBounds = {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+};

package/lib/modules/control-bar/types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

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

@@ -27,6 +27,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _divider = _interopRequireDefault(require("agora-ui-foundation/lib/components/divider"));
 var _popover = require("agora-ui-foundation/lib/components/popover");
+var _badge = require("agora-ui-foundation/lib/components/badge");
 var _meetingSecurity = require("agora-ui-foundation/lib/components/room-screen-share-state-bar/meeting-security");
 var _more = require("agora-ui-foundation/lib/components/room-screen-share-state-bar/more");
 var _participants = require("agora-ui-foundation/lib/components/room-screen-share-state-bar/participants");
@@ -37,7 +38,6 @@ var _react = require("react");
 var _store = require("./store");
 var _securityMenu = _interopRequireDefault(require("../components/security-menu"));
 var _shareStateNav = require("./components/share-state-nav");
-var _transferPositionIcon = require("./components/transfer-position-icon");
 var _moreActions = require("./components/more-actions");
 var _stopLiveStreaming = require("./components/stop-live-streaming");
 var _cloudRecordingButtons = require("./components/cloud-recording-buttons");
@@ -46,17 +46,19 @@ var _platform = require("../../utilities/platform");
 var _type = require("fcr-core/lib/type");
 var _deviceControl = _interopRequireDefault(require("../components/device-control"));
 var _meetingDetails = require("./components/meeting-details");
-var _type2 = require("./type");
 var _react2 = require("@use-gesture/react");
 var _useElectron = require("../dialog/hooks/useElectron");
 var _tools = require("../../utilities/tools");
+var _enums = require("./enums");
+var _type2 = require("fcr-core/lib/room-control/type");
+var _constant = require("../../utilities/constant");
 var _jsxRuntime = require("react/jsx-runtime");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function () {
-  var _screenBounds$availTo;
   var _useContext = (0, _react.useContext)(_useElectron.DialogInstanceContext),
-    browserWindow = _useContext.browserWindow;
+    browserWindow = _useContext.browserWindow,
+    newRendererWindow = _useContext.newRendererWindow;
   var _useContext2 = (0, _react.useContext)(_store.StoreContext),
     setShareWithAudioState = _useContext2.setShareWithAudioState,
     shareWithAudio = _useContext2.shareWithAudio,
@@ -70,24 +72,32 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
     cloudRecordingState = _useContext2.cloudRecordingState,
     hasStartCloudRecordingPermission = _useContext2.hasStartCloudRecordingPermission,
     hasStopLiveStreamingPermission = _useContext2.hasStopLiveStreamingPermission,
-    getCoordinate = _useContext2.getCoordinate,
-    screenBounds = _useContext2.screenBounds,
     hasSecurityPermission = _useContext2.hasSecurityPermission,
     allApplicationWindows = _useContext2.allApplicationWindows,
     isShowMeetingDetailPortal = _useContext2.isShowMeetingDetailPortal,
     setShowMeetingDetailPortal = _useContext2.setShowMeetingDetailPortal,
     setEnableWaitingRoom = _useContext2.setEnableWaitingRoom,
-    getCurrentSharingWorkArea = _useContext2.getCurrentSharingWorkArea;
+    currentShareDisplayId = _useContext2.currentShareDisplayId,
+    privilegeProvider = _useContext2.privilegeProvider,
+    newMessageCount = _useContext2.newMessageCount,
+    currentShareType = _useContext2.currentShareType,
+    currentShareBounds = _useContext2.currentShareBounds;
   // 控制栏本身的高度
   var NAV_HEIGHT = 84;
   // 鼠标移开后自动隐藏的时间
   var HIDDEN_TIMEOUT = 3000;
   // 系统顶部的状态栏
-  var TITLE_HEIGHT = (0, _platform.isWindows)() ? 0 : (_screenBounds$availTo = screenBounds.availTop) !== null && _screenBounds$availTo !== void 0 ? _screenBounds$availTo : 0;
-  var sharingWindowBounds = getCurrentSharingWorkArea();
-  var browserWidth = sharingWindowBounds.width;
-  var browserHeight = sharingWindowBounds.height;
-  var _useState = (0, _react.useState)(_transferPositionIcon.TransferPosition.TOP),
+  var _getCurrentSharingWor = (0, _tools.getCurrentSharingWorkArea)({
+      currentShareId: currentShareId,
+      currentShareType: currentShareType,
+      allApplicationWindows: allApplicationWindows,
+      currentShareBounds: currentShareBounds
+    }),
+    browserWidth = _getCurrentSharingWor.width,
+    browserHeight = _getCurrentSharingWor.height,
+    topOffset = _getCurrentSharingWor.topOffset;
+  var TITLE_HEIGHT = (0, _platform.isWindows)() ? 0 : topOffset !== null && topOffset !== void 0 ? topOffset : 0;
+  var _useState = (0, _react.useState)(_enums.TransferPosition.TOP),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     navCurrentPosition = _useState2[0],
     setNavCurrentPosition = _useState2[1];
@@ -140,7 +150,7 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
 
   var handlerShareNavTransferPosition = (0, _react.useCallback)(function (targetPosition) {
     setNavCurrentPosition(targetPosition);
-    var targetY = targetPosition === _transferPositionIcon.TransferPosition.TOP ? 0 : browserHeight - NAV_HEIGHT;
+    var targetY = targetPosition === _enums.TransferPosition.TOP ? 0 : browserHeight - NAV_HEIGHT - TITLE_HEIGHT;
     setCoordination({
       x: coordination.x,
       y: targetY
@@ -177,9 +187,9 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
     // 控制栏左上角在屏幕Y轴的最大坐标
     var MAX_Y = browserHeight - NAV_HEIGHT;
     if (y >= MAX_Y) {
-      setNavCurrentPosition(_transferPositionIcon.TransferPosition.BOTTOM);
+      setNavCurrentPosition(_enums.TransferPosition.BOTTOM);
     } else if (y <= 0) {
-      setNavCurrentPosition(_transferPositionIcon.TransferPosition.TOP);
+      setNavCurrentPosition(_enums.TransferPosition.TOP);
     }
   };
   var handleMouseMove = function handleMouseMove() {
@@ -193,9 +203,12 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
     if (rndRef.current) {
       var width = rndRef.current.offsetWidth;
       var height = rndRef.current.offsetHeight;
-      var _getCoordinate = getCoordinate(width, height),
-        x = _getCoordinate.x,
-        y = _getCoordinate.y;
+      var _x$y = {
+          x: browserWidth / 2 - width / 2,
+          y: 0
+        },
+        x = _x$y.x,
+        y = _x$y.y;
       setCoordination({
         x: x,
         y: y
@@ -204,15 +217,8 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
         width: width,
         height: height
       });
+      setNavCurrentPosition(_enums.TransferPosition.TOP);
     }
-    (0, _platform.isWindows)() && (0, _tools.handleCheckMouseOver)({
-      elem: rndRef.current,
-      browserWindow: browserWindow,
-      screenBounds: screenBounds,
-      callback: function callback(timerId) {
-        windowFocusTimerRef.current = timerId;
-      }
-    });
   }, [currentShareId]);
   (0, _react.useEffect)(function () {
     if (!moreVisible) {
@@ -222,6 +228,18 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
       });
     }
   }, [moreVisible]);
+  (0, _react.useEffect)(function () {
+    var handleDisplayRemoved = function handleDisplayRemoved(event, display) {
+      if (display.id === currentShareDisplayId) {
+        handlerStopShare();
+        browserWindow.close();
+      }
+    };
+    window.runtime.screen.addListener('display-removed', handleDisplayRemoved);
+    return function () {
+      window.runtime.screen.removeListener('display-removed', handleDisplayRemoved);
+    };
+  }, [currentShareDisplayId]);
   var handleIgnoreMinimize = function handleIgnoreMinimize(event) {
     event.preventDefault();
     // browserWindow.restore();
@@ -230,15 +248,29 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
     setMoreVisible(false);
     setShowSecurityPopover(false);
   }
-  (0, _react.useEffect)(function () {
-    (0, _platform.isWindows)() && (0, _tools.handleCheckMouseOver)({
+  function checkMouseOver() {
+    if (windowFocusTimerRef.current) clearInterval(windowFocusTimerRef.current);
+    (0, _tools.handleCheckMouseOver)({
       elem: rndRef.current,
       browserWindow: browserWindow,
-      screenBounds: screenBounds,
+      screenBounds: (0, _tools.getCurrentSharingWorkArea)({
+        currentShareId: currentShareId,
+        currentShareType: currentShareType,
+        allApplicationWindows: allApplicationWindows,
+        currentShareBounds: currentShareBounds
+      }),
+      newRendererWindow: newRendererWindow,
       callback: function callback(timerId) {
         windowFocusTimerRef.current = timerId;
-      }
+      },
+      dialog: _constant.FcrUIDialogKey.CONTROL_BAR
     });
+  }
+  (0, _react.useEffect)(function () {
+    if ((0, _platform.isWindows)()) {
+      checkMouseOver();
+      window.runtime.screen.addListener('display-metrics-changed', checkMouseOver);
+    }
     browserWindow.setAlwaysOnTop(false);
     handleMouseLeave();
     document.body.classList.add(_toast.TOAST_ROOT_CLASS_NAME);
@@ -248,13 +280,18 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
       browserWindow.setAlwaysOnTop(true, 'screen-saver');
     }, 500);
     return function () {
+      window.runtime.screen.removeListener('display-metrics-changed', checkMouseOver);
       window.removeEventListener('blur', handleBlur);
       browserWindow.setIgnoreMouseEvents(true);
-      browserWindow.close();
       clearTimeout(hideTimeout.current);
       clearTimeout(alwayOnTopTimerRef.current);
       clearInterval(windowFocusTimerRef.current);
     };
+  }, [currentShareId]);
+  (0, _react.useEffect)(function () {
+    return function () {
+      return browserWindow.close();
+    };
   }, []);
   return currentShareId ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, bind()), {}, {
     style: {
@@ -268,7 +305,7 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
       onMouseOver: handleMouseEnter,
       onMouseMove: handleMouseMove,
       onClick: handleMouseMove,
-      className: "fcr-flex \n        share-action-nav__container\n         ".concat(navCurrentPosition === _transferPositionIcon.TransferPosition.BOTTOM ? 'share-action-nav__move_to_bottom' : 'share-action-nav__move_to_top', "\n         ").concat(hiddenShareActionNav ? 'share-action-nav__hidden' : '', "\n      ").concat(hiddenShareActionNav && coordination.y === browserHeight - NAV_HEIGHT ? 'completely-hidden-in-bottom' : '', "\n      // \u8FD9\u91CC\u7684\u903B\u8F91\u662F\uFF0C \u5F53control-bar\u5728\u9876\u90E8\u65F6\uFF0C\u5982\u679C\u5F53\u524D\u7684Y\u5750\u6807\u5C0F\u4E8E\u6807\u9898\u680F\u7684\u9AD8\u5EA6\uFF0C\u6216\u8005\u7B49\u4E8E\u6807\u9898\u680F\u7684\u9AD8\u5EA6\uFF0C\u6216\u8005\u7B49\u4E8E0\uFF0C\u90A3\u4E48\u5C31\u6DFB\u52A0\u5438\u9876\u6548\u679C\n      // \u5F53\u7535\u8111\u6709\u4E24\u4E2A\u5C4F\u5E55\u65F6\uFF0CTITLE_HEIGHT\u7684\u503C\u53EF\u80FD\u4E3A\u8D1F\u6570\n      ").concat(hiddenShareActionNav && (coordination.y < TITLE_HEIGHT || coordination.y === TITLE_HEIGHT || coordination.y === 0) ? 'completely-hidden-in-top' : '', "\n      "),
+      className: "fcr-flex \n        share-action-nav__container\n         ".concat(navCurrentPosition === _enums.TransferPosition.BOTTOM ? 'share-action-nav__move_to_bottom' : 'share-action-nav__move_to_top', "\n         ").concat(hiddenShareActionNav ? 'share-action-nav__hidden' : '', "\n      ").concat(hiddenShareActionNav && coordination.y === browserHeight - NAV_HEIGHT - TITLE_HEIGHT ? 'completely-hidden-in-bottom' : '', "\n      // \u8FD9\u91CC\u7684\u903B\u8F91\u662F\uFF0C \u5F53control-bar\u5728\u9876\u90E8\u65F6\uFF0C\u5982\u679C\u5F53\u524D\u7684Y\u5750\u6807\u5C0F\u4E8E\u6807\u9898\u680F\u7684\u9AD8\u5EA6\uFF0C\u6216\u8005\u7B49\u4E8E\u6807\u9898\u680F\u7684\u9AD8\u5EA6\uFF0C\u6216\u8005\u7B49\u4E8E0\uFF0C\u90A3\u4E48\u5C31\u6DFB\u52A0\u5438\u9876\u6548\u679C\n      // \u5F53\u7535\u8111\u6709\u4E24\u4E2A\u5C4F\u5E55\u65F6\uFF0CTITLE_HEIGHT\u7684\u503C\u53EF\u80FD\u4E3A\u8D1F\u6570\n      ").concat(hiddenShareActionNav && (coordination.y < TITLE_HEIGHT || coordination.y === TITLE_HEIGHT || coordination.y === 0) ? 'completely-hidden-in-top' : '', "\n      "),
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: "share-action-nav share-action-nav__can-draggable ".concat(hiddenShareActionNav ? 'invisible' : ''),
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -293,6 +330,7 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
               borderRadius: 'var(--fcr_cornerradius_l)'
             },
             content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_securityMenu["default"], {
+              privilege: privilegeProvider,
               setEnableWaitingRoom: setEnableWaitingRoom
             }),
             trigger: "click",
@@ -306,7 +344,7 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
             })
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_participants.ParticipantButton, {
             onTooltipButtonClick: function onTooltipButtonClick() {
-              handleMoreClick(_type2.MoreAction.OPEN_PARTICIPANTS);
+              handleMoreClick(_enums.MoreAction.OPEN_PARTICIPANTS);
             }
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_divider["default"], {
             style: {
@@ -315,16 +353,19 @@ var ControlBarView = exports.ControlBarView = (0, _mobxReact.observer)(function
             }
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_shareScreenButton.ShareScreenButton, {
             onCreateNewShareButtonClick: createNewShare
-          }), hasStopLiveStreamingPermission && liveStreamingState === _type.FcrLiveStreamingState.STARTED && /*#__PURE__*/(0, _jsxRuntime.jsx)(_stopLiveStreaming.StopLiveStreamingButton, {}), hasStartCloudRecordingPermission && cloudRecordingState !== _type.FcrRecordingState.Stopped && /*#__PURE__*/(0, _jsxRuntime.jsx)(_cloudRecordingButtons.CloudRecordingButtons, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_more.More, {
-            visible: moreVisible,
-            onButtonClick: function onButtonClick() {
-              return setMoreVisible(!moreVisible);
-            },
-            morePopoverContent: isShowMeetingDetailPortal ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_meetingDetails.MeetingDetails, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_moreActions.MorePopoverContent, {
-              closePopover: function closePopover() {
-                return setMoreVisible(false);
+          }), hasStopLiveStreamingPermission && liveStreamingState === _type.FcrLiveStreamingState.STARTED && /*#__PURE__*/(0, _jsxRuntime.jsx)(_stopLiveStreaming.StopLiveStreamingButton, {}), hasStartCloudRecordingPermission && cloudRecordingState !== _type.FcrRecordingState.Stopped && /*#__PURE__*/(0, _jsxRuntime.jsx)(_cloudRecordingButtons.CloudRecordingButtons, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_badge.FcrBadge, {
+            count: newMessageCount[_type2.FcrRoomType.Mainroom] || 0,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_more.More, {
+              visible: moreVisible,
+              onButtonClick: function onButtonClick() {
+                return setMoreVisible(!moreVisible);
               },
-              hasChatPermission: true
+              morePopoverContent: isShowMeetingDetailPortal ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_meetingDetails.MeetingDetails, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_moreActions.MorePopoverContent, {
+                closePopover: function closePopover() {
+                  return setMoreVisible(false);
+                },
+                hasChatPermission: true
+              })
             })
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_divider["default"], {
             style: {

package/lib/modules/device-pretest/index.js

@@ -52,8 +52,8 @@ var FcrMeetingPreview = exports.FcrMeetingPreview = (0, _mobxReact.observer)(fun
     microphoneEnabled = _useContext.microphoneEnabled,
     enableBeauty = _useContext.enableBeauty,
     currentVirtualBackgroundName = _useContext.currentVirtualBackgroundName,
-    microphoneList = _useContext.microphoneList,
-    cameraList = _useContext.cameraList,
+    microphoneDeviceList = _useContext.microphoneDeviceList,
+    cameraDeviceList = _useContext.cameraDeviceList,
     startPlayLocalVideo = _useContext.startPlayLocalVideo,
     stopPlayLocalVideo = _useContext.stopPlayLocalVideo,
     setCameraEnabled = _useContext.setCameraEnabled,
@@ -179,8 +179,8 @@ var FcrMeetingPreview = exports.FcrMeetingPreview = (0, _mobxReact.observer)(fun
         enableBeauty: enableBeauty,
         enableMirror: isLocalMirrorEnabled,
         enableVirtualBg: currentVirtualBackgroundName !== 'None',
-        noMicrophone: microphoneList.length === 0,
-        noCamera: cameraList.length === 0
+        noMicrophone: microphoneDeviceList.length === 0,
+        noCamera: cameraDeviceList.length === 0
       },
       videoPlayer: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: deviceSettingsNs.b(),

package/lib/modules/device-pretest/settings/video-settings-basic.js

@@ -42,7 +42,7 @@ var VideoSettingsBasic4Custom = exports.VideoSettingsBasic4Custom = (0, _mobxRea
     className: ns.b(),
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: ns.e('basic-form'),
-      id: _constant.HighlightElement.VIDEO_BASIC,
+      id: _constant.FcrUIHighlightElement.VIDEO_BASIC,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: ns.e('form-row'),
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/lib/modules/device-pretest/settings/virtual-background-setting.js

@@ -52,7 +52,7 @@ var VirtualBackgroundSetting = exports.VirtualBackgroundSetting = (0, _mobxReact
               }
             }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
               className: ns.e('virtual-none'),
-              children: transI18n('fmt_modules_tips_notapplicate')
+              children: transI18n('fmt_group_popup_breakout_room_label_none')
             })]
           })
         })

package/lib/modules/device-pretest/store.d.ts

@@ -1,11 +1,13 @@
 import { FcrBeautyOptions } from 'fcr-core/lib/media-control/type';
-import { BeautyKey, FcrDeviceStore } from '../../common/device-store';
 import { TabKeyType } from './settings/video-effect';
 import { VirtualBackground } from './assets/virtual-backdound-resources';
-import { DeviceItem } from '../setting/store';
+import { BeautyKey, DeviceItem } from '../setting/store';
+import { FcrUIBeautyKey } from '../../type';
+import { FcrUIDeviceProvider } from '../../providers/device-provider';
 export declare class FcrPretestStore {
     accessor previewCameraEnabled: boolean;
     accessor activeTab: TabKeyType;
+    accessor currentBeautyKey: FcrUIBeautyKey;
     private _deviceStore;
     private _deviceStoreObserver;
     private _disposers;
@@ -13,14 +15,11 @@ export declare class FcrPretestStore {
     get isLocalMirrorEnabled(): boolean;
     get isLocalEditBeautyOptions(): boolean;
     get cameraId(): string;
-    get currentBeautyKey(): BeautyKey;
     get beautyOptions(): import("agora-rte-sdk/lib/core/rtc/type").AgoraRtcBeautyOptions;
     get cameraEnabled(): boolean;
     get microphoneEnabled(): boolean;
     get enableBeauty(): boolean;
     get currentVirtualBackgroundName(): string;
-    get microphoneList(): import("agora-rte-sdk").AgoraRtcDeviceInfo[];
-    get cameraList(): import("agora-rte-sdk").AgoraRtcDeviceInfo[];
     get virtualBackgroundList(): VirtualBackground[];
     get showForceOpenEffectDialog(): boolean;
     get microphoneVolumeLevel(): number;
@@ -33,8 +32,8 @@ export declare class FcrPretestStore {
     get speakerVolume(): number;
     get speakerDetecting(): boolean;
     get microphoneDetecting(): boolean;
-    constructor({ deviceStore }: {
-        deviceStore: FcrDeviceStore;
+    constructor({ deviceProvider }: {
+        deviceProvider: FcrUIDeviceProvider;
     });
     setCameraId(cameraId: string): void;
     setVideoOrientation(): void;
@@ -51,10 +50,10 @@ export declare class FcrPretestStore {
     setEditBeautyKey(key: BeautyKey): void;
     handleForceOpenVideoEffect(): void;
     handleCancelForceOpenVideoEffect(): void;
-    setSpeakerId(speakerId: string): Promise<void>;
+    setSpeakerId(speakerId: string): void;
     stopMicrophoneTest(): void;
     startMicrophoneTest(): void;
-    setMicrophoneId(microphoneId: string): Promise<void>;
+    setMicrophoneId(microphoneId: string): void;
     stopSpeakerTest(): void;
     startSpeakerTest(): void;
     setSpeakerVolume(value: number): void;

package/lib/modules/device-pretest/store.js

@@ -37,29 +37,32 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.PretestStoreContext = exports.FcrPretestStore = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 require("core-js/modules/es.array.for-each.js");
 require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.array.map.js");
 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.async-iterator.map.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.for-each.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");
 require("core-js/modules/web.dom-collections.for-each.js");
 require("core-js/modules/web.dom-collections.iterator.js");
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _mobx = require("mobx");
 var _decorator = require("agora-foundation/lib/decorator");
 var _react = require("react");
 var _FcrPretestStore;
-var _initProto, _init_previewCameraEnabled, _init_activeTab, _setCameraIdDecs, _setVideoOrientationDecs, _setBeautyOptionsDecs, _setActiveTabDecs, _startPlayLocalVideoDecs, _stopPlayLocalVideoDecs, _setCameraEnabledDecs, _setMicrophoneEnabledDecs, _enableBeautyEffectDecs, _toggleLocalMirrorPreviewDecs, _toggleLocalMirrorDecs, _enableVirtualBackgroundDecs, _setEditBeautyKeyDecs, _handleForceOpenVideoEffectDecs, _handleCancelForceOpenVideoEffectDecs, _setSpeakerIdDecs, _stopMicrophoneTestDecs, _startMicrophoneTestDecs, _setMicrophoneIdDecs, _stopSpeakerTestDecs, _startSpeakerTestDecs, _setSpeakerVolumeDecs, _resetSpeakerVolumeDecs, _restoreSpeakerVolumeDecs, _releaseDecs, _ref;
+var _initProto, _init_previewCameraEnabled, _init_activeTab, _init_currentBeautyKey, _setCameraIdDecs, _setVideoOrientationDecs, _setBeautyOptionsDecs, _setActiveTabDecs, _startPlayLocalVideoDecs, _stopPlayLocalVideoDecs, _setCameraEnabledDecs, _setMicrophoneEnabledDecs, _enableBeautyEffectDecs, _toggleLocalMirrorPreviewDecs, _toggleLocalMirrorDecs, _enableVirtualBackgroundDecs, _setEditBeautyKeyDecs, _handleForceOpenVideoEffectDecs, _handleCancelForceOpenVideoEffectDecs, _setSpeakerIdDecs, _stopMicrophoneTestDecs, _startMicrophoneTestDecs, _setMicrophoneIdDecs, _stopSpeakerTestDecs, _startSpeakerTestDecs, _setSpeakerVolumeDecs, _resetSpeakerVolumeDecs, _restoreSpeakerVolumeDecs, _releaseDecs, _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; }
@@ -70,23 +73,33 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 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 mapDevice2Option = function mapDevice2Option(deviceList) {
+  return deviceList.map(function (item) {
+    return {
+      text: item.deviceName,
+      value: item.deviceId
+    };
+  });
+};
 var _A = /*#__PURE__*/new WeakMap();
 var _B = /*#__PURE__*/new WeakMap();
+var _C = /*#__PURE__*/new WeakMap();
 _ref = (_setCameraIdDecs = [_mobx.action, _mobx.action.bound], _setVideoOrientationDecs = [_mobx.action, _mobx.action.bound], _setBeautyOptionsDecs = [_mobx.action, _mobx.action.bound], _setActiveTabDecs = [_mobx.action, _mobx.action.bound], _startPlayLocalVideoDecs = [_mobx.action, _mobx.action.bound], _stopPlayLocalVideoDecs = [_mobx.action, _mobx.action.bound], _setCameraEnabledDecs = [_mobx.action, _mobx.action.bound], _setMicrophoneEnabledDecs = [_mobx.action, _mobx.action.bound], _enableBeautyEffectDecs = [_mobx.action, _mobx.action.bound], _toggleLocalMirrorPreviewDecs = [_mobx.action, _mobx.action.bound], _toggleLocalMirrorDecs = [_mobx.action, _mobx.action.bound], _enableVirtualBackgroundDecs = [_mobx.action, _mobx.action.bound], _setEditBeautyKeyDecs = [_mobx.action, _mobx.action.bound], _handleForceOpenVideoEffectDecs = [_mobx.action, _mobx.action.bound], _handleCancelForceOpenVideoEffectDecs = [_mobx.action, _mobx.action.bound], _setSpeakerIdDecs = [_mobx.action, _mobx.action.bound], _stopMicrophoneTestDecs = [_mobx.action, _mobx.action.bound], _startMicrophoneTestDecs = [_mobx.action, _mobx.action.bound], _setMicrophoneIdDecs = [_mobx.action, _mobx.action.bound], _stopSpeakerTestDecs = [_mobx.action, _mobx.action.bound], _startSpeakerTestDecs = [_mobx.action, _mobx.action.bound], _setSpeakerVolumeDecs = [_mobx.action, _mobx.action.bound], _resetSpeakerVolumeDecs = [_mobx.action, _mobx.action.bound], _restoreSpeakerVolumeDecs = [_mobx.action, _mobx.action.bound], _releaseDecs = [_mobx.action, _mobx.action.bound], "previewCameraEnabled");
 var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
   function FcrPretestStore(_ref2) {
     var _this = this;
-    var deviceStore = _ref2.deviceStore;
+    var deviceProvider = _ref2.deviceProvider;
     (0, _classCallCheck2["default"])(this, FcrPretestStore);
     _classPrivateFieldInitSpec(this, _A, (_initProto(this), _init_previewCameraEnabled(this, false)));
     _classPrivateFieldInitSpec(this, _B, _init_activeTab(this, 'basic'));
+    _classPrivateFieldInitSpec(this, _C, _init_currentBeautyKey(this, 'none'));
     (0, _defineProperty2["default"])(this, "_deviceStoreObserver", {
       onCameraListUpdated: this._handleCameraListUpdated,
       onCameraChanged: this._handleCameraChanged
     });
     (0, _defineProperty2["default"])(this, "_disposers", []);
     (0, _defineProperty2["default"])(this, "_lastSpeakerVolume", 0);
-    this._deviceStore = deviceStore;
+    this._deviceStore = deviceProvider;
     this._deviceStore.addObserver(this._deviceStoreObserver);
     this._disposers.push((0, _mobx.reaction)(function () {
       return _this._deviceStore.showCameraPreview;
@@ -110,6 +123,14 @@ var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
     set: function set(v) {
       _classPrivateFieldSet(_B, this, v);
     }
+  }, {
+    key: "currentBeautyKey",
+    get: function get() {
+      return _classPrivateFieldGet(_C, this);
+    },
+    set: function set(v) {
+      _classPrivateFieldSet(_C, this, v);
+    }
   }, {
     key: "isLocalMirrorEnabled",
     get: function get() {
@@ -125,11 +146,6 @@ var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
     get: function get() {
       return this._deviceStore.cameraId;
     }
-  }, {
-    key: "currentBeautyKey",
-    get: function get() {
-      return this._deviceStore.currentBeautyKey;
-    }
   }, {
     key: "beautyOptions",
     get: function get() {
@@ -153,18 +169,14 @@ var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
   }, {
     key: "currentVirtualBackgroundName",
     get: function get() {
-      return this._deviceStore.currentVirtualBackgroundName;
-    }
-  }, {
-    key: "microphoneList",
-    get: function get() {
-      return this._deviceStore.microphoneList;
-    }
-  }, {
-    key: "cameraList",
-    get: function get() {
-      return this._deviceStore.cameraList;
+      return this._deviceStore.virtualBackgroundName;
     }
+    // get microphoneList() {
+    //   return this._deviceStore.microphoneList;
+    // }
+    // get cameraList() {
+    //   return this._deviceStore.cameraList;
+    // }
   }, {
     key: "virtualBackgroundList",
     get: function get() {
@@ -188,7 +200,7 @@ var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
   }, {
     key: "cameraDeviceList",
     get: function get() {
-      return this._deviceStore.cameraDeviceList;
+      return mapDevice2Option(this._deviceStore.cameraList);
     }
   }, {
     key: "speakerId",
@@ -203,12 +215,12 @@ var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
   }, {
     key: "speakerDeviceList",
     get: function get() {
-      return this._deviceStore.speakerDeviceList;
+      return mapDevice2Option(this._deviceStore.speakerList);
     }
   }, {
     key: "microphoneDeviceList",
     get: function get() {
-      return this._deviceStore.microphoneDeviceList;
+      return mapDevice2Option(this._deviceStore.microphoneList);
     }
   }, {
     key: "speakerVolume",
@@ -336,7 +348,6 @@ var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
     key: "setSpeakerVolume",
     value: function setSpeakerVolume(value) {
       this._deviceStore.setSpeakerVolume(value);
-      this._deviceStore.mediaControl.setSelectedSpeakerVolume(value);
     }
   }, {
     key: "resetSpeakerVolume",
@@ -352,6 +363,9 @@ var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
   }, {
     key: "release",
     value: function release() {
+      if (!this.cameraEnabled) {
+        this._deviceStore.startOrStopCamera(false);
+      }
       this.previewCameraEnabled = false;
       this._deviceStore.removeObserver(this._deviceStoreObserver);
       this._disposers.forEach(function (disposer) {
@@ -363,24 +377,25 @@ var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
     key: "_setPreviewCameraEnabled",
     value: function _setPreviewCameraEnabled(enable) {
       var realEnable = enable || this.cameraEnabled;
-      this._deviceStore.handleRealCameraEnabledChanged(realEnable);
+      // this._deviceStore.handleRealCameraEnabledChanged(realEnable);
+
       this.previewCameraEnabled = enable;
     }
   }, {
     key: "_setCameraEnabled",
     value: function _setCameraEnabled(enable) {
       var realEnable = enable || this.previewCameraEnabled;
-      this._deviceStore.handleRealCameraEnabledChanged(realEnable);
-      this._deviceStore.cameraEnabled = enable;
+      this._deviceStore.setCameraEnabled(realEnable);
     }
   }, {
     key: "_handleCameraChanged",
     value: function _handleCameraChanged() {
-      var cameraTrack = this._deviceStore.mediaControl.getCameraTrack(this._deviceStore.cameraId);
+      var cameraTrack = this._deviceStore.cameraTrack;
       if (this._deviceStore.showCameraPreview) {
         cameraTrack.start();
       }
-      this._deviceStore.handleCameraChanged(this._deviceStore.showCameraPreview);
+
+      // this._deviceStore.handleCameraChanged(this._deviceStore.showCameraPreview);
     }
   }, {
     key: "_handleCameraListUpdated",
@@ -393,7 +408,7 @@ var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
               previewCameraEnabled = this.previewCameraEnabled;
               if (cameraList.length > 0) {
                 if (previewCameraEnabled) {
-                  cameraTrack = this._deviceStore.mediaControl.getCameraTrack(this._deviceStore.cameraId);
+                  cameraTrack = this._deviceStore.cameraTrack;
                   cameraTrack.start();
                   this._setPreviewCameraEnabled(true);
                 }
@@ -421,8 +436,9 @@ var FcrPretestStore = exports.FcrPretestStore = /*#__PURE__*/function () {
   }]);
 }();
 _FcrPretestStore = FcrPretestStore;
-var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_FcrPretestStore, [[_mobx.observable, 1, "previewCameraEnabled"], [_mobx.observable, 1, "activeTab"], [_setCameraIdDecs, 18, "setCameraId"], [_setVideoOrientationDecs, 18, "setVideoOrientation"], [_setBeautyOptionsDecs, 18, "setBeautyOptions"], [_setActiveTabDecs, 18, "setActiveTab"], [_startPlayLocalVideoDecs, 18, "startPlayLocalVideo"], [_stopPlayLocalVideoDecs, 18, "stopPlayLocalVideo"], [_setCameraEnabledDecs, 18, "setCameraEnabled"], [_setMicrophoneEnabledDecs, 18, "setMicrophoneEnabled"], [_enableBeautyEffectDecs, 18, "enableBeautyEffect"], [_toggleLocalMirrorPreviewDecs, 18, "toggleLocalMirrorPreview"], [_toggleLocalMirrorDecs, 18, "toggleLocalMirror"], [_enableVirtualBackgroundDecs, 18, "enableVirtualBackground"], [_setEditBeautyKeyDecs, 18, "setEditBeautyKey"], [_handleForceOpenVideoEffectDecs, 18, "handleForceOpenVideoEffect"], [_handleCancelForceOpenVideoEffectDecs, 18, "handleCancelForceOpenVideoEffect"], [_setSpeakerIdDecs, 18, "setSpeakerId"], [_stopMicrophoneTestDecs, 18, "stopMicrophoneTest"], [_startMicrophoneTestDecs, 18, "startMicrophoneTest"], [_setMicrophoneIdDecs, 18, "setMicrophoneId"], [_stopSpeakerTestDecs, 18, "stopSpeakerTest"], [_startSpeakerTestDecs, 18, "startSpeakerTest"], [_setSpeakerVolumeDecs, 18, "setSpeakerVolume"], [_resetSpeakerVolumeDecs, 18, "resetSpeakerVolume"], [_restoreSpeakerVolumeDecs, 18, "restoreSpeakerVolume"], [_releaseDecs, 18, "release"], [_decorator.bound, 2, "_setPreviewCameraEnabled"], [_decorator.bound, 2, "_setCameraEnabled"], [_decorator.bound, 2, "_handleCameraChanged"], [_decorator.bound, 2, "_handleCameraListUpdated"], [_decorator.bound, 2, "_handleCameraPreviewShowChanged"]], []).e, 3);
+var _applyDecs$e = (0, _slicedToArray2["default"])(_applyDecs(_FcrPretestStore, [[_mobx.observable, 1, "previewCameraEnabled"], [_mobx.observable, 1, "activeTab"], [_mobx.observable, 1, "currentBeautyKey"], [_mobx.computed, 3, "speakerDeviceList"], [_mobx.computed, 3, "microphoneDeviceList"], [_setCameraIdDecs, 18, "setCameraId"], [_setVideoOrientationDecs, 18, "setVideoOrientation"], [_setBeautyOptionsDecs, 18, "setBeautyOptions"], [_setActiveTabDecs, 18, "setActiveTab"], [_startPlayLocalVideoDecs, 18, "startPlayLocalVideo"], [_stopPlayLocalVideoDecs, 18, "stopPlayLocalVideo"], [_setCameraEnabledDecs, 18, "setCameraEnabled"], [_setMicrophoneEnabledDecs, 18, "setMicrophoneEnabled"], [_enableBeautyEffectDecs, 18, "enableBeautyEffect"], [_toggleLocalMirrorPreviewDecs, 18, "toggleLocalMirrorPreview"], [_toggleLocalMirrorDecs, 18, "toggleLocalMirror"], [_enableVirtualBackgroundDecs, 18, "enableVirtualBackground"], [_setEditBeautyKeyDecs, 18, "setEditBeautyKey"], [_handleForceOpenVideoEffectDecs, 18, "handleForceOpenVideoEffect"], [_handleCancelForceOpenVideoEffectDecs, 18, "handleCancelForceOpenVideoEffect"], [_setSpeakerIdDecs, 18, "setSpeakerId"], [_stopMicrophoneTestDecs, 18, "stopMicrophoneTest"], [_startMicrophoneTestDecs, 18, "startMicrophoneTest"], [_setMicrophoneIdDecs, 18, "setMicrophoneId"], [_stopSpeakerTestDecs, 18, "stopSpeakerTest"], [_startSpeakerTestDecs, 18, "startSpeakerTest"], [_setSpeakerVolumeDecs, 18, "setSpeakerVolume"], [_resetSpeakerVolumeDecs, 18, "resetSpeakerVolume"], [_restoreSpeakerVolumeDecs, 18, "restoreSpeakerVolume"], [_releaseDecs, 18, "release"], [_decorator.bound, 2, "_setPreviewCameraEnabled"], [_decorator.bound, 2, "_setCameraEnabled"], [_decorator.bound, 2, "_handleCameraChanged"], [_decorator.bound, 2, "_handleCameraListUpdated"], [_decorator.bound, 2, "_handleCameraPreviewShowChanged"]], []).e, 4);
 _init_previewCameraEnabled = _applyDecs$e[0];
 _init_activeTab = _applyDecs$e[1];
-_initProto = _applyDecs$e[2];
+_init_currentBeautyKey = _applyDecs$e[2];
+_initProto = _applyDecs$e[3];
 var PretestStoreContext = exports.PretestStoreContext = /*#__PURE__*/(0, _react.createContext)(null);