@azure/communication-react 1.2.3-alpha-202205170014.0 → 1.2.3-alpha-202205180014.0

package/dist/dist-cjs/communication-react/index.js

@@ -191,7 +191,7 @@ const fromFlatCommunicationIdentifier = (id) => {
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-var telemetryVersion = '1.2.3-alpha-202205170014.0';
+var telemetryVersion = '1.2.3-alpha-202205180014.0';
 
 // Copyright (c) Microsoft Corporation.
 /**
@@ -2031,7 +2031,8 @@ const _FileCard = (props) => {
         width: '12rem',
         background: theme.palette.neutralLighter,
         borderRadius: theme.effects.roundedCorner4,
-        border: `${_pxToRem(1)} solid ${theme.palette.neutralQuaternary}`
+        border: `${_pxToRem(1)} solid ${theme.palette.neutralQuaternary}`,
+        cursor: 'pointer'
     });
     const fileInfoWrapperClassName = react.mergeStyles({
         padding: _pxToRem(12),
@@ -2063,7 +2064,9 @@ const _FileCard = (props) => {
             height: _pxToRem(progressBarThicknessPx)
         }
     };
-    return (React__default['default'].createElement(react.Stack, { className: containerClassName },
+    return (React__default['default'].createElement(react.Stack, { className: containerClassName, onClick: () => {
+            props.actionHandler && props.actionHandler();
+        } },
         React__default['default'].createElement(react.Stack, { horizontal: true, horizontalAlign: "space-between", verticalAlign: "center", className: fileInfoWrapperClassName },
             React__default['default'].createElement(react.Stack, null,
                 React__default['default'].createElement(react.Icon, Object.assign({}, reactFileTypeIcons.getFileTypeIconProps({
@@ -2073,9 +2076,7 @@ const _FileCard = (props) => {
                 })))),
             React__default['default'].createElement(react.Stack, { className: fileNameContainerClassName },
                 React__default['default'].createElement(react.Text, { className: fileNameTextClassName }, fileName)),
-            React__default['default'].createElement(react.Stack, { verticalAlign: "center", className: actionIconClassName, onClick: () => {
-                    props.actionHandler && props.actionHandler();
-                } }, actionIcon && actionIcon)),
+            React__default['default'].createElement(react.Stack, { verticalAlign: "center", className: actionIconClassName }, actionIcon && actionIcon)),
         showProgressIndicator && React__default['default'].createElement(react.ProgressIndicator, { percentComplete: progress, styles: progressIndicatorStyles })));
 };
 
@@ -15447,7 +15448,7 @@ const CallWithChatControlBar = (props) => {
                             isEnabled$1(options.cameraButton) && (React__default['default'].createElement(Camera, { displayType: options.displayType, styles: commonButtonStyles, splitButtonsForDeviceSelection: !props.mobileView })),
                             props.mobileView && isEnabled$1(options === null || options === void 0 ? void 0 : options.chatButton) && chatButton,
                             isEnabled$1(options.screenShareButton) && (React__default['default'].createElement(ScreenShare, { option: options.screenShareButton, displayType: options.displayType, styles: screenShareButtonStyles })),
-                            props.mobileView && (React__default['default'].createElement(MoreButton, { "data-ui-id": "call-with-chat-composite-more-button", strings: moreButtonStrings, onClick: props.onMoreButtonClicked })),
+                            props.mobileView && (React__default['default'].createElement(MoreButton, { "data-ui-id": "call-with-chat-composite-more-button", strings: moreButtonStrings, onClick: props.onMoreButtonClicked, disabled: props.disableButtonsForLobbyPage })),
                             React__default['default'].createElement(EndCall, { displayType: "compact", styles: endCallButtonStyles })))))),
         !props.mobileView && (React__default['default'].createElement(react.Stack, { horizontal: true, className: !props.mobileView ? react.mergeStyles(desktopButtonContainerStyle) : undefined },
             isEnabled$1(options === null || options === void 0 ? void 0 : options.peopleButton) && (React__default['default'].createElement(PeopleButton, { checked: props.peopleButtonChecked, showLabel: true, onClick: props.onPeopleButtonClicked, "data-ui-id": "call-with-chat-composite-people-button", disabled: props.disableButtonsForLobbyPage, strings: peopleButtonStrings, styles: commonButtonStyles })),
@@ -16434,10 +16435,20 @@ const CallWithChatScreen = (props) => {
     const closePane = React.useCallback(() => {
         setActivePane('none');
     }, [setActivePane]);
+    const chatProps = React.useMemo(() => {
+        return {
+            adapter: new CallWithChatBackedChatAdapter(callWithChatAdapter)
+        };
+    }, [callWithChatAdapter]);
+    const modalLayerHostId = reactHooks.useId('modalLayerhost');
+    const isInLobbyOrConnecting = currentPage === 'lobby';
+    const hasJoinedCall = !!(currentPage && hasJoinedCallFn(currentPage, currentCallState !== null && currentCallState !== void 0 ? currentCallState : 'None'));
+    const showControlBar = isInLobbyOrConnecting || hasJoinedCall;
+    const isMobileWithActivePane = mobileView && activePane !== 'none';
     /** Constant setting of id for the parent stack of the composite */
     const compositeParentDivId = reactHooks.useId('callWithChatCompositeParentDiv-internal');
     const toggleChat = React.useCallback(() => {
-        if (activePane === 'chat') {
+        if (activePane === 'chat' || !hasJoinedCall) {
             setActivePane('none');
         }
         else {
@@ -16456,21 +16467,25 @@ const CallWithChatScreen = (props) => {
                 clearInterval(chatFocusTimeout);
             }, 300);
         }
-    }, [activePane, setActivePane, compositeParentDivId]);
+    }, [activePane, setActivePane, compositeParentDivId, hasJoinedCall]);
     const togglePeople = React.useCallback(() => {
-        if (activePane === 'people') {
+        if (activePane === 'people' || !hasJoinedCall) {
             setActivePane('none');
         }
         else {
             setActivePane('people');
         }
-    }, [activePane, setActivePane]);
+    }, [activePane, setActivePane, hasJoinedCall]);
     const selectChat = React.useCallback(() => {
-        setActivePane('chat');
-    }, [setActivePane]);
+        if (hasJoinedCall) {
+            setActivePane('chat');
+        }
+    }, [setActivePane, hasJoinedCall]);
     const selectPeople = React.useCallback(() => {
-        setActivePane('people');
-    }, [setActivePane]);
+        if (hasJoinedCall) {
+            setActivePane('people');
+        }
+    }, [setActivePane, hasJoinedCall]);
     const [showDrawer, setShowDrawer] = React.useState(false);
     const onMoreButtonClicked = React.useCallback(() => {
         closePane();
@@ -16483,16 +16498,6 @@ const CallWithChatScreen = (props) => {
         setShowDrawer(false);
         togglePeople();
     }, [togglePeople]);
-    const chatProps = React.useMemo(() => {
-        return {
-            adapter: new CallWithChatBackedChatAdapter(callWithChatAdapter)
-        };
-    }, [callWithChatAdapter]);
-    const modalLayerHostId = reactHooks.useId('modalLayerhost');
-    const isInLobbyOrConnecting = currentPage === 'lobby';
-    const hasJoinedCall = !!(currentPage && hasJoinedCallFn(currentPage, currentCallState !== null && currentCallState !== void 0 ? currentCallState : 'None'));
-    const showControlBar = isInLobbyOrConnecting || hasJoinedCall;
-    const isMobileWithActivePane = mobileView && activePane !== 'none';
     return (React__default['default'].createElement("div", { ref: containerRef, className: react.mergeStyles(containerDivStyles) },
         React__default['default'].createElement(react.Stack, { verticalFill: true, grow: true, styles: compositeOuterContainerStyles, id: compositeParentDivId },
             React__default['default'].createElement(react.Stack, { horizontal: true, grow: true },