fcr-ui-scene 3.4.2 → 3.4.4

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,138 @@ 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,
+            'fcr-member-window-members-sharebtn-large': windowSize === 'large'
           }),
-          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: windowSize === 'large' ? 24 : 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: (0, _classnames["default"])('fcr-user-window-actions-name', {
+              'ml-5': isManager || isShowInterpreterTag
+            }),
+            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: function onClick() {
+                return handleRename(userId);
+              },
+              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 +702,17 @@ var MemberWindowActions = exports.MemberWindowActions = (0, _mobxReact.observer)
           trigger: "click",
           visible: isShowDropMenu,
           onVisibleChange: onVisibleChange,
-          content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_participantsMoreAction.ParticipantsMoreActions, {
+          overlayInnerStyle: {
+            border: 0,
+            boxShadow: '0px 0px 15px var(--fcr_web_light_dropup_m)',
+            borderRadius: 'var(--fcr_cornerradius_l)',
+            minWidth: '210px',
+            maxWidth: '300px',
+            width: 'fit-content'
+          },
+          overlayClassName: "member-window-actions__more-actions",
+          mouseEnterDelay: 0,
+          content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_participantsMore.FcrParticipantsMoreActions, {
             userType: userType,
             hasPinnedStream: hasPinnedStream,
             audioDeviceType: isPhone ? 'phone-mic' : 'computer-mic',
@@ -661,10 +754,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 +766,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 +798,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]
   });
 });
@@ -740,31 +835,48 @@ var FcrUILocalVideoPlayer = exports.FcrUILocalVideoPlayer = (0, _mobxReact.obser
   });
 });
 var FcrUIRemoteVideoPlayer = exports.FcrUIRemoteVideoPlayer = (0, _mobxReact.observer)(function (_ref7) {
+  var _context$remoteVideoR;
   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 _ref8 = context.streamControl || {},
-    startRenderRemoteVideoStream = _ref8.startRenderRemoteVideoStream,
-    stopRenderRemoteVideoStream = _ref8.stopRenderRemoteVideoStream;
+  var t = (0, _i18n.useI18n)();
+  var _ref8 = context.remoteVideoRenderManager || {},
+    startRenderRemoteVideo = _ref8.startRenderRemoteVideo,
+    stopRenderRemoteVideo = _ref8.stopRenderRemoteVideo;
+  var isFirstRemoteVideoFrameRendered = (_context$remoteVideoR = context.remoteVideoRenderManager) === null || _context$remoteVideoR === void 0 ? void 0 : _context$remoteVideoR.isStreamFirstFrameRendered(streamId);
   (0, _react.useEffect)(function () {
     var dom = divRef.current;
     if (dom) {
       if (hasVideoStream) {
-        startRenderRemoteVideoStream === null || startRenderRemoteVideoStream === void 0 || startRenderRemoteVideoStream(streamId, videoStreamType, {
+        startRenderRemoteVideo === null || startRenderRemoteVideo === void 0 || startRenderRemoteVideo(streamId, videoStreamType, {
           renderMode: renderMode,
           isMirror: false
         }, dom);
       }
     }
     return function () {
-      dom && (stopRenderRemoteVideoStream === null || stopRenderRemoteVideoStream === void 0 ? void 0 : stopRenderRemoteVideoStream(streamId, dom));
+      dom && (stopRenderRemoteVideo === null || stopRenderRemoteVideo === void 0 ? void 0 : stopRenderRemoteVideo(streamId, dom));
     };
-  }, [hasVideoStream, streamId, videoStreamType, renderMode, startRenderRemoteVideoStream, stopRenderRemoteVideoStream]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: "fcr-member-window-body",
-    ref: divRef
+  }, [hasVideoStream, streamId, videoStreamType, renderMode]);
+  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/participant/attendee/index.css

@@ -16,54 +16,3 @@
   max-width: 300px;
   padding: 0;
 }
-
-.operate-waiting-room-dialog-content {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  background: white;
-  padding: 20px;
-  border-radius: 20px;
-}
-
-.operate-waiting-room-dialog-title {
-  font-weight: 600;
-  font-size: 16px;
-  margin-bottom: 10px;
-}
-
-.operate-waiting-room-dialog-tooltip {
-  margin-bottom: 10px;
-}
-
-.operate-waiting-room-dialog-confirm {
-  display: flex;
-}
-
-.operate-waiting-room-dialog-btns {
-  display: flex;
-  justify-content: space-between;
-  width: 100%;
-  margin-top: 10px;
-}
-
-.operate-waiting-room-dialog-btns .fcr-button-normal {
-  width: 48%;
-}
-
-.operate-waiting-room-dialog-btns .fcr-button-white {
-  background-color: var(--fcr_ui_scene_btn2);
-  color: var(--fcr_ui_scene_icontext2);
-  width: 48%;
-}
-
-.operate-waiting-room-dialog-btns .fcr-button-white:hover {
-  background-color: var(--fcr_ui_scene_btn2) !important;
-  color: var(--fcr_ui_scene_icontext2) !important;
-  width: 48%;
-}
-
-.operate-waiting-room-dialog-btns .fcr-button-danger {
-  width: 48%;
-}

package/lib/modules/participant/attendee/index.d.ts

@@ -2,18 +2,21 @@ import { ParticipantActionType, User } from 'agora-ui-foundation/lib/components/
 import { FcrUserRole } from '../../../type';
 import './index.css';
 import { FcrPrivilegeUserRole } from 'fcr-core';
+import { DialogKey } from '../../../utilities/constant';
 import { FcrInterpreterUserInfo, FcrLanguage } from 'fcr-core/lib/room-control/interpreter-control/types';
 import { FcrUserKickedOutType } from 'fcr-core/lib/room-control/user-control/type';
-import { FcrRoomType } from 'fcr-core/lib/room-control/type';
-import './index.css';
 export type OperateWaitingRoomMemberDialogProps = {
     type: 'remove' | 'removeAll' | 'admitAll';
     tooltip: string;
     title: string;
     userId?: string;
-    onChecked?: (value: boolean) => void;
 };
-export declare const OperateWaitingRoomMemberDialog: ({ type, tooltip, onChecked, }: OperateWaitingRoomMemberDialogProps) => import("react/jsx-runtime").JSX.Element;
+export declare const WaitingRoomDialogKeyMap: {
+    remove: DialogKey;
+    removeAll: DialogKey;
+    admitAll: DialogKey;
+};
+export declare const OperateWaitingRoomMemberDialog: ({ type, tooltip, title, userId, }: OperateWaitingRoomMemberDialogProps) => import("react/jsx-runtime").JSX.Element;
 interface ParticipantAttendeeProps extends User {
     onParticipantsButtonClick: (action: ParticipantActionType, userId: string, type?: FcrUserKickedOutType | undefined) => void;
     currentPerspectiveType?: 'host' | 'attendee' | 'cohost';
@@ -25,7 +28,7 @@ interface ParticipantAttendeeProps extends User {
     hasMutePermission: (role: FcrPrivilegeUserRole | FcrUserRole) => boolean;
     hasUnmutePermission: (role: FcrPrivilegeUserRole | FcrUserRole) => boolean;
     hasRequestStartAudioPermission: (role: FcrPrivilegeUserRole | FcrUserRole) => boolean;
-    activeTab: FcrRoomType;
+    activeTab: string;
     moveToMainRoomByUserIds: (userId: string[]) => void;
     interpreterUsers?: FcrInterpreterUserInfo[] | null;
     interpreterState: boolean;