@azure/communication-react 1.5.1-alpha-202305040013 → 1.5.1-alpha-202305050017

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

@@ -162,7 +162,7 @@ const _toCommunicationIdentifier = (id) => {
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
 // GENERATED FILE. DO NOT EDIT MANUALLY.
-var telemetryVersion = '1.5.1-alpha-202305040013';
+var telemetryVersion = '1.5.1-alpha-202305050017';
 
 // Copyright (c) Microsoft Corporation.
 /**
@@ -4851,7 +4851,7 @@ const extension = (fileName) => fileName.split('.').pop() || '';
  * @returns DismissedError[]
  * Always returns a new Array so that the state variable is updated, trigerring a render.
  */
-const dismissError$1 = (dismissedErrors, toDismiss) => {
+const dismissError = (dismissedErrors, toDismiss) => {
     var _a;
     const now = new Date(Date.now());
     for (const error of dismissedErrors) {
@@ -5058,7 +5058,7 @@ const ErrorBar = (props) => {
                 height: 0,
                 paddingTop: '0.8rem'
             }
-        }, key: error.type, messageBarType: messageBarType(error.type), messageBarIconProps: messageBarIconProps(error.type), onDismiss: () => setDismissedErrors(dismissError$1(dismissedErrors, error)), dismissButtonAriaLabel: strings.dismissButtonAriaLabel, dismissIconProps: { iconName: 'ErrorBarClear' } }), strings[error.type])))));
+        }, key: error.type, messageBarType: messageBarType(error.type), messageBarIconProps: messageBarIconProps(error.type), onDismiss: () => setDismissedErrors(dismissError(dismissedErrors, error)), dismissButtonAriaLabel: strings.dismissButtonAriaLabel, dismissIconProps: { iconName: 'ErrorBarClear' } }), strings[error.type])))));
 };
 
 // Copyright (c) Microsoft Corporation.
@@ -13807,7 +13807,7 @@ const _TroubleshootingGuideErrorBar = (props) => {
             onNetworkingTroubleshootingClick && (React__default['default'].createElement(react.Link, { onClick: onNetworkingTroubleshootingClick, underline: true },
                 React__default['default'].createElement("span", null, troubleshootingGuideStrings.networkTroubleshootingLinkText)))));
         return (React__default['default'].createElement(react.MessageBar, Object.assign({}, props, { styles: messageBarStyle(theme, messageBarType(error.type)), key: error.type, messageBarType: messageBarType(error.type), messageBarIconProps: messageBarIconProps(error.type), actions: React__default['default'].createElement(react.MessageBarButton, { text: troubleshootingGuideStrings.dismissButtonText, styles: dismissButtonStyle(theme), onClick: () => {
-                    setDismissedErrors(dismissError$1(dismissedErrors, error));
+                    setDismissedErrors(dismissError(dismissedErrors, error));
                 }, ariaLabel: strings.dismissButtonAriaLabel }), isMultiline: false }), showErrorBar(error.type, devicePermissionErrorBar, networkErrorBar)));
     })));
 };
@@ -17530,6 +17530,19 @@ const createParticipantModifier = (createModifiedParticipant) => {
                 ? Object.assign(Object.assign({}, state.call), { remoteParticipants: modifiedParticipants }) : undefined });
     };
 };
+/**
+ * @private
+ */
+const dismissVideoEffectsError = (toDismiss) => {
+    var _a;
+    const now = new Date(Date.now());
+    const toDismissTimestamp = (_a = toDismiss.timestamp) !== null && _a !== void 0 ? _a : now;
+    // Record that this error was dismissed for the first time right now.
+    return {
+        dismissedAt: now > toDismissTimestamp ? now : toDismissTimestamp,
+        activeSince: toDismiss.timestamp
+    };
+};
 
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT license.
@@ -21689,18 +21702,6 @@ const activeVideoBackgroundEffectSelector = reselect__namespace.createSelector([
     return 'none';
 });
 
-// Copyright (c) Microsoft Corporation.
-/* @conditional-compile-remove(video-background-effects) */
-/**
- * @private
- */
-const videoBackgroundErrorsSelector = reselect__namespace.createSelector([getLatestErrors], (errors) => {
-    if (errors && errors['VideoEffectsFeature.startEffects']) {
-        return errors['VideoEffectsFeature.startEffects'];
-    }
-    return null;
-});
-
 // Copyright (c) Microsoft Corporation.
 /**
  * @private
@@ -21737,7 +21738,7 @@ var __awaiter$8 = (window && window.__awaiter) || function (thisArg, _arguments,
  * @private
  */
 /** @beta */
-const VideoEffectsPaneContent = () => {
+const VideoEffectsPaneContent = (props) => {
     /* @conditional-compile-remove(video-background-effects) */
     const locale = useLocale();
     /* @conditional-compile-remove(video-background-effects) */
@@ -21816,19 +21817,15 @@ const VideoEffectsPaneContent = () => {
             }
         }
     }), [adapter, selectableVideoEffects]);
-    return VideoEffectsPaneTrampoline(
+    return VideoEffectsPaneTrampoline(props.onDismissError, props.activeVideoEffectError, 
     /* @conditional-compile-remove(video-background-effects) */
     selectableVideoEffects, 
     /* @conditional-compile-remove(video-background-effects) */
     onEffectChange);
 };
-const VideoEffectsPaneTrampoline = (selectableVideoEffects, onEffectChange) => {
-    /* @conditional-compile-remove(video-background-effects) */
-    const [dismissedError, setDismissedError] = React.useState();
+const VideoEffectsPaneTrampoline = (onDismissError, activeVideoEffectError, selectableVideoEffects, onEffectChange) => {
     /* @conditional-compile-remove(video-background-effects) */
-    const latestEffectError = useSelector$1(videoBackgroundErrorsSelector);
-    /* @conditional-compile-remove(video-background-effects) */
-    const showError = latestEffectError && (!dismissedError || latestEffectError.timestamp > dismissedError.dismissedAt);
+    const videoEffectError = activeVideoEffectError && activeVideoEffectError();
     /* @conditional-compile-remove(video-background-effects) */
     const selectedEffect = useSelector$1(activeVideoBackgroundEffectSelector);
     /* @conditional-compile-remove(video-background-effects) */
@@ -21839,7 +21836,7 @@ const VideoEffectsPaneTrampoline = (selectableVideoEffects, onEffectChange) => {
     const locale = useLocale();
     /* @conditional-compile-remove(video-background-effects) */
     return (React__default['default'].createElement(react.Stack, { horizontalAlign: "center" },
-        showError && latestEffectError && (React__default['default'].createElement(react.MessageBar, { messageBarType: react.MessageBarType.error, onDismiss: () => setDismissedError(dismissError(latestEffectError)) }, locale.strings.call.unableToStartVideoEffect)),
+        videoEffectError && (React__default['default'].createElement(react.MessageBar, { messageBarType: react.MessageBarType.error, onDismiss: () => onDismissError(videoEffectError) }, locale.strings.call.unableToStartVideoEffect)),
         showWarning && (React__default['default'].createElement(react.MessageBar, { messageBarType: react.MessageBarType.warning }, locale.strings.call.cameraOffBackgroundEffectWarningText)),
         React__default['default'].createElement(_VideoBackgroundEffectsPicker, { label: "Background" // TODO [jaburnsi]: localize
             , styles: backgroundPickerStyles, options: selectableVideoEffects !== null && selectableVideoEffects !== void 0 ? selectableVideoEffects : [], onChange: onEffectChange, selectedEffectKey: selectedEffect })));
@@ -21852,17 +21849,18 @@ const backgroundPickerStyles = {
         fontWeight: '400'
     }
 };
+
+// Copyright (c) Microsoft Corporation.
 /* @conditional-compile-remove(video-background-effects) */
-const dismissError = (toDismiss) => {
-    var _a;
-    const now = new Date(Date.now());
-    const toDismissTimestamp = (_a = toDismiss.timestamp) !== null && _a !== void 0 ? _a : now;
-    // Record that this error was dismissed for the first time right now.
-    return {
-        dismissedAt: now > toDismissTimestamp ? now : toDismissTimestamp,
-        activeSince: toDismiss.timestamp
-    };
-};
+/**
+ * @private
+ */
+const videoBackgroundErrorsSelector = reselect__namespace.createSelector([getLatestErrors], (errors) => {
+    if (errors && errors['VideoEffectsFeature.startEffects']) {
+        return errors['VideoEffectsFeature.startEffects'];
+    }
+    return undefined;
+});
 
 // Copyright (c) Microsoft Corporation.
 const VIDEO_EFFECTS_SIDE_PANE_ID = 'videoeffects';
@@ -21881,9 +21879,27 @@ const useVideoEffectsPane = (updateSidePaneRenderer, mobileView) => {
             /* @conditional-compile-remove(video-background-effects) */
             dismissSidePaneButtonAriaLabel: (_c = (_b = locale.strings.call.dismissSidePaneButtonLabel) !== null && _b !== void 0 ? _b : locale.strings.callWithChat.dismissSidePaneButtonLabel) !== null && _c !== void 0 ? _c : 'Close', mobileView: mobileView }));
     }, [closePane, /* @conditional-compile-remove(video-background-effects) */ locale.strings, mobileView]);
-    const onRenderContent = React.useCallback(() => {
-        return React__default['default'].createElement(VideoEffectsPaneContent, null);
+    const [dismissedVideoEffectsError, setDismissedVideoEffectsError] = React.useState();
+    const onDismissVideoEffectError = React.useCallback((error) => {
+        setDismissedVideoEffectsError(dismissVideoEffectsError(error));
     }, []);
+    /* @conditional-compile-remove(video-background-effects) */
+    const latestVideoEffectError = useSelector$1(videoBackgroundErrorsSelector);
+    const activeVideoEffectError = React.useCallback(() => {
+        /* @conditional-compile-remove(video-background-effects) */
+        if (latestVideoEffectError &&
+            (!dismissedVideoEffectsError || latestVideoEffectError.timestamp > dismissedVideoEffectsError.dismissedAt)) {
+            return latestVideoEffectError;
+        }
+        return undefined;
+    }, [
+        dismissedVideoEffectsError,
+        /* @conditional-compile-remove(video-background-effects) */
+        latestVideoEffectError
+    ]);
+    const onRenderContent = React.useCallback(() => {
+        return (React__default['default'].createElement(VideoEffectsPaneContent, { onDismissError: onDismissVideoEffectError, activeVideoEffectError: activeVideoEffectError }));
+    }, [onDismissVideoEffectError, activeVideoEffectError]);
     const sidePaneRenderer = React.useMemo(() => ({
         headerRenderer: onRenderHeader,
         contentRenderer: onRenderContent,
@@ -22185,6 +22201,10 @@ const CallArrangement = (props) => {
     if (!rolePermissions.cameraButton && props.errorBarProps) {
         errorBarProps = Object.assign(Object.assign({}, props.errorBarProps), { activeErrorMessages: props.errorBarProps.activeErrorMessages.filter((e) => e.type !== 'callCameraAccessDenied' && e.type !== 'callCameraAccessDeniedSafari') });
     }
+    /* @conditional-compile-remove(video-background-effects) */
+    if (useIsParticularSidePaneOpen('videoeffects') && props.errorBarProps) {
+        errorBarProps = Object.assign(Object.assign({}, props.errorBarProps), { activeErrorMessages: props.errorBarProps.activeErrorMessages.filter((e) => e.type !== 'unableToStartVideoEffect') });
+    }
     /* @conditional-compile-remove(close-captions) */
     const isTeamsCall = useSelector$1(getIsTeamsCall);
     /* @conditional-compile-remove(close-captions) */
@@ -23491,6 +23511,10 @@ const ConfigurationPage = (props) => {
     if (!rolePermissions.cameraButton) {
         errorBarProps = Object.assign(Object.assign({}, errorBarProps), { activeErrorMessages: errorBarProps.activeErrorMessages.filter((e) => e.type !== 'callCameraAccessDenied' && e.type !== 'callCameraAccessDeniedSafari') });
     }
+    /* @conditional-compile-remove(video-background-effects) */
+    if (useIsParticularSidePaneOpen('videoeffects') && errorBarProps) {
+        errorBarProps = Object.assign(Object.assign({}, errorBarProps), { activeErrorMessages: errorBarProps.activeErrorMessages.filter((e) => e.type !== 'unableToStartVideoEffect') });
+    }
     /* @conditional-compile-remove(rooms) */
     if (!rolePermissions.microphoneButton) {
         // If user's role permissions do not allow access to the microphone button then DO NOT disable the start call button