fcr-ui-scene 3.5.1 → 3.6.0

package/lib/modules/pc-audio-connect/store.js

@@ -176,7 +176,7 @@ var ConnectionGatewayStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "openAudioSettings",
     value: function openAudioSettings() {
-      this._eventProvider.openDeviceSettingDialog({
+      this._dialogProvider.openDeviceSettingDialog({
         activeTab: _store.DeviceSettingTab.AUDIO,
         highlightSelector: _constant.FcrUIHighlightElement.AUDIO_MICROPHONE
       });

package/lib/modules/phone-audio-connect/index.d.ts

@@ -4,12 +4,14 @@ import { FcrUIEventProvider } from '../../providers/event-provider';
 import { FcrUICurrentRoomControlProvider } from '../../providers/room-provider';
 import { FcrUIDeviceProvider } from '../../providers/device-provider';
 import { FcrUIPhoneAudioConnectorProvider } from '../../providers/phone-audio-provider';
+import { FcrUIDialogProvider } from '../../providers/dialog-provider';
 export declare class PhoneAudioConnectionUIModule extends UIModule {
     private _store?;
     currentRoomControlProvider?: FcrUICurrentRoomControlProvider;
     eventProvider?: FcrUIEventProvider;
     deviceProvider?: FcrUIDeviceProvider;
     phoneAudioConnectorProvider?: FcrUIPhoneAudioConnectorProvider;
+    dialogProvider?: FcrUIDialogProvider;
     onNodeWillActive(): void;
     onNodeWillInactive(): void;
     getComponent(): import("react/jsx-runtime").JSX.Element;

package/lib/modules/phone-audio-connect/index.js

@@ -42,7 +42,8 @@ var PhoneAudioConnectionUIModule = exports.PhoneAudioConnectionUIModule = /*#__P
       this._store = new _store["default"]({
         eventProvider: this.eventProvider,
         deviceProvider: this.deviceProvider,
-        phoneAudioConnectorProvider: this.phoneAudioConnectorProvider
+        phoneAudioConnectorProvider: this.phoneAudioConnectorProvider,
+        dialogProvider: this.dialogProvider
       });
     }
   }, {

package/lib/modules/phone-audio-connect/store.d.ts

@@ -3,10 +3,12 @@ import { FcrUIDeviceProvider } from '../../providers/device-provider';
 import { ConnectorRegion } from './enums';
 import { FcrUIPhoneAudioConnectorProvider } from '../../providers/phone-audio-provider';
 import { ConnectListType } from './types';
+import { FcrUIDialogProvider } from '../../providers/dialog-provider';
 export default class ConnectionGatewayStore {
     private _disposers;
     private _eventProvider;
     private _deviceProvider;
+    private _dialogProvider;
     private _failureTimer;
     private _phoneAudioConnectorProvider;
     accessor rememberMe: boolean;
@@ -24,10 +26,11 @@ export default class ConnectionGatewayStore {
     get hasNeedMergedStream(): boolean;
     get connectInfo(): import("fcr-core/lib/room-control/room-connector-control/type").FcrRoomConnectorPhoneInfo;
     get connectSession(): import("fcr-core/lib/room-control/room-connector-control/type").FcrPhoneConnectorSession | null;
-    constructor({ eventProvider, deviceProvider, phoneAudioConnectorProvider, }: {
+    constructor({ eventProvider, deviceProvider, phoneAudioConnectorProvider, dialogProvider, }: {
         eventProvider: FcrUIEventProvider;
         deviceProvider: FcrUIDeviceProvider;
         phoneAudioConnectorProvider: FcrUIPhoneAudioConnectorProvider;
+        dialogProvider: FcrUIDialogProvider;
     });
     startCall(): void;
     stopCall(): void;

package/lib/modules/phone-audio-connect/store.js

@@ -94,7 +94,8 @@ var ConnectionGatewayStore = exports["default"] = /*#__PURE__*/function () {
     var _this = this;
     var eventProvider = _ref2.eventProvider,
       deviceProvider = _ref2.deviceProvider,
-      phoneAudioConnectorProvider = _ref2.phoneAudioConnectorProvider;
+      phoneAudioConnectorProvider = _ref2.phoneAudioConnectorProvider,
+      dialogProvider = _ref2.dialogProvider;
     (0, _classCallCheck2["default"])(this, ConnectionGatewayStore);
     (0, _defineProperty2["default"])(this, _ref, (_initProto(this), []));
     (0, _defineProperty2["default"])(this, "_failureTimer", null);
@@ -108,6 +109,7 @@ var ConnectionGatewayStore = exports["default"] = /*#__PURE__*/function () {
     this._eventProvider = eventProvider;
     this._deviceProvider = deviceProvider;
     this._phoneAudioConnectorProvider = phoneAudioConnectorProvider;
+    this._dialogProvider = dialogProvider;
     this.initRememberedData();
     this._disposers.push((0, _mobx.reaction)(function () {
       return phoneAudioConnectorProvider.accepted;
@@ -218,7 +220,7 @@ var ConnectionGatewayStore = exports["default"] = /*#__PURE__*/function () {
   }, {
     key: "openAudioSettings",
     value: function openAudioSettings() {
-      this._eventProvider.openDeviceSettingDialog({
+      this._dialogProvider.openDeviceSettingDialog({
         activeTab: _store.DeviceSettingTab.AUDIO,
         highlightSelector: _constant.FcrUIHighlightElement.AUDIO_MICROPHONE
       });

package/lib/modules/setting/audio-settings/audio-settings.js

@@ -1,6 +1,20 @@
 "use strict";
 
+require("core-js/modules/es.symbol.js");
+require("core-js/modules/es.array.filter.js");
+require("core-js/modules/es.array.for-each.js");
+require("core-js/modules/es.array.push.js");
+require("core-js/modules/es.object.define-properties.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/es.object.get-own-property-descriptors.js");
+require("core-js/modules/es.object.keys.js");
+require("core-js/modules/esnext.async-iterator.filter.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.filter.js");
+require("core-js/modules/esnext.iterator.for-each.js");
+require("core-js/modules/web.dom-collections.for-each.js");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -14,6 +28,7 @@ require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/es.regexp.to-string.js");
 require("core-js/modules/esnext.async-iterator.map.js");
 require("core-js/modules/esnext.iterator.map.js");
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = require("react");
 var _radio = require("agora-ui-foundation/lib/components/radio");
@@ -29,14 +44,15 @@ var _speakerDetection = require("../../device-pretest/audio-preview/speaker-dete
 var _mobxReact = require("mobx-react");
 var _store = require("../store");
 require("./index.css");
-var _icon = require("agora-ui-foundation/lib/components/icon");
-var _type = require("agora-ui-foundation/lib/components/icon/type");
-var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
 var _constant = require("../../../utilities/constant");
 var _env = require("agora-foundation/lib/utilities/env");
-var _fcrCore = require("fcr-core");
+var _type = require("../../../type");
+var _view = require("../view");
 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 AudioSettings = exports.AudioSettings = (0, _mobxReact.observer)(function () {
+  var _setting$noiseReduce;
   var ns = (0, _useNamespace.useNamespace)('device-settings-audio');
   var t = (0, _i18n.useI18n)();
   var containerRef = (0, _react.useRef)(null);
@@ -67,25 +83,31 @@ var AudioSettings = exports.AudioSettings = (0, _mobxReact.observer)(function ()
     stopSpeakerTest = _useContext.stopSpeakerTest,
     startSpeakerTest = _useContext.startSpeakerTest,
     microphoneDetecting = _useContext.microphoneDetecting,
-    speakerDetecting = _useContext.speakerDetecting;
+    speakerDetecting = _useContext.speakerDetecting,
+    settingConfig = _useContext.settingConfig,
+    changeMediaSetting = _useContext.changeMediaSetting;
   var noiseReduceOptions = (0, _react.useMemo)(function () {
     return [{
-      label: t('fmt_internalsetting_label_automatic'),
-      value: _fcrCore.FcrAiDenoiseLevel.AUTO
+      label: t('fmt_premeeting_setting_label_turn_off'),
+      value: _type.FcrUIAiDenoiseLevel.CLOSE
     }, {
       label: t('fmt_setting_option_3alow'),
       addition: t('fmt_internalsetting_tips_backgroundsound'),
-      value: _fcrCore.FcrAiDenoiseLevel.LOW
+      value: _type.FcrUIAiDenoiseLevel.LOW
     }, {
       label: t('fmt_setting_option_3amoderate'),
       addition: t('fmt_internalsetting_tips_fanpan'),
-      value: _fcrCore.FcrAiDenoiseLevel.MEDIUM
+      value: _type.FcrUIAiDenoiseLevel.MEDIUM
     }, {
       label: t('fmt_setting_option_3ahigh'),
       addition: t('fmt_internalsetting_tips_dogbarking'),
-      value: _fcrCore.FcrAiDenoiseLevel.HIGH
+      value: _type.FcrUIAiDenoiseLevel.HIGH
     }];
   }, [t]);
+  var _useState3 = (0, _react.useState)(settingConfig.media),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    mediaSetting = _useState4[0],
+    setMediaSetting = _useState4[1];
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: ns.b(),
     ref: containerRef,
@@ -168,20 +190,40 @@ var AudioSettings = exports.AudioSettings = (0, _mobxReact.observer)(function ()
           draggableDom: containerDom,
           disabled: setting.autoAdjustmentMicrophoneVolume
         })]
-      }), (0, _env.isElectron)() && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: ns.em('checkbox-wrapper', 'bordered'),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
+        children: [(0, _env.isElectron)() && /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
           size: "small",
           label: t('fmt_setting_option_volumeadjust', {
             reason1: t('fmt_setting_label_Mic')
           }),
           checked: setting.autoAdjustmentMicrophoneVolume,
           onChange: function onChange(v) {
-            return setSetting({
+            setSetting({
               autoAdjustmentMicrophoneVolume: v
             });
           }
-        })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
+          size: "small",
+          label: t('fmt_premeeting_setting_label_turn_on_microphone'),
+          checked: !mediaSetting.microphoneExpectedOff,
+          onChange: function onChange(v) {
+            setMediaSetting(_objectSpread(_objectSpread({}, mediaSetting), {}, {
+              microphoneExpectedOff: !v
+            }));
+            changeMediaSetting('microphoneExpectedOff', !v);
+          }
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
+          size: "small",
+          label: t('fmt_premeeting_setting_checkbox_joining_meeting_connect_audio'),
+          checked: mediaSetting.autoConnectAudio,
+          onChange: function onChange(v) {
+            setMediaSetting(_objectSpread(_objectSpread({}, mediaSetting), {}, {
+              autoConnectAudio: v
+            }));
+            changeMediaSetting('autoConnectAudio', v);
+          }
+        })]
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: (0, _classnames["default"])(ns.e('section'), ns.e('section-reduce-noise')),
@@ -190,15 +232,16 @@ var AudioSettings = exports.AudioSettings = (0, _mobxReact.observer)(function ()
         className: ns.e('section-title'),
         children: t('fmt_setting_label_3a')
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.FcrRadioGroup, {
-        value: setting.noiseReduce.toString(),
+        value: (_setting$noiseReduce = setting.noiseReduce) === null || _setting$noiseReduce === void 0 ? void 0 : _setting$noiseReduce.toString(),
         onChange: function onChange(v) {
-          return setSetting({
+          setSetting({
             noiseReduce: Number(v)
           });
         },
         children: noiseReduceOptions.map(function (item) {
+          var _item$value;
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.FcrRadio, {
-            value: item.value.toString(),
+            value: (_item$value = item.value) === null || _item$value === void 0 ? void 0 : _item$value.toString(),
             label: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
                 children: item.label
@@ -226,7 +269,7 @@ var AudioSettings = exports.AudioSettings = (0, _mobxReact.observer)(function ()
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_switch.FcrSwitch, {
             value: setting.audioVoiceChanger,
             onChange: function onChange(v) {
-              return setSetting({
+              setSetting({
                 audioVoiceChanger: v
               });
             }
@@ -243,41 +286,27 @@ var AudioSettings = exports.AudioSettings = (0, _mobxReact.observer)(function ()
             size: "small",
             checked: setting.audioHiFi,
             onChange: function onChange(v) {
-              return setSetting({
+              setSetting({
                 audioHiFi: v
               });
             },
             label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               className: ns.e('checkbox-item'),
-              children: [t('fmt_settings_options_highquality'), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
-                mouseEnterDelay: 0,
-                content: t('fmt_internalsetting_tips_optiomizeaudio'),
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-                    type: _type.FcrIconType.FCR_HELPQUESTION,
-                    size: 14
-                  })
-                })
+              children: [t('fmt_settings_options_highquality'), /*#__PURE__*/(0, _jsxRuntime.jsx)(_view.HelpQuestionIcon, {
+                content: t('fmt_internalsetting_tips_optiomizeaudio')
               })]
             })
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
             size: "small",
             label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               className: ns.e('checkbox-item'),
-              children: [t('fmt_settings_options_echocancel'), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
-                mouseEnterDelay: 0,
-                content: t('fmt_internalsetting_tips_preventechoes'),
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-                    type: _type.FcrIconType.FCR_HELPQUESTION,
-                    size: 14
-                  })
-                })
+              children: [t('fmt_settings_options_echocancel'), /*#__PURE__*/(0, _jsxRuntime.jsx)(_view.HelpQuestionIcon, {
+                content: t('fmt_internalsetting_tips_preventechoes')
               })]
             }),
             checked: setting.audioEchoCancellation,
             onChange: function onChange(v) {
-              return setSetting({
+              setSetting({
                 audioEchoCancellation: v
               });
             }
@@ -285,20 +314,13 @@ var AudioSettings = exports.AudioSettings = (0, _mobxReact.observer)(function ()
             size: "small",
             label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
               className: ns.e('checkbox-item'),
-              children: [t('fmt_settings_options_stereo'), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
-                mouseEnterDelay: 0,
-                content: t('fmt_internalsetting_labels_audiostereoencode'),
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-                    type: _type.FcrIconType.FCR_HELPQUESTION,
-                    size: 14
-                  })
-                })
+              children: [t('fmt_settings_options_stereo'), /*#__PURE__*/(0, _jsxRuntime.jsx)(_view.HelpQuestionIcon, {
+                content: t('fmt_internalsetting_labels_audiostereoencode')
               })]
             }),
             checked: setting.audioStereo,
             onChange: function onChange(v) {
-              return setSetting({
+              setSetting({
                 audioStereo: v
               });
             }

package/lib/modules/setting/audio-settings/index.css

@@ -91,7 +91,7 @@
 }
 
 .fcr-device-settings-audio__form-item {
-  height: 28px;
+  height: 32px;
   padding: 0 10px;
   display: flex;
   align-items: center;
@@ -119,10 +119,24 @@
 .fcr-device-settings-audio__checkbox-wrapper--bordered {
   margin-top: 5px;
   border-top: 1px solid var(--fcr_ui_scene_line2);
-  height: 46px;
-  padding: 0 8px;
+  /* height: 46px; */
+  padding: 8px 8px;
   display: flex;
-  align-items: center;
+  /* align-items: center; */
+  /* gap: 10px; */
+  flex-direction: column;
+}
+.fcr-device-settings-audio__checkbox-wrapper--bordered .fcr-checkbox {
+  /* height: 32px; */
+  align-items: start;
+  margin: 6px 0;
+}
+
+.fcr-device-settings-audio__checkbox-wrapper--bordered .fcr-checkbox-label {
+  font-size: 14px;
+  font-weight: 400;
+  color: var(--fcr_ui_scene_icontext1);
+  line-height: 20px;
 }
 
 .fcr-device-settings-audio__section-reduce-noise {
@@ -169,10 +183,13 @@
   border-radius: var(--fcr_cornerradius_xs);
   padding: 0 4px;
 }
-.fcr-speaker-detection .fcr-button p,
-.fcr-microphone-detection .fcr-button p {
+.fcr-speaker-detection .fcr-button > div,
+.fcr-microphone-detection .fcr-button > div {
   width: 100px;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+.fcr-device-settings-audio__detection-wrapper {
+  margin-bottom: 8px;
+}

package/lib/modules/setting/general-settings/general-settings.d.ts

@@ -1,4 +1,3 @@
-import { FC } from 'react';
 import './index.css';
-export declare const GeneralSettings: FC;
+export declare const GeneralSettings: () => import("react/jsx-runtime").JSX.Element;
 export default GeneralSettings;

package/lib/modules/setting/general-settings/general-settings.js

@@ -5,6 +5,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = exports.GeneralSettings = void 0;
+require("core-js/modules/es.array.concat.js");
+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 _react = require("react");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 var _useNamespace = require("../common/useNamespace");
@@ -12,56 +16,126 @@ require("./index.css");
 var _mobxReact = require("mobx-react");
 var _store = require("../store");
 var _checkbox = require("agora-ui-foundation/lib/components/checkbox");
-var _icon = require("agora-ui-foundation/lib/components/icon");
-var _type = require("agora-ui-foundation/lib/components/icon/type");
-var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
+var _radio = require("agora-ui-foundation/lib/components/radio");
+var _view = require("../view");
 var _jsxRuntime = require("react/jsx-runtime");
+var Section = (0, _mobxReact.observer)(function (_ref) {
+  var children = _ref.children,
+    title = _ref.title;
+  var ns = (0, _useNamespace.useNamespace)('general-settings');
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: ns.e('basic-form'),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: ns.e('section-title'),
+      children: title
+    }), children]
+  });
+});
 var GeneralSettings = exports.GeneralSettings = (0, _mobxReact.observer)(function () {
   var ns = (0, _useNamespace.useNamespace)('general-settings');
   var t = (0, _i18n.useI18n)();
+  var languageOptions = [{
+    label: t('fmt_premeeting_setting_label_Chinese'),
+    value: 'zh'
+  }, {
+    label: t('fmt_premeeting_setting_label_English'),
+    value: 'en'
+  }];
   var _useContext = (0, _react.useContext)(_store.StoreContext),
     setting = _useContext.setting,
-    setSetting = _useContext.setSetting;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    setSetting = _useContext.setSetting,
+    messageProvider = _useContext.messageProvider;
+  var layoutSettingList = [{
+    label: t('fmt_internalsetting_labels_voicestimulation'),
+    tooltip: t('fmt_internalsetting_other_spot_light_desc'),
+    checked: setting.spotlightEnabled,
+    onChange: function onChange(v) {
+      return setSetting({
+        spotlightEnabled: v
+      });
+    }
+  }, {
+    label: t('fmt_premeeting_setting_label_hide_participants_without_video'),
+    tooltip: t('fmt_internalsetting_labels_hide_video_off'),
+    checked: setting.shouldHideNonVideoParticipants,
+    onChange: function onChange(v) {
+      return setSetting({
+        shouldHideNonVideoParticipants: v
+      });
+    }
+  }, {
+    label: t('fmt_internalsetting_other_hide_me'),
+    tooltip: t('fmt_internalsetting_labels_hide_my_video'),
+    checked: setting.shouldHideMyVideo,
+    onChange: function onChange(v) {
+      setSetting({
+        shouldHideMyVideo: v
+      });
+      if (v) {
+        messageProvider.showToast({
+          message: (0, _i18n.transI18n)('fmt_internalsetting_other_hide_me_toast'),
+          type: 'info'
+        });
+      }
+    }
+  }];
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: ns.b(),
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: ns.e('basic-form'),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Section, {
+      title: t('fmt_statusbar_label_layoutsetting'),
+      children: layoutSettingList.map(function (_ref2) {
+        var label = _ref2.label,
+          tooltip = _ref2.tooltip,
+          checked = _ref2.checked,
+          onChange = _ref2.onChange;
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
+          size: "small",
+          label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            className: ns.e('spotlight-label'),
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+              children: label
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_view.HelpQuestionIcon, {
+              content: tooltip,
+              placement: "top"
+            })]
+          }),
+          checked: checked,
+          onChange: onChange
+        }, label);
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Section, {
+      title: t('fmt_settings_labels_prompt_tone'),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
         size: "small",
-        label: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-          className: ns.e('spotlight-label'),
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            children: t('fmt_internalsetting_labels_voicestimulation')
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
-            mouseEnterDelay: 0,
-            trigger: "hover",
-            placement: "top",
-            content: t('fmt_internalsetting_other_spot_light_desc'),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-                type: _type.FcrIconType.FCR_HELPQUESTION,
-                size: 16
-              })
-            })
-          })]
-        }),
-        checked: setting.spotlightEnabled,
+        label: t('fmt_internalsetting_options_play_prompt'),
+        checked: setting.isPlaySound,
         onChange: function onChange(v) {
-          return setSetting({
-            spotlightEnabled: v
+          setSetting({
+            isPlaySound: v
           });
         }
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_checkbox.FcrCheckbox, {
-        size: "small",
-        label: t('fmt_internalsetting_options_hidenonvideo'),
-        checked: setting.shouldHideNonVideoParticipants,
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Section, {
+      title: t('fmt_premeeting_setting_mobile_option_bilingual'),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.FcrRadioGroup, {
+        value: setting.language,
         onChange: function onChange(v) {
-          return setSetting({
-            shouldHideNonVideoParticipants: v
+          setSetting({
+            language: v
           });
-        }
-      })]
-    })
+          (0, _i18n.changeLanguage)(v);
+        },
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "".concat(ns.e('section-group'), " ").concat(ns.e('section-group-language')),
+          children: languageOptions.map(function (item) {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_radio.FcrRadio, {
+              value: item.value,
+              label: item.label
+            }, item.value);
+          })
+        })
+      })
+    })]
   });
 });
 var _default = exports["default"] = GeneralSettings;

package/lib/modules/setting/general-settings/index.css

@@ -24,3 +24,18 @@
   justify-content: center;
   gap: 5px;
 }
+.fcr-general-settings__section-group {
+  display: flex;
+  gap: 10px;
+  height: 32px;
+}
+.fcr-general-settings__section-title {
+  font-size: 13px;
+  font-weight: 700;
+  color: var(--fcr_ui_scene_icontext1);
+  margin-bottom: 10px;
+}
+
+.fcr-general-settings__section-group-language .fcr-radio-label {
+  line-height: 16px;
+}

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

@@ -1,5 +1,5 @@
 import { FcrUINode, UIModule } from '../../base';
-import { FcrStreamControl } from 'fcr-core';
+import { FcrStreamControl, FcrUserControl } from 'fcr-core';
 import { FcrUIDeviceProvider } from '../../providers/device-provider';
 import { FcrUICurrentRoomControlProvider } from '../../providers/room-provider';
 import { FcrUIEventProvider } from '../../providers/event-provider';
@@ -10,11 +10,13 @@ import './index.css';
 import { FcrUIMessageProvider } from '../../providers/message-provider';
 import { FcrUISharedSettingDataSource } from '../../shared-data-source/setting';
 import { FcrUIDialogProvider } from '../../providers/dialog-provider';
+import { FcrUILocalStorageProviderImpl } from '../../providers/local-storage-provider';
 export declare class SettingUIModule extends UIModule {
     private _store?;
     deviceProvider?: FcrUIDeviceProvider;
     currentRoomControlProvider?: FcrUICurrentRoomControlProvider;
     monitorProvider?: FcrUIMonitorProvider;
+    userControl?: FcrUserControl;
     streamControl?: FcrStreamControl;
     eventProvider?: FcrUIEventProvider;
     sharedConfigDataSource?: FcrUISharedConfigDataSource;
@@ -22,6 +24,7 @@ export declare class SettingUIModule extends UIModule {
     messageProvider?: FcrUIMessageProvider;
     dialogProvider?: FcrUIDialogProvider;
     sharedSettingDataSource?: FcrUISharedSettingDataSource;
+    localStorageProvider?: FcrUILocalStorageProviderImpl;
     constructor(parentNode: FcrUINode, rootNode: FcrUINode);
     onNodeWillActive(): void;
     onNodeWillInactive(): void;

package/lib/modules/setting/index.js

@@ -81,10 +81,11 @@ var SettingUIModule = exports.SettingUIModule = /*#__PURE__*/function (_UIModule
   return (0, _createClass2["default"])(SettingUIModule, [{
     key: "onNodeWillActive",
     value: function onNodeWillActive() {
-      var _this$currentRoomCont, _this$sharedConfigDat;
+      var _this$currentRoomCont, _this$currentRoomCont2, _this$sharedConfigDat;
       this.streamControl = (_this$currentRoomCont = this.currentRoomControlProvider) === null || _this$currentRoomCont === void 0 ? void 0 : _this$currentRoomCont.currentRoomControl.getStreamControl();
-      if (this.deviceProvider && this.currentRoomControlProvider && this.streamControl && this.eventProvider && this.monitorProvider && (_this$sharedConfigDat = this.sharedConfigDataSource) !== null && _this$sharedConfigDat !== void 0 && _this$sharedConfigDat.sceneConfig && this.sharedConfigDataSource.settingConfig && this.sharedLayoutDataSource && this.messageProvider && this.dialogProvider && this.sharedSettingDataSource) {
-        var _this$sharedConfigDat2, _this$sharedConfigDat3;
+      this.userControl = (_this$currentRoomCont2 = this.currentRoomControlProvider) === null || _this$currentRoomCont2 === void 0 ? void 0 : _this$currentRoomCont2.currentRoomControl.getUserControl();
+      if (this.deviceProvider && this.currentRoomControlProvider && this.streamControl && this.eventProvider && this.monitorProvider && (_this$sharedConfigDat = this.sharedConfigDataSource) !== null && _this$sharedConfigDat !== void 0 && _this$sharedConfigDat.sceneConfig && this.sharedConfigDataSource.settingConfig && this.sharedLayoutDataSource && this.messageProvider && this.dialogProvider && this.sharedSettingDataSource && this.localStorageProvider) {
+        var _this$sharedConfigDat2, _this$sharedConfigDat3, _this$userControl;
         this._store = new _store["default"]({
           uiEventStore: this.eventProvider,
           monitorControl: this.monitorProvider,
@@ -97,7 +98,9 @@ var SettingUIModule = exports.SettingUIModule = /*#__PURE__*/function (_UIModule
           messageProvider: this.messageProvider,
           sharedSettingDataSource: this.sharedSettingDataSource,
           dialogProvider: this.dialogProvider,
-          settingConfig: this.sharedConfigDataSource.settingConfig
+          settingConfig: this.sharedConfigDataSource.settingConfig,
+          localStorageProvider: this.localStorageProvider,
+          userId: (_this$userControl = this.userControl) === null || _this$userControl === void 0 ? void 0 : _this$userControl.getLocalUser().userId
         });
       }
     }

package/lib/modules/setting/state/index.js

@@ -333,7 +333,7 @@ var DataCard = (0, _mobxReact.observer)(function (props) {
               children: item.down
             })]
           })]
-        });
+        }, item.title);
       })
     })]
   }));