fcr-ui-scene 3.4.2 → 3.4.3

package/lib/modules/layout/member-window/index.js

@@ -11,7 +11,6 @@ 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");
@@ -23,10 +22,19 @@ exports.MemberWindowActions = exports.MemberWindow = exports.MemberBoard = expor
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+require("core-js/modules/es.array.find.js");
+require("core-js/modules/es.array.includes.js");
 require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.array.some.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/es.set.js");
+require("core-js/modules/es.string.includes.js");
 require("core-js/modules/es.string.iterator.js");
+require("core-js/modules/esnext.async-iterator.find.js");
+require("core-js/modules/esnext.async-iterator.some.js");
+require("core-js/modules/esnext.iterator.constructor.js");
+require("core-js/modules/esnext.iterator.find.js");
+require("core-js/modules/esnext.iterator.some.js");
 require("core-js/modules/esnext.set.add-all.js");
 require("core-js/modules/esnext.set.delete-all.js");
 require("core-js/modules/esnext.set.difference.v2.js");
@@ -62,12 +70,11 @@ var _type = require("agora-ui-foundation/lib/components/icon/type");
 var _popover = require("agora-ui-foundation/lib/components/popover");
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
 var _i18n = require("agora-ui-foundation/lib/i18n");
-var _type2 = require("agora-edu-core/lib/type");
+var _type2 = require("fcr-core/lib/type");
 var _hooks = require("../../../utilities/hooks");
-var _participantsMoreAction = require("../../participant/attendee/participants-more-action");
 var _type3 = require("../type");
 require("./index.css");
-var _context = require("../context");
+var _store = require("../store");
 var _localVideoPlayer = require("agora-ui-foundation/lib/components/local-video-player");
 var _iconPhoneCall = require("agora-ui-foundation/lib/components/icon-phone-call");
 var _videoTrackRenderContext = require("../../../utilities/video-track-render-context");
@@ -75,7 +82,8 @@ var _dialogs = require("../../dialog/dialogs");
 var _constant = require("../../../utilities/constant");
 var _type4 = require("../../video-window/type");
 var _env = require("agora-foundation/lib/utilities/env");
-var _agoraEduCore = require("agora-edu-core");
+var _fcrCore = require("fcr-core");
+var _participantsMore = require("agora-ui-foundation/lib/components/participants/participants-more");
 var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["isLocal"];
 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; }
@@ -85,7 +93,7 @@ var MaxAvatarSize = 175;
 var AvatarSizeRatio = 0.2445;
 var AvatarTextSizeRatio = 0.32;
 var HideControlsTimeout = 3000;
-var meetingConnectorTypes = new Set([_agoraEduCore.FcrRoomConnectorType.SIP, _agoraEduCore.FcrRoomConnectorType.H323]);
+var meetingConnectorTypes = new Set([_fcrCore.FcrRoomConnectorType.SIP, _fcrCore.FcrRoomConnectorType.H323]);
 var clamp = function clamp(val, min, max) {
   return val < min ? min : val > max ? max : val;
 };
@@ -112,10 +120,11 @@ var MemberWindow = exports.MemberWindow = (0, _mobxReact.observer)(function (_re
     hasVideoStream = windowData.hasVideoStream,
     windowId = windowData.windowId,
     audioStreamConnectorType = windowData.audioStreamConnectorType,
-    videoStreamConnectorType = windowData.videoStreamConnectorType;
+    videoStreamConnectorType = windowData.videoStreamConnectorType,
+    hasScreenSharing = windowData.hasScreenSharing;
   var t = (0, _i18n.useI18n)();
-  var connectorType = audioStreamConnectorType !== _agoraEduCore.FcrRoomConnectorType.NONE ? audioStreamConnectorType : videoStreamConnectorType;
-  var isPhone = audioStreamConnectorType === _agoraEduCore.FcrRoomConnectorType.PSTN;
+  var connectorType = audioStreamConnectorType !== _fcrCore.FcrRoomConnectorType.NONE ? audioStreamConnectorType : videoStreamConnectorType;
+  var isPhone = audioStreamConnectorType === _fcrCore.FcrRoomConnectorType.PSTN;
   var isPhoneOnlyAudio = isPhone && !videoStreamId;
   var isMeeting = meetingConnectorTypes.has(connectorType);
   var suffixedName = userName + (isMySelf ? t('fmt_attendies_labels_setting_mine') : '');
@@ -181,7 +190,8 @@ var MemberWindow = exports.MemberWindow = (0, _mobxReact.observer)(function (_re
       streamId: windowId,
       videoStreamType: videoStreamType,
       renderMode: videoRenderMode,
-      hasVideoStream: hasVideoStream
+      hasVideoStream: hasVideoStream,
+      hasScreenSharing: hasScreenSharing
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: (0, _classnames["default"])("fcr-member-window-excitation", {
         'fcr-member-window-excitation-show': canShowSpeakerSpotlight && isSpeakerSpotlight
@@ -210,7 +220,7 @@ var MemberWindow = exports.MemberWindow = (0, _mobxReact.observer)(function (_re
 var MicVolume = (0, _mobxReact.observer)(function (_ref2) {
   var id = _ref2.id,
     size = _ref2.size;
-  var _useContext = (0, _react.useContext)(_context.StoreContext),
+  var _useContext = (0, _react.useContext)(_store.StoreContext),
     userVolumeMap = _useContext.userVolumeMap;
   var volume = userVolumeMap.get(id || '') || 0;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -242,7 +252,11 @@ var MemberWindowActions = exports.MemberWindowActions = (0, _mobxReact.observer)
     videoWindowCurrentHeight = _ref3.videoWindowCurrentHeight,
     videoWindowPreviewType = _ref3.videoWindowPreviewType,
     _ref3$showRotation = _ref3.showRotation,
-    showRotation = _ref3$showRotation === void 0 ? true : _ref3$showRotation;
+    showRotation = _ref3$showRotation === void 0 ? true : _ref3$showRotation,
+    interpreterUsers = _ref3.interpreterUsers,
+    interpreterState = _ref3.interpreterState,
+    handleRename = _ref3.handleRename,
+    renderListLength = _ref3.renderListLength;
   // iconsize gallery 24 normal 16
   var _ref4 = windowData || {},
     videoStreamId = _ref4.videoStreamId,
@@ -259,6 +273,13 @@ var MemberWindowActions = exports.MemberWindowActions = (0, _mobxReact.observer)
     videoStreamConnectorType = _ref4.videoStreamConnectorType,
     _ref4$phoneMicEnabled = _ref4.phoneMicEnabled,
     phoneMicEnabled = _ref4$phoneMicEnabled === void 0 ? false : _ref4$phoneMicEnabled;
+  var interpreter = (0, _react.useMemo)(function () {
+    return !!(interpreterUsers !== null && interpreterUsers !== void 0 && interpreterUsers.find(function (ele) {
+      return ele.userId === userId;
+    }));
+  }, [interpreterUsers, userId]);
+  var insideShow = ![_type2.FcrUserRole.COHOST, _type2.FcrUserRole.HOST].includes(ownerRoleType);
+  var timerRef = (0, _react.useRef)();
   var t = (0, _i18n.useI18n)();
   var focus = (0, _hooks.useWindowFocus)();
   var _useState = (0, _react.useState)(false),
@@ -269,11 +290,12 @@ var MemberWindowActions = exports.MemberWindowActions = (0, _mobxReact.observer)
     _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
     isShowDropMenu = _useState4[0],
     setIsShowDropMenu = _useState4[1];
-  var connectorType = audioStreamConnectorType !== _agoraEduCore.FcrRoomConnectorType.NONE ? audioStreamConnectorType : videoStreamConnectorType;
-  var isNormal = connectorType === _agoraEduCore.FcrRoomConnectorType.NONE;
-  var isPhone = connectorType === _agoraEduCore.FcrRoomConnectorType.PSTN;
+  var connectorType = audioStreamConnectorType !== _fcrCore.FcrRoomConnectorType.NONE ? audioStreamConnectorType : videoStreamConnectorType;
+  var isNormal = connectorType === _fcrCore.FcrRoomConnectorType.NONE;
+  var isPhone = connectorType === _fcrCore.FcrRoomConnectorType.PSTN;
   var isMeeting = meetingConnectorTypes.has(connectorType);
-  var userType = audioStreamConnectorType === _agoraEduCore.FcrRoomConnectorType.PSTN && !videoStreamId ? 'phone' : isMeeting ? 'meeting-system' : 'normal';
+  var userType = audioStreamConnectorType === _fcrCore.FcrRoomConnectorType.PSTN && !videoStreamId ? 'phone' : isMeeting ? 'meeting-system' : 'normal';
+  var isShowInterpreterTag = interpreter && interpreterState;
   var isManager = ownerRoleType === _type2.FcrUserRole.HOST || ownerRoleType === _type2.FcrUserRole.COHOST;
   var handleVideoWindowVisibleChange = function handleVideoWindowVisibleChange(width, height, setResizable) {
     var videoWindowBrower = _dialogs.dialogWindows.get(_constant.DialogKey.VIDEO_WINDOW);
@@ -295,12 +317,17 @@ var MemberWindowActions = exports.MemberWindowActions = (0, _mobxReact.observer)
       onVisibleChanged === null || onVisibleChanged === void 0 || onVisibleChanged(visible);
     } else {
       setIsShowDropMenu(visible);
-      setTimeout(function () {
+      timerRef.current = setTimeout(function () {
         handleVideoWindowVisibleChange(videoWindowCurrentWidth, videoWindowCurrentHeight, true);
         onVisibleChanged === null || onVisibleChanged === void 0 || onVisibleChanged(visible);
       }, 100);
     }
   };
+  (0, _react.useEffect)(function () {
+    return function () {
+      clearTimeout(timerRef.current);
+    };
+  }, [videoWindowPreviewType]);
   (0, _react.useEffect)(function () {
     if (!isOnlyShowVideoStream && !focus) {
       var timer = setTimeout(function () {
@@ -507,6 +534,21 @@ var MemberWindowActions = exports.MemberWindowActions = (0, _mobxReact.observer)
       });
     }
   }
+  var interpreterTagDom = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+    children: t('fmt_ai_transcriptions_setting_label_translator')
+  });
+  var InterpreterTag = function InterpreterTag(props) {
+    var className = props.className,
+      _props$isShow = props.isShow,
+      isShow = _props$isShow === void 0 ? true : _props$isShow;
+    if (!isShow) {
+      return null;
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classnames["default"])('fcr-user-window-actions-tag', 'fcr-user-window-actions-tag-host', className),
+      children: interpreterTagDom
+    });
+  };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: (0, _classnames["default"])('fcr-user-window-actions', {
       'fcr-user-window-actions-hide': isOnlyShowVideoStream
@@ -515,97 +557,133 @@ var MemberWindowActions = exports.MemberWindowActions = (0, _mobxReact.observer)
       e.preventDefault();
       setIsShowDropMenu(true);
     },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    children: [isManager && /*#__PURE__*/(0, _jsxRuntime.jsx)(InterpreterTag, {
+      isShow: isShowInterpreterTag,
+      className: (0, _classnames["default"])('fcr-user-window-actions-bottom', 'fcr-user-window-actions-middle', {
+        'fcr-user-window-actions-bottom-show': showActionBottomLabel,
+        'fcr-user-window-actions-tag_large': windowSize === 'large'
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: (0, _classnames["default"])('fcr-user-window-actions-bottom', {
         'fcr-user-window-actions-bottom-show': showActionBottomLabel
       }),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: (0, _classnames["default"])('fcr-member-window-members-sharebtn', {
-          'fcr-member-window-members-sharebtn-show': hasScreenSharing
-        }),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-          type: _type.FcrIconType.FCR_MOBILE_SHARESCREEN,
-          size: 18
-        })
-      }), windowSize === 'large' ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: (0, _classnames["default"])('fcr-user-window-actions-tag', {
-          'fcr-user-window-actions-tag-host': isManager,
-          'fcr-user-window-actions-tag-cohost': ownerRoleType === _type2.FcrUserRole.COHOST
-        }),
-        children: [icon, ownerRoleType === _type2.FcrUserRole.HOST && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: t('fmt_role_host')
-        }), ownerRoleType === _type2.FcrUserRole.COHOST && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: t('fmt_role_cohost')
-        })]
-      }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-        children: [isManager && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: (0, _classnames["default"])('fcr-user-window-actions-tag', {
-            'fcr-user-window-actions-tag-host': isManager,
-            'fcr-user-window-actions-tag-cohost': ownerRoleType === _type2.FcrUserRole.COHOST
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: (0, _classnames["default"])('fcr-user-window-actions-bottom-layout'),
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: (0, _classnames["default"])('fcr-member-window-members-sharebtn', {
+            'fcr-member-window-members-sharebtn-show': hasScreenSharing
           }),
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            children: t(ownerRoleType === _type2.FcrUserRole.HOST ? 'fmt_role_host' : 'fmt_role_cohost')
-          })
-        }), !hasMicrophoneAudioStream ? isMeeting ? /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-          className: "fcr-user-window-actions-microphone",
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-            type: _type.FcrIconType.FCR_SIPDEVICE,
-            size: iconSize,
+            type: _type.FcrIconType.FCR_MOBILE_SHARESCREEN,
             colors: {
-              iconPrimary: 'var(--fcr_ui_scene_white10)',
-              iconSecondary: 'var(--fcr_ui_scene_ramp_green6)'
-            }
+              iconPrimary: 'var(--fcr_ui_scene_white10)'
+            },
+            size: 18
           })
-        }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
-          content: t('fmt_device_label_audio_mute'),
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-            className: "fcr-user-window-actions-microphone",
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "fcr-user-window-actions-bottom-layout-info",
+          children: [windowSize === 'large' ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            className: (0, _classnames["default"])('fcr-user-window-actions-tag', {
+              'fcr-user-window-actions-tag-host': isManager || isShowInterpreterTag,
+              'fcr-user-window-actions-tag-cohost': ownerRoleType === _type2.FcrUserRole.COHOST
+            }),
+            children: [icon, ownerRoleType === _type2.FcrUserRole.HOST && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+              children: t('fmt_role_host')
+            }), ownerRoleType === _type2.FcrUserRole.COHOST && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+              children: t('fmt_role_cohost')
+            }), insideShow && isShowInterpreterTag && interpreterTagDom]
+          }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+            children: [isManager ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: (0, _classnames["default"])('fcr-user-window-actions-tag', {
+                'fcr-user-window-actions-tag-host': isManager || isShowInterpreterTag,
+                'fcr-user-window-actions-tag-cohost': ownerRoleType === _type2.FcrUserRole.COHOST
+              }),
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                children: t(ownerRoleType === _type2.FcrUserRole.HOST ? 'fmt_role_host' : 'fmt_role_cohost')
+              })
+            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(InterpreterTag, {
+              isShow: isShowInterpreterTag,
+              className: "fcr-user-window-actions-tag"
+            }), !hasMicrophoneAudioStream ? isMeeting ? /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+              className: "fcr-user-window-actions-microphone",
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+                type: _type.FcrIconType.FCR_SIPDEVICE,
+                size: iconSize,
+                colors: {
+                  iconPrimary: 'var(--fcr_ui_scene_white10)',
+                  iconSecondary: 'var(--fcr_ui_scene_ramp_green6)'
+                }
+              })
+            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+              content: t('fmt_device_label_audio_mute'),
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+                className: "fcr-user-window-actions-microphone",
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+                  type: _type.FcrIconType.FCR_NOMUTE,
+                  size: iconSize,
+                  colors: {
+                    iconPrimary: 'var(--fcr_ui_scene_ramp_red6)',
+                    iconSecondary: 'var(--fcr_ui_scene_ramp_red6)'
+                  }
+                })
+              })
+            }) : isPhone ? /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+              className: "fcr-user-window-actions-microphone",
+              style: {
+                backgroundColor: 'var(--fcr_ui_scene_ramp_lightgreen6)'
+              },
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+                type: _type.FcrIconType.FCR_PHONECALL3,
+                size: iconSize,
+                colors: {
+                  iconPrimary: 'var(--fcr_ui_scene_white10)'
+                }
+              })
+            }) : isMeeting ? /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
+              className: "fcr-user-window-actions-microphone",
+              style: {
+                backgroundColor: 'var(--fcr_ui_scene_ramp_purple7)'
+              },
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+                type: _type.FcrIconType.FCR_SIPDEVICE,
+                size: iconSize,
+                colors: {
+                  iconPrimary: 'var(--fcr_ui_scene_white10)',
+                  iconSecondary: 'var(--fcr_ui_scene_ramp_green6)'
+                }
+              })
+            }) : null]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "fcr-user-window-actions-name",
+            children: suffixedName
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "fcr-user-window-actions-name-isme",
+            children: isMeTag
+          }), isMeTag && allowedOperations.some(function (item) {
+            return item === 'change_name';
+          }) && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            className: "fcr-user-window-actions-name-rename",
             children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-              type: _type.FcrIconType.FCR_NOMUTE,
-              size: iconSize,
+              onClick: handleRename,
+              type: _type.FcrIconType.FCR_RENAME,
               colors: {
-                iconPrimary: 'var(--fcr_ui_scene_ramp_red6)',
-                iconSecondary: 'var(--fcr_ui_scene_ramp_red6)'
+                iconPrimary: 'var(--fcr_ui_scene_icontext1)'
               }
             })
-          })
-        }) : isPhone ? /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-          className: "fcr-user-window-actions-microphone",
-          style: {
-            backgroundColor: 'var(--fcr_ui_scene_ramp_lightgreen6)'
-          },
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-            type: _type.FcrIconType.FCR_PHONECALL3,
-            size: iconSize,
-            colors: {
-              iconPrimary: 'var(--fcr_ui_scene_white10)'
-            }
-          })
-        }) : isMeeting ? /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-          className: "fcr-user-window-actions-microphone",
-          style: {
-            backgroundColor: 'var(--fcr_ui_scene_ramp_purple7)'
-          },
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
-            type: _type.FcrIconType.FCR_SIPDEVICE,
-            size: iconSize,
-            colors: {
-              iconPrimary: 'var(--fcr_ui_scene_white10)',
-              iconSecondary: 'var(--fcr_ui_scene_ramp_green6)'
-            }
-          })
-        }) : null]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: "fcr-user-window-actions-name",
-        children: suffixedName
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-        className: "fcr-user-window-actions-name-isme",
-        children: isMeTag
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-        className: "fcr-user-window-actions-name-doing",
-        children: [windowData.type === _type3.FcrUIWindowType.BOARD ? t('fmt_screenshare_whiteboard_tips_someonesharing', {
-          reason1: ''
-        }) : '', hasScreenSharing && windowData.type === _type3.FcrUIWindowType.VIDEO ? t('fmt_screenshare_status_sharing') : '']
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+            className: "fcr-user-window-actions-name-doing",
+            children: [windowData.type === _type3.FcrUIWindowType.BOARD ? t('fmt_screenshare_whiteboard_tips_someonesharing', {
+              reason1: ''
+            }) : '', hasScreenSharing && windowData.type === _type3.FcrUIWindowType.VIDEO ? t('fmt_screenshare_status_sharing') : '']
+          })]
+        })]
+      }), !insideShow && !isManager && /*#__PURE__*/(0, _jsxRuntime.jsx)(InterpreterTag, {
+        isShow: isShowInterpreterTag,
+        className: "fcr-user-window-actions-bottom-interpreter-tag"
+      }), windowSize === 'large' && windowData.isMySelf && hasVideoStream && showRotation && renderListLength === 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_localVideoPlayer.VideoOrientation, {
+        setVideoOrientation: function setVideoOrientation() {
+          _setVideoOrientation();
+        }
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: (0, _classnames["default"])('fcr-user-window-actions-top', {
@@ -619,7 +697,7 @@ var MemberWindowActions = exports.MemberWindowActions = (0, _mobxReact.observer)
           trigger: "click",
           visible: isShowDropMenu,
           onVisibleChange: onVisibleChange,
-          content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_participantsMoreAction.ParticipantsMoreActions, {
+          content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_participantsMore.FcrParticipantsMoreActions, {
             userType: userType,
             hasPinnedStream: hasPinnedStream,
             audioDeviceType: isPhone ? 'phone-mic' : 'computer-mic',
@@ -661,10 +739,6 @@ var MemberWindowActions = exports.MemberWindowActions = (0, _mobxReact.observer)
         },
         children: t(actionAudioTag)
       })]
-    }), windowData.isMySelf && hasVideoStream && showRotation && /*#__PURE__*/(0, _jsxRuntime.jsx)(_localVideoPlayer.VideoOrientation, {
-      setVideoOrientation: function setVideoOrientation() {
-        _setVideoOrientation();
-      }
     })]
   });
 });
@@ -677,14 +751,17 @@ var MemberBoard = exports.MemberBoard = (0, _mobxReact.observer)(function (_ref5
     showActionBottomLabel = _ref5.showActionBottomLabel,
     isShowActionAudio = _ref5.isShowActionAudio,
     actionAudioTag = _ref5.actionAudioTag;
-  var _useContext2 = (0, _react.useContext)(_context.StoreContext),
+  var _useContext2 = (0, _react.useContext)(_store.StoreContext),
     hasPinnedStream = _useContext2.hasPinnedStream,
     localUserRole = _useContext2.localUserRole,
     sendParticipantEvent = _useContext2.sendParticipantEvent,
     muteAudio = _useContext2.muteAudio,
     hasMutePermission = _useContext2.hasMutePermission,
     openPrivateChat = _useContext2.openPrivateChat,
-    setVideoOrientation = _useContext2.setVideoOrientation;
+    setVideoOrientation = _useContext2.setVideoOrientation,
+    interpreterUsers = _useContext2.interpreterUsers,
+    interpreterState = _useContext2.interpreterState,
+    openRenameDialog = _useContext2.openRenameDialog;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: (0, _classnames["default"])("fcr-member-board"),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -706,7 +783,10 @@ var MemberBoard = exports.MemberBoard = (0, _mobxReact.observer)(function (_ref5
       windowSize: "large",
       windowData: windowData,
       iconSize: 24,
-      showRotation: (0, _env.isElectron)()
+      showRotation: (0, _env.isElectron)(),
+      interpreterUsers: interpreterUsers,
+      interpreterState: interpreterState,
+      handleRename: openRenameDialog
     }), slot]
   });
 });
@@ -743,28 +823,59 @@ var FcrUIRemoteVideoPlayer = exports.FcrUIRemoteVideoPlayer = (0, _mobxReact.obs
   var streamId = _ref7.streamId,
     hasVideoStream = _ref7.hasVideoStream,
     videoStreamType = _ref7.videoStreamType,
-    renderMode = _ref7.renderMode;
+    renderMode = _ref7.renderMode,
+    hasScreenSharing = _ref7.hasScreenSharing;
   var divRef = (0, _react.useRef)(null);
   var context = (0, _react.useContext)(_videoTrackRenderContext.FcrVideoTrackRenderContext);
+  var t = (0, _i18n.useI18n)();
   var _ref8 = context.streamControl || {},
     startRenderRemoteVideoStream = _ref8.startRenderRemoteVideoStream,
-    stopRenderRemoteVideoStream = _ref8.stopRenderRemoteVideoStream;
+    stopRenderRemoteVideoStream = _ref8.stopRenderRemoteVideoStream,
+    addObserver = _ref8.addObserver,
+    removeObserver = _ref8.removeObserver;
+  var _useState5 = (0, _react.useState)(false),
+    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+    isFirstRemoteVideoFrameRendered = _useState6[0],
+    setIsFirstRemoteVideoFrameRendered = _useState6[1];
   (0, _react.useEffect)(function () {
     var dom = divRef.current;
+    var observer = {
+      onFirstRemoteVideoFrameRendered: function onFirstRemoteVideoFrameRendered(roomId, renderStreamId, dimensions) {
+        if (streamId === renderStreamId) {
+          setIsFirstRemoteVideoFrameRendered(true);
+        }
+      }
+    };
     if (dom) {
       if (hasVideoStream) {
         startRenderRemoteVideoStream === null || startRenderRemoteVideoStream === void 0 || startRenderRemoteVideoStream(streamId, videoStreamType, {
           renderMode: renderMode,
           isMirror: false
         }, dom);
+        addObserver && addObserver(observer);
       }
     }
     return function () {
+      removeObserver && removeObserver(observer);
+      setIsFirstRemoteVideoFrameRendered(false);
       dom && (stopRenderRemoteVideoStream === null || stopRenderRemoteVideoStream === void 0 ? void 0 : stopRenderRemoteVideoStream(streamId, dom));
     };
   }, [hasVideoStream, streamId, videoStreamType, renderMode, startRenderRemoteVideoStream, stopRenderRemoteVideoStream]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: "fcr-member-window-body",
-    ref: divRef
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classnames["default"])('fcr-member-window-body fcr-member-window-body-video-remote', {
+        'fcr-member-window-body-video-remote-render': isFirstRemoteVideoFrameRendered && hasVideoStream
+      }),
+      ref: divRef
+    }), !isFirstRemoteVideoFrameRendered && hasVideoStream && hasScreenSharing && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: "fcr-member-window-body-render-video-loading",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+        className: "render-video-loading-icon",
+        size: 24,
+        type: _type.FcrIconType.FCR_LOADING
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+        children: [" ", t('fmt_screenshare_status_sharing'), " "]
+      })]
+    })]
   });
 });

package/lib/modules/layout/store.js

@@ -33,9 +33,6 @@ require("core-js/modules/es.object.values.js");
 require("core-js/modules/es.set.js");
 require("core-js/modules/es.string.iterator.js");
 require("core-js/modules/es.weak-map.js");
-require("core-js/modules/esnext.async-iterator.find.js");
-require("core-js/modules/esnext.async-iterator.for-each.js");
-require("core-js/modules/esnext.async-iterator.some.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.find.js");
 require("core-js/modules/esnext.iterator.for-each.js");

package/lib/modules/layout/type.js

@@ -6,7 +6,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.VideoRatio = exports.GalleryMaxSize = exports.FcrUIWindowType = exports.FcrUIVideoWindowMainSortingPriority = exports.FcrUIVideoWindowLayoutType = exports.FcrUIVideoWindowFoldSortingPriority = void 0;
 var FcrUIVideoWindowLayoutType = exports.FcrUIVideoWindowLayoutType = /*#__PURE__*/function (FcrUIVideoWindowLayoutType) {
+  /** Show a carousel on top and a big video on the rest of the screen. */
   FcrUIVideoWindowLayoutType["Speaker"] = "speaker";
+  /** Show videos in grid, filling the screen. */
   FcrUIVideoWindowLayoutType["Gallery"] = "gallery";
   return FcrUIVideoWindowLayoutType;
 }({});

package/lib/modules/layout/video-window-datasource.js

@@ -45,10 +45,6 @@ require("core-js/modules/es.object.assign.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.filter.js");
-require("core-js/modules/esnext.async-iterator.find.js");
-require("core-js/modules/esnext.async-iterator.for-each.js");
-require("core-js/modules/esnext.async-iterator.some.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.filter.js");
 require("core-js/modules/esnext.iterator.find.js");

package/lib/modules/live-streaming/store.js

@@ -43,7 +43,6 @@ 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.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.for-each.js");
 require("core-js/modules/esnext.weak-map.delete-all.js");

package/lib/modules/notification/interpreter-status/index.js

@@ -8,7 +8,8 @@ exports.InterpreterStatus = void 0;
 require("core-js/modules/es.array.concat.js");
 require("core-js/modules/es.array.join.js");
 require("core-js/modules/es.array.map.js");
-require("core-js/modules/esnext.async-iterator.map.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.map.js");
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");

package/lib/modules/offscreen-pulling/index.js

@@ -15,7 +15,6 @@ require("core-js/modules/es.map.js");
 require("core-js/modules/es.object.to-string.js");
 require("core-js/modules/es.parse-int.js");
 require("core-js/modules/es.string.iterator.js");
-require("core-js/modules/esnext.async-iterator.for-each.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.for-each.js");
 require("core-js/modules/esnext.map.delete-all.js");

package/lib/modules/participant/attendee/index.js

@@ -9,8 +9,6 @@ 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.filter.js");
 require("core-js/modules/esnext.iterator.for-each.js");
 require("core-js/modules/web.dom-collections.for-each.js");
@@ -21,7 +19,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.ParticipantAttendee = exports.OperateWaitingRoomMemberDialog = void 0;
 require("core-js/modules/es.array.find.js");
 require("core-js/modules/es.object.to-string.js");
-require("core-js/modules/esnext.async-iterator.find.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.find.js");
 require("core-js/modules/web.timers.js");

package/lib/modules/participant/components/attendee/index.js

@@ -9,8 +9,6 @@ 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.filter.js");
 require("core-js/modules/esnext.iterator.for-each.js");
 require("core-js/modules/web.dom-collections.for-each.js");
@@ -21,7 +19,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.ParticipantAttendee = void 0;
 require("core-js/modules/es.array.find.js");
 require("core-js/modules/es.object.to-string.js");
-require("core-js/modules/esnext.async-iterator.find.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.find.js");
 require("core-js/modules/web.timers.js");

package/lib/modules/participant/components/drop-menu/index.js

@@ -8,7 +8,6 @@ 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.for-each.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");
@@ -21,8 +20,6 @@ require("core-js/modules/es.array.filter.js");
 require("core-js/modules/es.array.map.js");
 require("core-js/modules/es.array.unshift.js");
 require("core-js/modules/es.object.to-string.js");
-require("core-js/modules/esnext.async-iterator.filter.js");
-require("core-js/modules/esnext.async-iterator.map.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.filter.js");
 require("core-js/modules/esnext.iterator.map.js");

package/lib/modules/participant/components/participants/index.js

@@ -8,7 +8,6 @@ Object.defineProperty(exports, "__esModule", {
 exports["default"] = void 0;
 require("core-js/modules/es.array.find.js");
 require("core-js/modules/es.object.to-string.js");
-require("core-js/modules/esnext.async-iterator.find.js");
 require("core-js/modules/esnext.iterator.constructor.js");
 require("core-js/modules/esnext.iterator.find.js");
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));