fcr-ui-scene 3.4.0 → 3.4.1

package/lib/error-fallback.css

@@ -0,0 +1,62 @@
+.fcr-pc-full-screen-error {
+  width: 100%;
+  height: 100vh;
+  background-color: var(--fcr_ui_scene_inverse);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.fcr-pc-full-screen-error-content {
+  width: 272px;
+  height: 415px;
+  display: flex;
+  flex-direction: column;
+}
+
+.fcr-pc-full-screen-error-content-img {
+  width: 200px;
+  height: 200px;
+  align-self: center;
+}
+
+.fcr-pc-full-screen-close-btn {
+  width: 140px;
+  height: 50px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.fcr-pc-full-screen-error-content-title {
+  color: var(--fcr_ui_scene_inverse2);
+  font-size: 28px;
+  font-weight: 800;
+  align-self: center;
+  margin-top: 26px;
+}
+
+.fcr-pc-full-screen-error-content-desc {
+  color: var(--fcr_ui_scene_inverse2);
+  font-size: 16px;
+  font-weight: 400;
+  align-self: center;
+  margin-top: 24px;
+  margin-bottom: 46px;
+}
+
+.fcr-pc-full-screen-close-btn {
+  min-width: 56px;
+  height: 50px;
+  border-radius: var(--fcr_cornerradius_round);
+  background-color: var(--fcr_ui_scene_inverse2);
+  color: var(--fcr_ui_scene_inverse);
+  text-align: center;
+  line-height: 50px;
+  align-self: center;
+  cursor: pointer;
+}
+
+.fcr-pc-full-screen-close-btn:active {
+  transform: scale(0.94);
+}

package/lib/error-fallback.d.ts

@@ -0,0 +1,2 @@
+import { FallbackProps } from 'react-error-boundary';
+export declare const ErrorFallback: ({ error }: FallbackProps) => import("react/jsx-runtime").JSX.Element;

package/lib/error-fallback.js

@@ -0,0 +1,19 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ErrorFallback = void 0;
+var _jsxRuntime = require("react/jsx-runtime");
+var ErrorFallback = exports.ErrorFallback = function ErrorFallback(_ref) {
+  var error = _ref.error;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: "fcr-pc-full-screen-error",
+    style: {
+      width: '100%',
+      height: '100%',
+      backgroundColor: 'transparent'
+    }
+  });
+};

package/lib/modules/Interpreter/action/delete-btn/index.d.ts

@@ -1,4 +1,4 @@
-import { InitInterpreterItemModelType } from '../../constant';
+import { InitInterpreterItemModelType } from '../../type';
 import './index.css';
 declare const _default: ({ model }: {
     model: InitInterpreterItemModelType;

package/lib/modules/Interpreter/action/edit-btn/index.d.ts

@@ -1,4 +1,3 @@
-import './index.css';
 interface EditBtnProps {
 }
 declare const _default: (props: EditBtnProps) => import("react/jsx-runtime").JSX.Element | null;

package/lib/modules/Interpreter/action/edit-btn/index.js

@@ -12,7 +12,6 @@ var _react = require("react");
 var _mobxReact = require("mobx-react");
 var _tooltipWrapper = _interopRequireDefault(require("../../tooltip-wrapper"));
 var _i18n = require("agora-ui-foundation/lib/i18n");
-require("./index.css");
 var _jsxRuntime = require("react/jsx-runtime");
 var EditBtn = function EditBtn(props) {
   var transI18n = (0, _i18n.useI18n)();
@@ -36,7 +35,6 @@ var EditBtn = function EditBtn(props) {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltipWrapper["default"], {
     disabled: disabled,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
-      className: "fcr-simultaneous-interpretation__footer-right-set-btn",
       shape: "rounded",
       type: interpreterUsersEditState ? undefined : 'secondary-bordered',
       size: "XS",

package/lib/modules/Interpreter/action/switch-btn/index.css

@@ -0,0 +1,3 @@
+.fcr-interpretation__footer-switch-btn {
+  margin-left: 8px;
+}

package/lib/modules/Interpreter/action/switch-btn/index.d.ts

@@ -1,5 +1,3 @@
-interface SwitchBtnProps {
-    className?: string;
-}
-declare const _default: (props: SwitchBtnProps) => import("react/jsx-runtime").JSX.Element | null;
+import './index.css';
+declare const _default: () => import("react/jsx-runtime").JSX.Element | null;
 export default _default;

package/lib/modules/Interpreter/action/switch-btn/index.js

@@ -12,9 +12,9 @@ var _react = require("react");
 var _mobxReact = require("mobx-react");
 var _tooltipWrapper = _interopRequireDefault(require("../../tooltip-wrapper"));
 var _i18n = require("agora-ui-foundation/lib/i18n");
+require("./index.css");
 var _jsxRuntime = require("react/jsx-runtime");
-var SwitchBtn = function SwitchBtn(props) {
-  var className = props.className;
+var SwitchBtn = function SwitchBtn() {
   var transI18n = (0, _i18n.useI18n)();
   var _useContext = (0, _react.useContext)(_store.StoreContext),
     openInterpreterState = _useContext.openInterpreterState,
@@ -39,7 +39,7 @@ var SwitchBtn = function SwitchBtn(props) {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltipWrapper["default"], {
     disabled: disabled,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
-      className: className,
+      className: "fcr-interpretation__footer-switch-btn",
       shape: "rounded",
       size: "XS",
       onClick: handleClick,

package/lib/modules/Interpreter/footer/index.css

@@ -2,9 +2,10 @@
   display: flex;
   justify-content: space-between;
   align-items: center;
-  position: fixed;
-  width: calc(100% - 40px);
   height: 56px;
-  bottom: 0;
   background: var(--fcr_mobile_ui_scene_color_popup_fill2);
+  position: absolute;
+  bottom: 0;
+  width: 100%;
+  padding: 0px 20px 0px;
 }

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

@@ -1,23 +1,8 @@
 import { UIModule } from '../../base';
-import { FcrUIEventStore } from '../../common/event-store';
-import { FcrInterpreterControl } from 'fcr-core/lib/room-control/interpreter-control/types';
-import { FcrMainRoomControl } from 'fcr-core/lib/room-control/type';
-import './index.css';
-import { FcrDeviceStore } from '../../common/device-store';
-import { FcrRoomStore } from '../../common/room-store';
-import { FcrDeviceStreamStore } from '../../common/device-stream-store';
-import { FcrSecurityStore } from '../../common/security-store';
+import { StoreConfig } from '../../type';
 export declare class InterpreterUIModule extends UIModule {
     private _store;
-    constructor({ roomControl, interpreterControl, uiEventStore, deviceStore, roomStore, deviceStreamStore, securityStore, }: {
-        uiEventStore: FcrUIEventStore;
-        roomControl: FcrMainRoomControl;
-        interpreterControl: FcrInterpreterControl;
-        deviceStore: FcrDeviceStore;
-        roomStore: FcrRoomStore;
-        deviceStreamStore: FcrDeviceStreamStore;
-        securityStore: FcrSecurityStore;
-    });
+    constructor(args: StoreConfig);
     getComponent(): import("react/jsx-runtime").JSX.Element;
     protected onUnload(): void;
 }

package/lib/modules/Interpreter/index.js

@@ -56,7 +56,6 @@ var _decorator = require("agora-foundation/lib/decorator");
 var _base = require("../../base");
 var _view = require("./view");
 var _store = _interopRequireWildcard(require("./store"));
-require("./index.css");
 var _jsxRuntime = require("react/jsx-runtime");
 var _InterpreterUIModule;
 var _initProto;
@@ -70,27 +69,12 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 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 InterpreterUIModule = exports.InterpreterUIModule = /*#__PURE__*/function (_UIModule) {
-  function InterpreterUIModule(_ref) {
+  function InterpreterUIModule(args) {
     var _this;
-    var roomControl = _ref.roomControl,
-      interpreterControl = _ref.interpreterControl,
-      uiEventStore = _ref.uiEventStore,
-      deviceStore = _ref.deviceStore,
-      roomStore = _ref.roomStore,
-      deviceStreamStore = _ref.deviceStreamStore,
-      securityStore = _ref.securityStore;
     (0, _classCallCheck2["default"])(this, InterpreterUIModule);
     _this = _callSuper(this, InterpreterUIModule);
     (0, _defineProperty2["default"])(_this, "_store", void _initProto(_this));
-    _this._store = new _store["default"]({
-      roomControl: roomControl,
-      interpreterControl: interpreterControl,
-      uiEventStore: uiEventStore,
-      deviceStore: deviceStore,
-      roomStore: roomStore,
-      deviceStreamStore: deviceStreamStore,
-      securityStore: securityStore
-    });
+    _this._store = new _store["default"](args);
     return _this;
   }
   (0, _inherits2["default"])(InterpreterUIModule, _UIModule);

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

@@ -1,4 +1,8 @@
 /* 设置滚动容器 */
 .fcr-simultaneous-interpretation__interpreter-list-container {
-  padding-bottom: 98px;
+  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,6 +1,7 @@
 import './index.css';
 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

@@ -28,11 +28,13 @@ 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(props) {
-  var isShowAddBtn = props.isShowAddBtn;
+  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",
+    ref: refDom,
     children: [isShowAddBtn && /*#__PURE__*/(0, _jsxRuntime.jsx)(_addBtn["default"], {
       position: _addBtn.PositionType.TOP
     }), localInterpreterUsers.map(function (ele, i) {

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

@@ -40,12 +40,6 @@
   margin-left: 3px;
 }
 
-.fcr-simultaneous-interpretation__pick-Language-container-icon {
-  /* width: 24px;
-  height: 24px;
-  padding: 4px; */
-}
-
 .fcr-simultaneous-interpretation__pick-Language-container .fcr-select__options {
   max-height: 100px;
   overflow-y: overlay;

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

@@ -1,6 +1,6 @@
 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;

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

@@ -3,9 +3,7 @@
   flex: 1;
   margin-right: 8px;
 }
-.fcr-simultaneous-interpretation__select-user .fcr-select.fcr-select--search .fcr-select__option {
-  /* padding: 4px 11px 4px 11px; */
-}
+
 .fcr-simultaneous-interpretation__select-user .fcr-select__options {
   max-height: 112px;
   overflow-y: overlay;

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 '../../../../constant';
+import { InitInterpreterItemModelType } from '../../../../type';
 import './index.css';
-type InterpreterItemPropertyKeys = keyof FcrInterpreterUserInfo;
-export type ObjectSatisfyingAnyInterpreterItemProperty = {
-    [K in InterpreterItemPropertyKeys]?: FcrInterpreterUserInfo[K];
-};
 interface PickUserProps {
     model: InitInterpreterItemModelType;
 }

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

@@ -15,6 +15,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 require("core-js/modules/es.array.filter.js");
 require("core-js/modules/es.array.find.js");
@@ -28,55 +29,21 @@ require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.filter.js");
 require("core-js/modules/esnext.iterator.find.js");
 require("core-js/modules/esnext.iterator.map.js");
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
 var _select = require("agora-ui-foundation/lib/components/select");
 var _store = require("../../../../store");
 var _mobxReact = require("mobx-react");
 var _type = require("fcr-core/lib/type");
-var _avatar = require("agora-ui-foundation/lib/components/avatar");
-var _classnames = _interopRequireDefault(require("classnames"));
 var _type2 = require("agora-rte-sdk/lib/core/scene/type");
 var _i18n = require("agora-ui-foundation/lib/i18n");
+var _optionItem = _interopRequireDefault(require("./option-Item"));
 require("./index.css");
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["randomKey"];
+var _excluded = ["randomKey", "userId"];
 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 = (0, _mobxReact.observer)(function (props) {
-  var model = props.model;
-  var transI18n = (0, _i18n.useI18n)();
-  var userRole = (0, _react.useMemo)(function () {
-    if (_type.FcrUserRole.HOST === model.userRole) {
-      return transI18n('fmt_interpretation_interpreter_popup_special_co_host');
-    }
-    if (_type.FcrUserRole.COHOST === model.userRole) {
-      return transI18n('fmt_interpretation_interpreter_popup_special_host');
-    }
-    return null;
-  }, [model.userRole]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: "fcr-simultaneous-interpretation__select-user-options-item",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: (0, _classnames["default"])('fcr-simultaneous-interpretation__select-user-options-item-avatar'),
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_avatar.FcrAvatar, {
-        size: 24,
-        nickName: model.userName,
-        textSize: 13
-      })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: "fcr-simultaneous-interpretation__select-user-options-item-user",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "fcr-simultaneous-interpretation__select-user-options-item-user-name",
-        children: model.userName
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "fcr-simultaneous-interpretation__select-user-options-item-user-role",
-        children: userRole && "(".concat(userRole, ")")
-      })]
-    })]
-  });
-});
 var PickUser = function PickUser(props) {
+  var _usersOptions$find;
   var model = props.model;
   var transI18n = (0, _i18n.useI18n)();
   var _useContext = (0, _react.useContext)(_store.StoreContext),
@@ -85,70 +52,77 @@ var PickUser = function PickUser(props) {
     interpreterUsersEditState = _useContext.interpreterUsersEditState,
     initUsers = _useContext.initUsers,
     localInterpreterUsers = _useContext.localInterpreterUsers;
-  var handleChange = function handleChange(data) {
-    updateInterpreterUsers(_objectSpread(_objectSpread({}, model), data));
-  };
-  var selectProps = (0, _react.useMemo)(function () {
-    var _usersOptions$find;
-    var selectedUserInfo = initUsers.find(function (user) {
-      return user.userId === model.userId;
-    });
+  var usersOptions = (0, _react.useMemo)(function () {
     var usersOptions = initUsers.filter(function (user) {
-      var notOffline = !user.isOffLine || user.isOffLine && model.userId === user.userId; //未离线 或者 离线且当前行选中状态
+      var isSelected = model.userId === user.userId;
+
+      //未离线 或者 离线且当前行选中状态
+      var notOffline = !user.isOffLine || user.isOffLine && isSelected;
+      // 当前用户选项 是否被使用过
       var usedUser = localInterpreterUsers.find(function (interpreter) {
         return interpreter.userId === user.userId;
-      }); // 当前用户选项 是否被使用过
-      var unused = !usedUser || usedUser && (usedUser === null || usedUser === void 0 ? void 0 : usedUser.userId) === model.userId; /// 未使用过  或者 使用过且当前行选中状态
-
+      });
+      // 未使用过  或者 使用过且当前行选中状态
+      var unused = !usedUser || usedUser && isSelected;
       return notOffline && unused;
-    }); // 离线 没有被选中
-
+    });
+    var selectedUserInfo = initUsers.find(function (user) {
+      return user.userId === model.userId;
+    });
     if (!selectedUserInfo && model.userId) {
       var randomKey = model.randomKey,
+        userId = model.userId,
         rest = (0, _objectWithoutProperties2["default"])(model, _excluded);
       usersOptions.push(_objectSpread(_objectSpread({}, rest), {}, {
+        userId: userId,
         userRole: _type.FcrUserRole.PARTICIPANT,
         connectorType: _type2.AgoraRteRoomConnectorType.NONE,
         isOffLine: true
       }));
     }
-    var isOffLine = (_usersOptions$find = usersOptions.find(function (user) {
-      return user.userId === model.userId;
-    })) === null || _usersOptions$find === void 0 ? void 0 : _usersOptions$find.isOffLine;
-    return {
-      isOffLine: isOffLine,
-      options: usersOptions.map(function (user) {
-        return {
-          text: user.userName,
-          value: user.userId,
-          render: function render(option) {
-            return /*#__PURE__*/(0, _jsxRuntime.jsx)(OptionItem, {
-              model: user
-            });
-          }
-        };
-      })
-    };
-  }, [initUsers, localInterpreterUsers, model]);
+    return usersOptions;
+  }, [initUsers, model, localInterpreterUsers]);
+  var options = (0, _react.useMemo)(function () {
+    return usersOptions.map(function (user) {
+      var isSelected = model.userId === user.userId;
+      return {
+        text: user.userName,
+        value: user.userId,
+        render: function render(option) {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_optionItem["default"], {
+            model: user,
+            isSelected: isSelected
+          });
+        }
+      };
+    });
+  }, [usersOptions, model]);
+  var isOffLine = (_usersOptions$find = usersOptions.find(function (user) {
+    return user.userId === model.userId;
+  })) === null || _usersOptions$find === void 0 ? void 0 : _usersOptions$find.isOffLine;
+  var tag = isOffLine ? transI18n('fmt_interpretation_setting_popup_controller_label_departure') : '';
+  var onChange = function onChange(value) {
+    var checkedItem = options.find(function (option) {
+      return option.value === value;
+    });
+    if (checkedItem) {
+      var interpreterUsers = _objectSpread(_objectSpread({}, model), {}, {
+        userId: checkedItem.value,
+        userName: checkedItem.text
+      });
+      updateInterpreterUsers(interpreterUsers);
+    }
+  };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_select.FcrSelect, {
     className: "fcr-simultaneous-interpretation__select-user",
     showSearch: true,
-    options: selectProps.options,
+    options: options,
     value: model.userId,
-    onChange: function onChange(value) {
-      var _selectProps$options$;
-      var userName = (_selectProps$options$ = selectProps.options.find(function (option) {
-        return option.value === value;
-      })) === null || _selectProps$options$ === void 0 ? void 0 : _selectProps$options$.text;
-      handleChange({
-        userId: value,
-        userName: userName
-      });
-    },
+    onChange: onChange,
     disabled: !interpreterUsersEditState && interpreterState,
     placeholder: transI18n('fmt_interpretation_setting_popup_controller_labe_search_name'),
     styleType: "white",
-    tag: selectProps.isOffLine ? transI18n('fmt_interpretation_setting_popup_controller_label_departure') : ''
+    tag: tag
   });
 };
 var _default = exports["default"] = (0, _mobxReact.observer)(PickUser);

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

@@ -0,0 +1,6 @@
+import { FcrUserInfo } from 'fcr-core/lib/type';
+declare const OptionItem: (props: {
+    model: FcrUserInfo;
+    isSelected: boolean;
+}) => import("react/jsx-runtime").JSX.Element;
+export default OptionItem;

package/lib/modules/Interpreter/interpreter-list/interpreter-item/components/pick-user/option-Item.js

@@ -0,0 +1,58 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _avatar = require("agora-ui-foundation/lib/components/avatar");
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _i18n = require("agora-ui-foundation/lib/i18n");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _fcrCore = require("fcr-core");
+var _mobxReact = require("mobx-react");
+var _react = require("react");
+var _jsxRuntime = require("react/jsx-runtime");
+var OptionItem = (0, _mobxReact.observer)(function (props) {
+  var model = props.model,
+    isSelected = props.isSelected;
+  var transI18n = (0, _i18n.useI18n)();
+  var userRole = (0, _react.useMemo)(function () {
+    if (_fcrCore.FcrUserRole.HOST === model.userRole) {
+      return transI18n('fmt_interpretation_interpreter_popup_special_co_host');
+    }
+    if (_fcrCore.FcrUserRole.COHOST === model.userRole) {
+      return transI18n('fmt_interpretation_interpreter_popup_special_host');
+    }
+    return null;
+  }, [model.userRole]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "fcr-simultaneous-interpretation__select-user-options-item",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classnames["default"])('fcr-simultaneous-interpretation__select-user-options-item-avatar'),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_avatar.FcrAvatar, {
+        size: 24,
+        nickName: model.userName,
+        textSize: 13
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "fcr-simultaneous-interpretation__select-user-options-item-user",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "fcr-simultaneous-interpretation__select-user-options-item-user-name",
+        children: model.userName
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "fcr-simultaneous-interpretation__select-user-options-item-user-role",
+        children: userRole && "(".concat(userRole, ")")
+      })]
+    }), isSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+      type: _type.FcrIconType.FCR_CHOOSEIT,
+      size: 24,
+      colors: {
+        iconPrimary: 'var(--fcr_web_ui_scene_mainicon1)'
+      }
+    })]
+  });
+});
+var _default = exports["default"] = OptionItem;

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

@@ -1,4 +1,4 @@
-import { InitInterpreterItemModelType } from '../../constant';
+import { InitInterpreterItemModelType } from '../../type';
 import './index.css';
 interface InterpreterItemProps {
     model: InitInterpreterItemModelType;