fcr-ui-scene 3.4.2 → 3.4.4

package/lib/modules/share-screen/selection/index.js

@@ -53,25 +53,24 @@ require("core-js/modules/esnext.typed-array.filter-reject.js");
 require("core-js/modules/esnext.typed-array.group-by.js");
 require("core-js/modules/esnext.typed-array.to-spliced.js");
 require("core-js/modules/esnext.typed-array.unique-by.js");
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _card = require("agora-ui-foundation/lib/components/card");
 var _type = require("agora-rte-sdk/lib/core/rtc/type");
 var _button = require("agora-ui-foundation/lib/components/button");
 var _shareAudio = require("agora-ui-foundation/lib/components/room-screen-share-state-bar/share-audio");
-var _tabs = require("agora-ui-foundation/lib/components/tabs");
-var _windowsControl = require("agora-ui-foundation/lib/components/windows-control");
 var _debounce = _interopRequireDefault(require("lodash/debounce"));
 var _mobxReact = require("mobx-react");
 var _react = require("react");
 var _tools = require("../../../utilities/tools");
-var _platform = require("../../../utilities/platform");
 var _type2 = require("../../../type");
 var _tooltip = require("agora-ui-foundation/lib/components/tooltip");
 var _i18n = require("agora-ui-foundation/lib/i18n");
 require("./index.css");
 var _store = require("../store");
-var _popover = require("agora-ui-foundation/lib/components/popover");
-var _openMicTips = _interopRequireDefault(require("../../../fragments/share-screen-selection/open-mic-tips"));
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _tabFrame = _interopRequireDefault(require("../../components/tab-frame"));
 var _jsxRuntime = require("react/jsx-runtime");
 var ShareSelectionWindowType = /*#__PURE__*/function (ShareSelectionWindowType) {
   ShareSelectionWindowType["BASIC"] = "basic";
@@ -89,38 +88,56 @@ var ShareSelection = exports.ShareSelection = (0, _mobxReact.observer)(function
     boardOwnerUser = _useContext.boardOwnerUser,
     localUser = _useContext.localUser,
     localUserRole = _useContext.localUserRole,
-    title = _useContext.title,
-    localMicrophoneMute = _useContext.localMicrophoneMute,
     handleChooseScreen = _useContext.handleChooseScreen,
     handleStartShare = _useContext.handleStartShare,
     setShareWithAudioState = _useContext.setShareWithAudioState,
     setShareAudioProcessingChannel = _useContext.setShareAudioProcessingChannel,
     closeShareScreenSelection = _useContext.closeShareScreenSelection,
     handlerBoardShareStop = _useContext.handlerBoardShareStop,
-    sendLocalAudioStateEvent = _useContext.sendLocalAudioStateEvent;
+    hasLoopbackDevice = _useContext.hasLoopbackDevice,
+    openRelaunchTipsDialog = _useContext.openRelaunchTipsDialog;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     loading = _useState2[0],
     setLoading = _useState2[1];
-  var _useState3 = (0, _react.useState)(false),
-    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    showOpenMicTips = _useState4[0],
-    setShowOpenMicTips = _useState4[1];
+  var t = (0, _i18n.useI18n)();
   (0, _react.useEffect)(function () {
     setLoading(false);
     return function () {
       setLoading(false);
     };
   }, []);
-  var toggleShareWithAudio = function toggleShareWithAudio(target) {
-    setShareWithAudioState(target);
-    setShowOpenMicTips(target && localMicrophoneMute);
-  };
-  var openMicAndCloseTips = function openMicAndCloseTips() {
-    setShareWithAudioState(true);
-    setShowOpenMicTips(false);
-    sendLocalAudioStateEvent();
-  };
+  var toggleShareWithAudio = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee(target) {
+      var hideTips;
+      return _regenerator["default"].wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            if (target) {
+              _context.next = 3;
+              break;
+            }
+            setShareWithAudioState(target);
+            return _context.abrupt("return");
+          case 3:
+            _context.next = 5;
+            return hasLoopbackDevice();
+          case 5:
+            hideTips = _context.sent;
+            if (!hideTips) {
+              openRelaunchTipsDialog();
+            }
+            setShareWithAudioState(target);
+          case 8:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function toggleShareWithAudio(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
   var handleOkClick = (0, _react.useCallback)((0, _debounce["default"])(function () {
     if (currentSelection) {
       setLoading(true);
@@ -130,120 +147,100 @@ var ShareSelection = exports.ShareSelection = (0, _mobxReact.observer)(function
   var transI18n = (0, _i18n.useI18n)();
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "share-selection-window",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: "share-selection-window-control draggable",
-      children: (0, _platform.isWindows)() && /*#__PURE__*/(0, _jsxRuntime.jsx)(_windowsControl.FcrWindowControl, {
-        onClose: closeShareScreenSelection,
-        enableMinimize: false,
-        enableMaximize: false
-      })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: "share-selection-window__header  fcr-flex-center draggable",
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_tabs.FcrTabs, {
-        items: [{
-          label: transI18n('fmt_screenshare_window_tab_basic'),
-          key: ShareSelectionWindowType.BASIC
-        }, {
-          label: transI18n('fmt_screenshare_window_tab_advanced'),
-          key: ShareSelectionWindowType.ADVANCED
-        }],
-        activeKey: ShareSelectionWindowType.BASIC,
-        onChange: function onChange(key) {
-          // throw new Error('Function not implemented.');
-        }
-      })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: "share-selection-window__share-content frc-flex",
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "share-selection-window__share-windows share-selection-window__share-card",
-        children: screenCaptureSources.map(function (screen) {
-          var type = _type.AgoraRtcScreenCaptureType.DISPLAY;
-          var isWhiteboard = screen.id.split('-')[0] === 'whiteboard';
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_card.FcrCard, {
-            disabled: isWhiteboard && !!(boardOwnerUser !== null && boardOwnerUser !== void 0 && boardOwnerUser.userId),
-            title: isWhiteboard ? title : screen.title,
-            active: currentSelectionType === type && screen.id === currentSelection || screen.id === currentSelection,
-            onCardClick: function onCardClick() {
-              handleChooseScreen(screen.id, type);
-            },
-            onDoubleClickCard: function onDoubleClickCard() {
-              if (boardOwnerUser) return;
-              handleStartShare(screen.id, type, shareWithAudio);
-            },
-            content: screen.image instanceof Uint8Array ? /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-              src: (0, _tools.uint8ArrayToImageData)({
-                buffer: screen.image,
-                width: screen.imageWidth,
-                height: screen.imageHeight
-              }),
-              alt: screen.title
-            }) : [_type2.FcrUserRole.HOST, _type2.FcrUserRole.COHOST].includes(localUserRole) && isWhiteboard && (boardOwnerUser === null || boardOwnerUser === void 0 ? void 0 : boardOwnerUser.userId) !== (localUser === null || localUser === void 0 ? void 0 : localUser.userId) && boardOwnerUser ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
-              trigger: "hover",
-              content: transI18n('fmt_screenshare_tips_alreadyopened'),
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
-                styleType: "danger",
-                size: "XXS",
-                shape: "rounded",
-                onClick: handlerBoardShareStop,
-                children: transI18n('fmt_screenshare_button_stopshare')
-              })
-            }) : screen.image
-          }, "screen-".concat(screen.id));
-        })
-      }), !!applicationCaptureSources.length && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: "frc-flex",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          style: {
-            marginTop: '38px'
-          },
-          children: transI18n('fmt_uimanager_labels_Application')
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: "share-selection-window__share-application share-selection-window__share-card",
-          children: applicationCaptureSources.map(function (application) {
-            return /*#__PURE__*/(0, _jsxRuntime.jsx)(_card.FcrCard, {
-              active: currentSelectionType === _type.AgoraRtcScreenCaptureType.WINDOW && application.id === currentSelection,
-              onCardClick: function onCardClick() {
-                handleChooseScreen(application.id, _type.AgoraRtcScreenCaptureType.WINDOW);
-              },
-              onDoubleClickCard: function onDoubleClickCard() {
-                handleStartShare(application.id, _type.AgoraRtcScreenCaptureType.WINDOW, shareWithAudio);
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_tabFrame["default"], {
+      activeKey: ShareSelectionWindowType.BASIC,
+      tabs: [{
+        label: transI18n('fmt_screenshare_window_tab_basic'),
+        key: ShareSelectionWindowType.BASIC,
+        content: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "share-selection-window__share-content frc-flex",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: "share-selection-window__share-windows share-selection-window__share-card",
+            children: screenCaptureSources.map(function (screen) {
+              var type = _type.AgoraRtcScreenCaptureType.SCREEN;
+              var isWhiteboard = screen.id.split('-')[0] === 'whiteboard';
+              return /*#__PURE__*/(0, _jsxRuntime.jsx)(_card.FcrCard, {
+                disabled: isWhiteboard && !!(boardOwnerUser !== null && boardOwnerUser !== void 0 && boardOwnerUser.userId),
+                title: isWhiteboard ? t('fmt_share_options_whiteboard') : screen.title,
+                active: currentSelectionType === type && screen.id === currentSelection || screen.id === currentSelection,
+                onCardClick: function onCardClick() {
+                  handleChooseScreen(screen.id, type);
+                },
+                onDoubleClickCard: function onDoubleClickCard() {
+                  if (boardOwnerUser) return;
+                  handleStartShare(screen.id, type, shareWithAudio);
+                },
+                content: screen.image instanceof Uint8Array ? /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+                  src: (0, _tools.uint8ArrayToImageData)({
+                    buffer: screen.image,
+                    width: screen.imageWidth,
+                    height: screen.imageHeight
+                  }),
+                  alt: screen.title
+                }) : [_type2.FcrUserRole.HOST, _type2.FcrUserRole.COHOST].includes(localUserRole) && isWhiteboard && (boardOwnerUser === null || boardOwnerUser === void 0 ? void 0 : boardOwnerUser.userId) !== (localUser === null || localUser === void 0 ? void 0 : localUser.userId) && boardOwnerUser ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.FcrToolTip, {
+                  trigger: "hover",
+                  content: transI18n('fmt_screenshare_tips_alreadyopened'),
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
+                    styleType: "danger",
+                    size: "XXS",
+                    shape: "rounded",
+                    onClick: handlerBoardShareStop,
+                    children: transI18n('fmt_screenshare_button_stopshare')
+                  })
+                }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+                  type: screen.image,
+                  size: 48,
+                  colors: {
+                    iconPrimary: '#4262FF'
+                  }
+                })
+              }, "screen-".concat(screen.id));
+            })
+          }), !!applicationCaptureSources.length && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            className: "frc-flex",
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              style: {
+                marginTop: '38px'
               },
-              title: application.title,
-              content: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
-                src: (0, _tools.uint8ArrayToImageData)({
-                  buffer: application.image,
-                  width: application.imageWidth,
-                  height: application.imageHeight
-                }),
-                alt: application.title
+              children: transI18n('fmt_uimanager_labels_Application')
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              className: "share-selection-window__share-application share-selection-window__share-card",
+              children: applicationCaptureSources.map(function (application) {
+                return /*#__PURE__*/(0, _jsxRuntime.jsx)(_card.FcrCard, {
+                  active: currentSelectionType === _type.AgoraRtcScreenCaptureType.WINDOW && application.id === currentSelection,
+                  onCardClick: function onCardClick() {
+                    handleChooseScreen(application.id, _type.AgoraRtcScreenCaptureType.WINDOW);
+                  },
+                  onDoubleClickCard: function onDoubleClickCard() {
+                    handleStartShare(application.id, _type.AgoraRtcScreenCaptureType.WINDOW, shareWithAudio);
+                  },
+                  title: application.title,
+                  content: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+                    src: (0, _tools.uint8ArrayToImageData)({
+                      buffer: application.image,
+                      width: application.imageWidth,
+                      height: application.imageHeight
+                    }),
+                    alt: application.title
+                  })
+                }, "application-".concat(application.id));
               })
-            }, "application-".concat(application.id));
-          })
-        })]
-      })]
+            })]
+          })]
+        })
+      }, {
+        label: transI18n('fmt_screenshare_window_tab_advanced'),
+        key: ShareSelectionWindowType.ADVANCED
+      }]
     }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       className: "share-selection-window__footer",
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "share-selection-window__footer-action",
-        children: currentSelection.split('-')[0] !== 'whiteboard' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_popover.FcrPopover, {
-          showArrow: true,
-          visible: showOpenMicTips,
-          overlayInnerStyle: {
-            width: '270px'
-          },
-          placement: "top",
-          content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_openMicTips["default"], {
-            onCancel: function onCancel() {
-              return toggleShareWithAudio(false);
-            },
-            onOK: openMicAndCloseTips
-          }),
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_shareAudio.ShareAudio, {
-            shareWithAudio: shareWithAudio,
-            toggleShareWithAudio: toggleShareWithAudio,
-            currentAudioChannel: currentShareAudioProcessingChannel,
-            onSwitchAudioChannel: setShareAudioProcessingChannel
-          })
+        children: currentSelection.split('-')[0] !== 'whiteboard' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_shareAudio.ShareAudio, {
+          shareWithAudio: shareWithAudio,
+          toggleShareWithAudio: toggleShareWithAudio,
+          currentAudioChannel: currentShareAudioProcessingChannel,
+          onSwitchAudioChannel: setShareAudioProcessingChannel
         })
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.FcrButton, {
         disabled: currentSelection.split('-')[0] === 'whiteboard' && !!(boardOwnerUser !== null && boardOwnerUser !== void 0 && boardOwnerUser.userId) || loading,

package/lib/modules/share-screen/share-state-bar/index.js

@@ -13,9 +13,9 @@ var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
 var _react = require("react");
 var _reactRnd = require("react-rnd");
-var _shareStateNav = require("../../../fragments/control-bar/share-state-nav");
 require("./index.css");
 var _i18n = require("agora-ui-foundation/lib/i18n");
+var _shareStateNav = require("../../control-bar/components/share-state-nav");
 var _jsxRuntime = require("react/jsx-runtime");
 var ShareStateBar = exports.ShareStateBar = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var shareScreenBarRef = (0, _react.useRef)(null);

package/lib/modules/state-bar/meeting-details.js

@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MeetingDetails = void 0;
-require("core-js/modules/es.array.concat.js");
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+require("core-js/modules/es.date.to-string.js");
 require("core-js/modules/es.regexp.exec.js");
 require("core-js/modules/es.string.replace.js");
 require("core-js/modules/web.timers.js");
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _button = require("agora-ui-foundation/lib/components/button");
 var _icon = require("agora-ui-foundation/lib/components/icon");
 var _type = require("agora-ui-foundation/lib/components/icon/type");
@@ -23,6 +23,7 @@ var _store = require("./store");
 require("./meeting-detail.css");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _meetingTime = require("../../hooks/meeting-time");
+var _meetingDetail2 = require("../../utilities/meeting-detail");
 var _jsxRuntime = require("react/jsx-runtime");
 var CopyState = /*#__PURE__*/function (CopyState) {
   CopyState[CopyState["COPYINIT"] = 1] = "COPYINIT";
@@ -31,13 +32,25 @@ var CopyState = /*#__PURE__*/function (CopyState) {
   CopyState[CopyState["FAILED"] = 4] = "FAILED";
   return CopyState;
 }(CopyState || {});
+var isNextDayAfterDuration = function isNextDayAfterDuration(startTimeStamp, duration) {
+  var futureTimestamp = startTimeStamp + duration;
+  var currentDate = new Date(startTimeStamp);
+  var futureDate = new Date(futureTimestamp);
+  var currentYear = currentDate.getFullYear();
+  var currentMonth = currentDate.getMonth();
+  var currentDay = currentDate.getDate();
+  var futureYear = futureDate.getFullYear();
+  var futureMonth = futureDate.getMonth();
+  var futureDay = futureDate.getDate();
+  return futureYear > currentYear || futureYear === currentYear && futureMonth > currentMonth || futureYear === currentYear && futureMonth === currentMonth && futureDay > currentDay;
+};
 var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function () {
   var t = (0, _i18n.useI18n)();
   var copyTimer = null;
   var _useState = (0, _react.useState)({
       copyState: CopyState.COPYINIT,
       copyIcon: _type.FcrIconType.FCR_LINK,
-      copyText: t('fmt_sharing_button_copydetailed')
+      copyText: t('fmt_popup_button_meetinginfor')
     }),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     copyInfoState = _useState2[0],
@@ -62,28 +75,8 @@ var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function
   }, []);
   if (!roomInfo || !localUser) return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
   var displayMeetingId = (0, _tools.renderMeetingId)(meetingId, roomInfo.roomId);
-
-  // const detailText = t('fmt_link_invitation_password', {
-  //   reason1: localUser.userName,
-  //   reason2: roomInfo?.roomName,
-  //   // reason3: dayjs(scheduleInfo?.startTime ?? 0).format('YYYY-MM-DD HH:mm:ss'),
-  //   reason3: '',
-  //   reason4: shareLink,
-  //   reason5: displayMeetingId,
-  //   reason6: !!password ? `${t('fmt_meeting_creatpage_label_password')}: ${password}` : '',
-  // });
-
-  var detailText = "\n".concat(t('fmt_link_invitation', {
-    reason1: localUser.userName
-  }), "\n").concat(t('fmt_link_invitation_topic', {
-    reason1: roomInfo.roomName
-  }), "\n").concat(t('fmt_link_invitation_link', {
-    reason1: shareLink
-  }), "\n").concat(t('fmt_link_invitation_id', {
-    reason1: displayMeetingId
-  }), "\n").concat(!!password ? t('fmt_link_invitation_password', {
-    reason1: password
-  }) : '').replace(/^\s*\n/gm, '');
+  var duration = (scheduleInfo === null || scheduleInfo === void 0 ? void 0 : scheduleInfo.duration) || 0;
+  var detailText = (0, _meetingDetail2.generateMeetingDetail)(localUser.userName, roomInfo.roomName, (0, _meetingDetail2.generateMeetingDuration)((scheduleInfo === null || scheduleInfo === void 0 ? void 0 : scheduleInfo.startTime) || 0, duration), shareLink, displayMeetingId, password !== null && password !== void 0 ? password : '');
   function handleCopyMeetingId(copyContent) {
     if (!copyContent) return;
     var content = meetingId ? copyContent : copyContent.replace(/\s+/g, '');
@@ -161,7 +154,7 @@ var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function
         setCopyInfoState({
           copyState: CopyState.COPYINIT,
           copyIcon: _type.FcrIconType.FCR_LINK,
-          copyText: t('fmt_sharing_button_copydetailed')
+          copyText: t('fmt_popup_button_meetinginfor')
         });
       }, 1000);
     }
@@ -195,30 +188,32 @@ var MeetingDetails = exports.MeetingDetails = (0, _mobxReact.observer)(function
             size: 20
           })
         })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      }), !!password && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: "meeting-details__content-share-link",
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
-          children: t('fmt_sharing_label_invitationlink')
+          children: t('fmt_meeting_mainwindow_topbar_left_popup_label_meeting_password', {
+            reason1: ''
+          })
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: shareLink
+          children: password
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           onClick: function onClick() {
-            return handlerCopyMeetingShareLink(shareLink);
+            return handleCopyMeetingPassword(password !== null && password !== void 0 ? password : '');
           },
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
             type: _type.FcrIconType.FCR_COPY_ICON,
             size: 20
           })
         })]
-      }), !!password && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: "meeting-details__content-share-link",
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
-          children: t('fmt_meeting_creatpage_label_password')
+          children: t('fmt_sharing_label_invitationlink')
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-          children: password
+          children: shareLink
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
           onClick: function onClick() {
-            return handleCopyMeetingPassword(password !== null && password !== void 0 ? password : '');
+            return handlerCopyMeetingShareLink(shareLink);
           },
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
             type: _type.FcrIconType.FCR_COPY_ICON,

package/lib/modules/video-window/components/deviceState/index.d.ts

@@ -0,0 +1,7 @@
+import { DeviceStateProps } from '../../type';
+export declare const DeviceState: ({ connectType, openConnection, microphoneVolumeLevel, enableMicrophone, microphoneEnabled, }: DeviceStateProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AudioRecordinDeviceIcon: ({ size, micEnabled, volume, }: {
+    size?: number;
+    micEnabled?: boolean;
+    volume?: number;
+}) => import("react/jsx-runtime").JSX.Element;

package/lib/modules/video-window/components/deviceState/index.js

@@ -0,0 +1,75 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DeviceState = exports.AudioRecordinDeviceIcon = void 0;
+var _mobxReact = require("mobx-react");
+var _icon = require("agora-ui-foundation/lib/components/icon");
+var _type = require("agora-ui-foundation/lib/components/icon/type");
+var _microphoneIndicator = require("agora-ui-foundation/lib/components/microphone-indicator");
+var _type2 = require("../../../../type");
+var _jsxRuntime = require("react/jsx-runtime");
+var DeviceState = exports.DeviceState = (0, _mobxReact.observer)(function (_ref) {
+  var connectType = _ref.connectType,
+    openConnection = _ref.openConnection,
+    microphoneVolumeLevel = _ref.microphoneVolumeLevel,
+    enableMicrophone = _ref.enableMicrophone,
+    microphoneEnabled = _ref.microphoneEnabled;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [connectType === _type2.FcrUIConnectType.NONE && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      onClick: function onClick() {
+        return openConnection('computer');
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+        type: _type.FcrIconType.FCR_WEB_CONNECTSOUND,
+        size: 32,
+        colors: {
+          iconPrimary: "var(--fcr_web_ui_scene_mainicon1)",
+          iconSecondary: 'var(--fcr_ui_scene_ramp_green6)'
+        }
+      })
+    }), connectType === _type2.FcrUIConnectType.COMPUTER && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      onClick: function onClick() {
+        enableMicrophone(!microphoneEnabled);
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(AudioRecordinDeviceIcon, {
+        micEnabled: microphoneEnabled,
+        volume: microphoneVolumeLevel
+      })
+    }), connectType === _type2.FcrUIConnectType.PHONE && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+        type: microphoneVolumeLevel > 20 ? _type.FcrIconType.FCR_PHONECALL3 : microphoneVolumeLevel > 10 ? _type.FcrIconType.FCR_PHONECALL2 : _type.FcrIconType.FCR_PHONECALL1,
+        size: 32,
+        colors: {
+          iconPrimary: 'var(--fcr_ui_scene_ramp_green6)'
+        }
+      })
+    })]
+  });
+});
+var AudioRecordinDeviceIcon = exports.AudioRecordinDeviceIcon = function AudioRecordinDeviceIcon(_ref2) {
+  var _ref2$size = _ref2.size,
+    size = _ref2$size === void 0 ? 32 : _ref2$size,
+    _ref2$micEnabled = _ref2.micEnabled,
+    micEnabled = _ref2$micEnabled === void 0 ? false : _ref2$micEnabled,
+    _ref2$volume = _ref2.volume,
+    volume = _ref2$volume === void 0 ? 0 : _ref2$volume;
+  var muteColor = {
+    iconPrimary: "var(--fcr_ui_scene_ramp_red6)",
+    iconSecondary: 'var(--fcr_ui_scene_ramp_red6)'
+  };
+  return !micEnabled ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.FcrIcon, {
+    type: _type.FcrIconType.FCR_NOMUTE,
+    colors: muteColor,
+    size: size
+  }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_microphoneIndicator.MicrophoneIndicator, {
+      pathColor: "var(--fcr_web_ui_scene_mainicon1)",
+      stopStartColor: "var(--fcr_web_ui_scene_mainicon1)",
+      size: size,
+      voicePercent: volume
+    })
+  });
+};

package/lib/modules/video-window/components/members/index.css

@@ -0,0 +1,51 @@
+.fcr-video-window-members {
+  gap: 0;
+  user-select: none;
+  position: relative;
+  width: 100%;
+  min-height: 144px;
+  flex: 1;
+  display: none;
+  flex-direction: column;
+  align-items: center;
+  box-sizing: border-box;
+  padding: 0 1px;
+  border: 1px solid transparent;
+  border-top: none;
+  background-color: var(--fcr_web_ui_scene_fill5);
+  border-radius: 0 0 var(--fcr_cornerradius_m) var(--fcr_cornerradius_m);
+}
+.fcr-video-window-members .fcr-video-window-members-item {
+  width: 100%;
+  min-height: 144px;
+  overflow: hidden;
+  flex: 1;
+  box-sizing: border-box;
+}
+.fcr-video-window-members .fcr-video-window-members-item_last {
+  border-radius: 0 0 var(--fcr_cornerradius_s) var(--fcr_cornerradius_s);
+}
+.fcr-video-window-members .fcr-video-window-members-item_last .fcr-member-window-excitation {
+  border-radius: 0 0 var(--fcr_cornerradius_s) var(--fcr_cornerradius_s);
+}
+.fcr-video-window-members.fcr-video-window-members_mediapreview {
+  display: flex;
+  border: 1px solid var(--fcr_ui_scene_line1);
+  border-top: 0;
+}
+.fcr-video-window-members.fcr-video-window-members_mediapreviews {
+  border: 1px solid var(--fcr_ui_scene_line1);
+  border-top: 0;
+  display: flex;
+}
+.fcr-video-window-members-resize {
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  display: none;
+  justify-content: space-between;
+}
+.fcr-video-window-members-resize_active {
+  display: flex;
+}

package/lib/modules/video-window/components/members/index.d.ts

@@ -0,0 +1,2 @@
+import './index.css';
+export declare const Members: () => import("react/jsx-runtime").JSX.Element;