communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
40 lines • 2.37 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import { Stack } from '@fluentui/react';
import React from 'react';
import { bannerNotificationStyles } from '../styles/CallPage.styles';
import { useSelector } from '../hooks/useSelector';
import { getAssignedBreakoutRoom, getBreakoutRoomSettings, getLatestNotifications } from '../selectors/baseSelectors';
import { Banner } from './Banner';
/**
* @private
*/
export const BreakoutRoomsBanner = (props) => {
const { locale, adapter } = props;
const assignedBreakoutRoom = useSelector(getAssignedBreakoutRoom);
const breakoutRoomSettings = useSelector(getBreakoutRoomSettings);
const latestNotifications = useSelector(getLatestNotifications);
if (assignedBreakoutRoom &&
assignedBreakoutRoom.state === 'open' &&
// Breakout room settings are only defined in a breakout room so we use this to ensure
// the button is not shown when already in a breakout room
!breakoutRoomSettings &&
!latestNotifications['assignedBreakoutRoomOpened']) {
return (React.createElement(Stack, { styles: bannerNotificationStyles },
React.createElement(Banner, { strings: {
title: assignedBreakoutRoom.displayName
? locale.strings.call.joinBreakoutRoomBannerTitle.replace('{roomName}', assignedBreakoutRoom.displayName)
: locale.strings.call.joinBreakoutRoomBannerTitle,
primaryButtonLabel: locale.strings.call.joinBreakoutRoomBannerButtonLabel
}, onClickButton: () => assignedBreakoutRoom.join(), iconProps: { iconName: 'NotificationBarBreakoutRoomPromptJoin' }, primaryButton: true })));
}
else if (breakoutRoomSettings && breakoutRoomSettings.disableReturnToMainMeeting !== true) {
return (React.createElement(Stack, { styles: bannerNotificationStyles },
React.createElement(Banner, { strings: {
title: locale.strings.call.returnFromBreakoutRoomBannerTitle,
primaryButtonLabel: locale.strings.call.returnFromBreakoutRoomBannerButtonLabel
}, onClickButton: () => adapter.returnFromBreakoutRoom(), iconProps: { iconName: 'NotificationBarBreakoutRoomClosingSoon' } })));
}
return null;
};
//# sourceMappingURL=BreakoutRoomsBanner.js.map