fcr-ui-scene 3.3.1 → 3.4.1

package/lib/modules/Interpreter/interpreter-list/index.css

@@ -1,21 +1,8 @@
 /* 设置滚动容器 */
 .fcr-simultaneous-interpretation__interpreter-list-container {
-  /* width: 200px; */
-  flex: 1;
-  overflow: auto; /* 开启滚动条 */
-  max-height: calc(434px - 106px);
-}
-
-/* 隐藏滚动条但仍然可滚动 */
-.fcr-simultaneous-interpretation__interpreter-list-container::-webkit-scrollbar {
-  display: none; /* 对于WebKit浏览器隐藏滚动条 */
-}
-
-.fcr-simultaneous-interpretation__interpreter-list-container {
-  -ms-overflow-style: none; /* 对于IE和Edge隐藏滚动条 */
-  scrollbar-width: none; /* 对于Firefox隐藏滚动条 */
-}
-
-.fcr-simultaneous-interpretation__interpreter-list-container-bottom {
-  /* margin-top: ; */
+  overflow: auto;
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+  height: 100%;
+  padding: 5px 20px 85px;
 }

package/lib/modules/Interpreter/interpreter-list/index.d.ts

@@ -1,3 +1,7 @@
 import './index.css';
-declare const _default: () => import("react/jsx-runtime").JSX.Element;
+interface InterpreterListProps {
+    isShowAddBtn: boolean;
+    refDom: React.MutableRefObject<HTMLDivElement | null>;
+}
+declare const _default: (props: InterpreterListProps) => import("react/jsx-runtime").JSX.Element;
 export default _default;

package/lib/modules/Interpreter/interpreter-list/index.js

@@ -21,44 +21,27 @@ require("core-js/modules/esnext.iterator.map.js");
 var _react = require("react");
 var _mobxReact = require("mobx-react");
 var _interpreterItem = _interopRequireDefault(require("./interpreter-item"));
-var _addButton = _interopRequireWildcard(require("../add-button"));
-var _context = require("../context");
+var _addBtn = _interopRequireWildcard(require("../action/add-btn"));
+var _store = require("../store");
 require("./index.css");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
-var InterpreterList = function InterpreterList() {
-  var _useContext = (0, _react.useContext)(_context.StoreContext),
-    isScroll = _useContext.isScroll,
-    setIsScroll = _useContext.setIsScroll,
-    localInterpreterUsers = _useContext.localInterpreterUsers,
-    interpreterUsersEditState = _useContext.interpreterUsersEditState,
-    interpreterState = _useContext.interpreterState;
-  var isShowAddButton = !isScroll && (interpreterUsersEditState || !interpreterState);
-  var handleScroll = (0, _react.useCallback)(function (e) {
-    var scrollPosition = e.target.pageYOffset || e.target.scrollTop;
-    setIsScroll(scrollPosition > 0);
-  }, [setIsScroll]);
-  (0, _react.useEffect)(function () {
-    var dom = document.getElementById('simultaneous-interpretation-scroll-container');
-    dom === null || dom === void 0 || dom.addEventListener('scroll', handleScroll);
-    return function () {
-      dom === null || dom === void 0 || dom.removeEventListener('scroll', handleScroll);
-    };
-  }, [handleScroll]);
+var InterpreterList = function InterpreterList(props) {
+  var isShowAddBtn = props.isShowAddBtn,
+    refDom = props.refDom;
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
+    localInterpreterUsers = _useContext.localInterpreterUsers;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "fcr-simultaneous-interpretation__interpreter-list-container",
-    id: "simultaneous-interpretation-scroll-container",
-    children: [isShowAddButton && /*#__PURE__*/(0, _jsxRuntime.jsx)(_addButton["default"], {
-      position: _addButton.PositionType.TOP
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: "fcr-simultaneous-interpretation__interpreter-list-container-bottom",
-      children: localInterpreterUsers.map(function (ele, i) {
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_interpreterItem["default"], {
-          model: ele,
-          index: i
-        }, ele.randomKey);
-      })
+    ref: refDom,
+    children: [isShowAddBtn && /*#__PURE__*/(0, _jsxRuntime.jsx)(_addBtn["default"], {
+      position: _addBtn.PositionType.TOP
+    }), localInterpreterUsers.map(function (ele, i) {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_interpreterItem["default"], {
+        model: ele,
+        index: i
+      }, ele.randomKey);
     })]
   });
 };

package/lib/modules/Interpreter/interpreter-list/interpreter-item/components/pick-language/index.css

@@ -2,30 +2,45 @@
   display: flex;
   justify-content: space-between;
   align-items: center;
+  flex: 2;
 }
 .fcr-simultaneous-interpretation__pick-Language-container-select {
-  width: 110px;
+  /* min-width: 182px; */
   height: 32px;
+  flex: 1;
 }
+
 .fcr-simultaneous-interpretation__pick-Language-container-select-option {
   display: flex;
-  /* justify-content: center; */
   align-items: center;
+  justify-content: left;
 }
 
 .fcr-simultaneous-interpretation__pick-Language-container-select-option-img {
+  width: 20px;
+  height: 20px;
 }
-.fcr-simultaneous-interpretation__pick-Language-container-select-option-text {
+
+.fcr-simultaneous-interpretation__pick-Language-container-select-option-name {
   margin-left: 3px;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 90px;
+}
+.fcr-simultaneous-interpretation__pick-Language-container-select-option-decollator {
+  padding: 0 6px;
+  width: 18px;
 }
 
-.fcr-simultaneous-interpretation__pick-Language-container-icon {
-  /* width: 24px;
-  height: 24px;
-  padding: 4px; */
+.fcr-simultaneous-interpretation__pick-Language-container-select-option-text {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  margin-left: 3px;
 }
 
 .fcr-simultaneous-interpretation__pick-Language-container .fcr-select__options {
-  max-height: 340px;
+  max-height: 100px;
   overflow-y: overlay;
 }

package/lib/modules/Interpreter/interpreter-list/interpreter-item/components/pick-language/index.d.ts

@@ -1,9 +1,12 @@
 import { FcrLanguage } from 'fcr-core/lib/room-control/interpreter-control/types';
 import './index.css';
-import { InitInterpreterItemModelType } from '../../../../constant';
+import { InitInterpreterItemModelType } from '../../../../type';
 export declare const OptionItem: (props: {
     model: FcrLanguage;
 }) => import("react/jsx-runtime").JSX.Element;
+export declare const ValueDom: (props: {
+    model: FcrLanguage;
+}) => import("react/jsx-runtime").JSX.Element;
 interface PickLanguageProps {
     model: InitInterpreterItemModelType;
 }

package/lib/modules/Interpreter/interpreter-list/interpreter-item/components/pick-language/index.js

@@ -20,25 +20,46 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.OptionItem = void 0;
+exports["default"] = exports.ValueDom = exports.OptionItem = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 require("core-js/modules/es.array.map.js");
+require("core-js/modules/es.function.name.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 _select = require("agora-ui-foundation/lib/components/select");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _react = require("react");
-var _context = require("../../../../context");
+var _store = require("../../../../store");
 var _mobxReact = require("mobx-react");
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
 require("./index.css");
 var _useLanguageConfig = require("./useLanguageConfig");
-var _constant = require("../../../../constant");
+var _i18n = require("agora-ui-foundation/lib/i18n");
 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 OptionItem = exports.OptionItem = (0, _mobxReact.observer)(function (props) {
+  var model = props.model;
+  var option = (0, _useLanguageConfig.useLanguageConfig)()(model);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "fcr-simultaneous-interpretation__pick-Language-container-select-option",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+      className: "fcr-simultaneous-interpretation__pick-Language-container-select-option-img",
+      src: option.imgSrc
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "fcr-simultaneous-interpretation__pick-Language-container-select-option-name",
+      children: option.name
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "fcr-simultaneous-interpretation__pick-Language-container-select-option-decollator",
+      children: "-"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "fcr-simultaneous-interpretation__pick-Language-container-select-option-text",
+      children: option.text
+    })]
+  });
+});
+var ValueDom = exports.ValueDom = (0, _mobxReact.observer)(function (props) {
   var model = props.model;
   var option = (0, _useLanguageConfig.useLanguageConfig)()(model);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
@@ -53,13 +74,15 @@ var OptionItem = exports.OptionItem = (0, _mobxReact.observer)(function (props)
       }
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "fcr-simultaneous-interpretation__pick-Language-container-select-option-text",
-      children: option.text
+      children: option.name
     })]
   });
 });
 var PickLanguage = function PickLanguage(props) {
+  var _model$sourceLanguage, _model$targetLanguage;
   var model = props.model;
-  var _useContext = (0, _react.useContext)(_context.StoreContext),
+  var transI18n = (0, _i18n.useI18n)();
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
     updateInterpreterUsers = _useContext.updateInterpreterUsers,
     interpreterState = _useContext.interpreterState,
     interpreterUsersEditState = _useContext.interpreterUsersEditState,
@@ -67,8 +90,8 @@ var PickLanguage = function PickLanguage(props) {
   var handleChange = function handleChange(data) {
     updateInterpreterUsers(_objectSpread(_objectSpread({}, model), data));
   };
-  var targetValue = model[_constant.InterpreterItemType.INPUT_LANGUAGE];
-  var sourceValue = model[_constant.InterpreterItemType.OUTPUT_LANGUAGE];
+  var targetValue = (_model$sourceLanguage = model.sourceLanguage) !== null && _model$sourceLanguage !== void 0 ? _model$sourceLanguage : '';
+  var sourceValue = (_model$targetLanguage = model.targetLanguage) !== null && _model$targetLanguage !== void 0 ? _model$targetLanguage : '';
   var targetOptions = (0, _react.useMemo)(function () {
     return languageList.map(function (ele) {
       return {
@@ -79,6 +102,11 @@ var PickLanguage = function PickLanguage(props) {
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(OptionItem, {
             model: ele
           });
+        },
+        valueRender: function valueRender(option) {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(ValueDom, {
+            model: ele
+          });
         }
       };
     });
@@ -93,10 +121,16 @@ var PickLanguage = function PickLanguage(props) {
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(OptionItem, {
             model: ele
           });
+        },
+        valueRender: function valueRender(option) {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(ValueDom, {
+            model: ele
+          });
         }
       };
     });
   }, [languageList, targetValue]);
+  var tranI18n = (0, _i18n.useI18n)();
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "fcr-simultaneous-interpretation__pick-Language-container",
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_select.FcrSelect, {
@@ -106,16 +140,18 @@ var PickLanguage = function PickLanguage(props) {
       value: targetValue,
       showSearch: true,
       onChange: function onChange(value) {
-        handleChange((0, _defineProperty2["default"])({}, _constant.InterpreterItemType.INPUT_LANGUAGE, value));
+        handleChange({
+          sourceLanguage: value
+        });
       },
-      placeholder: '语言' // 请选择设备
+      placeholder: transI18n('fmt_interpretation_setting_popup_controller_labe_source_language') // 请选择设备
       ,
       styleType: "white"
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
       mouseEnterDelay: 0,
       trigger: "hover",
       placement: "top",
-      content: "2\u79CD\u8BED\u8A00\u90FD\u9700\u652F\u6301\u8F93\u51FA,\u975E\u5355\u5411\u8F93\u51FA",
+      content: tranI18n('fmt_interpretation_setting_popup_controller_label_both_language'),
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
           type: _type.FcrIconType.FCR_TRANSLANGUAGE,
@@ -129,9 +165,11 @@ var PickLanguage = function PickLanguage(props) {
       options: sourceOptions,
       value: sourceValue,
       onChange: function onChange(value) {
-        handleChange((0, _defineProperty2["default"])({}, _constant.InterpreterItemType.OUTPUT_LANGUAGE, value));
+        handleChange({
+          targetLanguage: value
+        });
       },
-      placeholder: '语言' // 请选择设备
+      placeholder: transI18n('fmt_interpretation_setting_popup_controller_labe_source_language') // 请选择设备
       ,
       styleType: "white",
       disabled: !interpreterUsersEditState && interpreterState

package/lib/modules/Interpreter/interpreter-list/interpreter-item/components/pick-language/useLanguageConfig/index.d.ts

@@ -1,11 +1,16 @@
 import { FcrLanguage } from 'fcr-core/lib/room-control/interpreter-control/types';
 export interface LanguageConfig {
+    abbr: string;
+    name: string;
+}
+export interface BaseLanguageConfig {
     value: FcrLanguage;
     imgSrc: string;
     text: string;
-    abbr: string;
 }
-export declare const languageConfigList: {
-    [key in FcrLanguage]: LanguageConfig;
+export interface MergeLanguageConfig extends LanguageConfig, BaseLanguageConfig {
+}
+export declare const baseLanguageConfig: {
+    [key in FcrLanguage]: BaseLanguageConfig;
 };
-export declare const useLanguageConfig: () => (key: FcrLanguage) => LanguageConfig;
+export declare const useLanguageConfig: () => (key: FcrLanguage) => MergeLanguageConfig;

package/lib/modules/Interpreter/interpreter-list/interpreter-item/components/pick-language/useLanguageConfig/index.js

@@ -1,13 +1,29 @@
 "use strict";
 
+require("core-js/modules/es.symbol.js");
+require("core-js/modules/es.array.filter.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/esnext.async-iterator.filter.js");
+require("core-js/modules/esnext.iterator.filter.js");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useLanguageConfig = exports.languageConfigList = void 0;
+exports.useLanguageConfig = exports.baseLanguageConfig = void 0;
+require("core-js/modules/es.array.for-each.js");
+require("core-js/modules/es.object.keys.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/esnext.async-iterator.for-each.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.for-each.js");
+require("core-js/modules/web.dom-collections.for-each.js");
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _types = require("fcr-core/lib/room-control/interpreter-control/types");
+var _i18n = require("agora-ui-foundation/lib/i18n");
 var _fcr_cn = _interopRequireDefault(require("./images/fcr_cn.png"));
 var _fcr_en = _interopRequireDefault(require("./images/fcr_en.png"));
 var _fcr_jp = _interopRequireDefault(require("./images/fcr_jp.png"));
@@ -25,95 +41,138 @@ var _fcr_th = _interopRequireDefault(require("./images/fcr_th.png"));
 var _fcr_vi = _interopRequireDefault(require("./images/fcr_vi.png"));
 var _fcr_ms = _interopRequireDefault(require("./images/fcr_ms.png"));
 var _fcr_tr = _interopRequireDefault(require("./images/fcr_tr.png"));
-var _languageConfigList;
-var languageConfigList = exports.languageConfigList = (_languageConfigList = {}, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_languageConfigList, _types.FcrLanguage.ZH, {
+var _baseLanguageConfig;
+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 baseLanguageConfig = exports.baseLanguageConfig = (_baseLanguageConfig = {}, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_baseLanguageConfig, _types.FcrLanguage.ZH, {
   value: _types.FcrLanguage.ZH,
   imgSrc: _fcr_cn["default"],
-  text: '中文',
-  abbr: '中'
+  text: '中文'
 }), _types.FcrLanguage.EN, {
   value: _types.FcrLanguage.EN,
   imgSrc: _fcr_en["default"],
-  text: 'English',
-  abbr: 'EN'
+  text: 'English'
 }), _types.FcrLanguage.JP, {
   value: _types.FcrLanguage.JP,
   imgSrc: _fcr_jp["default"],
-  text: '日本語',
-  abbr: 'JP'
+  text: '日本語'
 }), _types.FcrLanguage.KO, {
   value: _types.FcrLanguage.KO,
   imgSrc: _fcr_ko["default"],
-  text: '한국어',
-  abbr: 'KO'
+  text: '한국어'
 }), _types.FcrLanguage.DE, {
   value: _types.FcrLanguage.DE,
   imgSrc: _fcr_de["default"],
-  text: 'Deutsch',
-  abbr: 'DE'
+  text: 'Deutsch'
 }), _types.FcrLanguage.FR, {
   value: _types.FcrLanguage.FR,
   imgSrc: _fcr_fr["default"],
-  text: 'français',
-  abbr: 'EN'
+  text: 'français'
 }), _types.FcrLanguage.RU, {
   value: _types.FcrLanguage.RU,
   imgSrc: _fcr_ru["default"],
-  text: 'русский',
-  abbr: 'EN'
+  text: 'русский'
 }), _types.FcrLanguage.PT, {
   value: _types.FcrLanguage.PT,
   imgSrc: _fcr_pt["default"],
-  text: 'português',
-  abbr: 'PT'
+  text: 'português'
 }), _types.FcrLanguage.ES, {
   value: _types.FcrLanguage.ES,
   imgSrc: _fcr_es["default"],
-  text: 'español',
-  abbr: 'ES'
+  text: 'español'
 }), _types.FcrLanguage.IT, {
   value: _types.FcrLanguage.IT,
   imgSrc: _fcr_it["default"],
-  text: 'italiano',
-  abbr: 'IT'
-}), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_languageConfigList, _types.FcrLanguage.AR, {
+  text: 'italiano'
+}), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_baseLanguageConfig, _types.FcrLanguage.AR, {
   value: _types.FcrLanguage.AR,
   imgSrc: _fcr_ar["default"],
-  text: 'العربية',
-  abbr: 'AR'
+  text: 'العربية'
 }), _types.FcrLanguage.ID, {
   value: _types.FcrLanguage.ID,
   imgSrc: _fcr_id["default"],
-  text: 'BahasaIndonesia',
-  abbr: 'ID'
+  text: 'Bahasa Indonesia'
 }), _types.FcrLanguage.HI, {
   value: _types.FcrLanguage.HI,
   imgSrc: _fcr_hi["default"],
-  text: 'हिन्दी	',
-  abbr: 'HI'
+  text: 'हिन्दी	'
 }), _types.FcrLanguage.TH, {
   value: _types.FcrLanguage.TH,
   imgSrc: _fcr_th["default"],
-  text: 'ภาษาไทย',
-  abbr: 'TH'
+  text: 'ภาษาไทย'
 }), _types.FcrLanguage.VI, {
   value: _types.FcrLanguage.VI,
   imgSrc: _fcr_vi["default"],
-  text: 'Tiếng Việt',
-  abbr: 'VI'
+  text: 'Tiếng Việt'
 }), _types.FcrLanguage.MS, {
   value: _types.FcrLanguage.MS,
   imgSrc: _fcr_ms["default"],
-  text: 'Bahasa Melayu',
-  abbr: 'MS'
+  text: 'Bahasa Melayu'
 }), _types.FcrLanguage.TR, {
   value: _types.FcrLanguage.TR,
   imgSrc: _fcr_tr["default"],
-  text: 'español',
-  abbr: 'Türkçe'
+  text: 'Türkçe'
 }));
 var useLanguageConfig = exports.useLanguageConfig = function useLanguageConfig() {
+  var _languageConfigList;
+  var transI18n = (0, _i18n.useI18n)();
+  var languageConfigList = (_languageConfigList = {}, (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_languageConfigList, _types.FcrLanguage.ZH, {
+    abbr: transI18n('fmt_translate_language_chinese_mini'),
+    name: transI18n('fmt_translate_language_chinese')
+  }), _types.FcrLanguage.EN, {
+    abbr: transI18n('fmt_translate_language_english_mini'),
+    name: transI18n('fmt_translate_language_english')
+  }), _types.FcrLanguage.JP, {
+    abbr: transI18n('fmt_translate_language_japanese_mini'),
+    name: transI18n('fmt_translate_language_japanese')
+  }), _types.FcrLanguage.KO, {
+    abbr: transI18n('fmt_translate_language_korean_mini'),
+    name: transI18n('fmt_translate_language_korean')
+  }), _types.FcrLanguage.DE, {
+    abbr: transI18n('fmt_translate_language_german_mini'),
+    name: transI18n('fmt_translate_language_german')
+  }), _types.FcrLanguage.FR, {
+    abbr: transI18n('fmt_translate_language_french_mini'),
+    name: transI18n('fmt_translate_language_french')
+  }), _types.FcrLanguage.RU, {
+    abbr: transI18n('fmt_translate_language_russian_mini'),
+    name: transI18n('fmt_translate_language_russian')
+  }), _types.FcrLanguage.PT, {
+    abbr: transI18n('fmt_translate_language_portuguese_mini'),
+    name: transI18n('fmt_translate_language_portuguese')
+  }), _types.FcrLanguage.ES, {
+    abbr: transI18n('fmt_translate_language_spanish_mini'),
+    name: transI18n('fmt_translate_language_spanish')
+  }), _types.FcrLanguage.IT, {
+    abbr: transI18n('fmt_translate_language_ilalian_mini'),
+    name: transI18n('fmt_translate_language_ilalian')
+  }), (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])(_languageConfigList, _types.FcrLanguage.AR, {
+    abbr: transI18n('fmt_translate_language_arabic_mini'),
+    name: transI18n('fmt_translate_language_arabic')
+  }), _types.FcrLanguage.ID, {
+    abbr: transI18n('fmt_translate_language_indonesian_mini'),
+    name: transI18n('fmt_translate_language_indonesian')
+  }), _types.FcrLanguage.HI, {
+    abbr: transI18n('fmt_translate_language_hindi_mini'),
+    name: transI18n('fmt_translate_language_hindi')
+  }), _types.FcrLanguage.TH, {
+    abbr: transI18n('fmt_translate_language_thai_mini'),
+    name: transI18n('fmt_translate_language_thai')
+  }), _types.FcrLanguage.VI, {
+    abbr: transI18n('fmt_translate_language_vietnamese_mini'),
+    name: transI18n('fmt_translate_language_vietnamese')
+  }), _types.FcrLanguage.MS, {
+    abbr: transI18n('fmt_translate_language_malay_mini'),
+    name: transI18n('fmt_translate_language_malay')
+  }), _types.FcrLanguage.TR, {
+    abbr: transI18n('fmt_translate_language_turkish_mini'),
+    name: transI18n('fmt_translate_language_turkish')
+  }));
+  var mergeLanguageConfig = {};
+  Object.keys(baseLanguageConfig).forEach(function (languageKay) {
+    mergeLanguageConfig[languageKay] = _objectSpread(_objectSpread({}, baseLanguageConfig[languageKay]), languageConfigList[languageKay]);
+  });
   return function (key) {
-    return languageConfigList[key];
+    return mergeLanguageConfig[key];
   };
 };

package/lib/modules/Interpreter/interpreter-list/interpreter-item/components/pick-user/index.css

@@ -1,10 +1,11 @@
 .fcr-simultaneous-interpretation__select-user {
-  width: 183px;
   height: 32px;
+  flex: 1;
+  margin-right: 8px;
 }
 
 .fcr-simultaneous-interpretation__select-user .fcr-select__options {
-  max-height: 340px;
+  max-height: 112px;
   overflow-y: overlay;
 }
 
@@ -20,6 +21,7 @@
 .fcr-simultaneous-interpretation__select-user-options-item-avatar {
   margin-right: 8px;
   text-align: center;
+  width: 24px;
 }
 
 .fcr-simultaneous-interpretation__select-user-options-item-avatar .fcr-avatar {
@@ -34,8 +36,11 @@
 }
 
 .fcr-simultaneous-interpretation__select-user-options-item-user-name {
-  /* min-width: 40px; */
-  /* text-align: center; */
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 90px;
 }
 .fcr-simultaneous-interpretation__select-user-options-item-user-role {
+  white-space: nowrap;
 }

package/lib/modules/Interpreter/interpreter-list/interpreter-item/components/pick-user/index.d.ts

@@ -1,10 +1,5 @@
-import { FcrInterpreterUserInfo } from 'fcr-core/lib/room-control/interpreter-control/types';
+import { InitInterpreterItemModelType } from '../../../../type';
 import './index.css';
-import { InitInterpreterItemModelType } from '../../../../constant';
-type InterpreterItemPropertyKeys = keyof FcrInterpreterUserInfo;
-export type ObjectSatisfyingAnyInterpreterItemProperty = {
-    [K in InterpreterItemPropertyKeys]?: FcrInterpreterUserInfo[K];
-};
 interface PickUserProps {
     model: InitInterpreterItemModelType;
 }