communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
85 lines • 3.81 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import React from 'react';
import { MessageBar, MessageBarType, Stack } from '@fluentui/react';
import { useLocale } from '../../localization';
/**
* Notification bar for capabilities changed
* @private
*/
export const CapabilitiesChangedNotificationBar = (props) => {
const locale = useLocale();
return (React.createElement(Stack, { "data-ui-id": "capabilities-changed-notification-bar-stack" }, props.capabilitiesChangedNotifications.map((notification) => {
const message = getCapabilityChangedNotificationString(notification, locale.strings.call.capabilityChangedNotification);
if (!message) {
return null;
}
const iconProps = getCustomMessageBarIconProps(notification);
return (React.createElement(MessageBar, { key: notification.capabilityName, styles: messageBarStyles, messageBarType: MessageBarType.warning, dismissIconProps: { iconName: 'ErrorBarClear' }, onDismiss: () => props.onDismissNotification(notification), messageBarIconProps: iconProps }, message));
})));
};
const getCapabilityChangedNotificationString = (notification, strings) => {
var _a, _b, _c, _d;
switch (notification.capabilityName) {
case 'shareScreen':
if (notification.isPresent && notification.changedReason === 'RoleChanged' && notification.role === 'Presenter') {
return (_a = strings === null || strings === void 0 ? void 0 : strings.shareScreen) === null || _a === void 0 ? void 0 : _a.grantedDueToRoleChangeToPresenter;
}
if (!notification.isPresent && notification.changedReason === 'RoleChanged' && notification.role === 'Attendee') {
return (_b = strings === null || strings === void 0 ? void 0 : strings.shareScreen) === null || _b === void 0 ? void 0 : _b.lostDueToRoleChangeToAttendee;
}
break;
case 'viewAttendeeNames':
if (!notification.isPresent &&
notification.changedReason === 'MeetingOptionOrOrganizerPolicyChanged' &&
notification.role === 'Attendee') {
return (_c = strings === null || strings === void 0 ? void 0 : strings.hideAttendeeNames) === null || _c === void 0 ? void 0 : _c.hideAttendeeNameAttendee;
}
if (!notification.isPresent &&
notification.changedReason === 'MeetingOptionOrOrganizerPolicyChanged' &&
notification.role === 'Presenter') {
return (_d = strings === null || strings === void 0 ? void 0 : strings.hideAttendeeNames) === null || _d === void 0 ? void 0 : _d.hideAttendeeNamePresenter;
}
}
return undefined;
};
const getCustomMessageBarIconProps = (notification) => {
let iconName = undefined;
switch (notification.capabilityName) {
case 'turnVideoOn':
if (notification.isPresent) {
iconName = 'ControlButtonCameraOn';
}
else {
iconName = 'ControlButtonCameraProhibited';
}
break;
case 'unmuteMic':
if (notification.isPresent) {
iconName = 'ControlButtonMicOn';
}
else {
iconName = 'ControlButtonMicProhibited';
}
break;
default:
return undefined;
}
return { iconName, styles: { root: { '> *': { height: '1rem', width: '1rem' } } } };
};
const messageBarStyles = {
innerText: {
alignSelf: 'center'
},
icon: {
height: 0
},
content: {
lineHeight: 'inherit'
},
dismissal: {
height: 0,
paddingTop: '0.8rem'
}
};
//# sourceMappingURL=CapabilitiesChangedNotificationBar.js.map