@azure/communication-react
Version:
React library for building modern communication user experiences utilizing Azure Communication Services
34 lines • 2.07 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import React from 'react';
import { mergeStyles, Stack, Text } from '@fluentui/react';
import { containerStyle, moreDetailsStyles, containerItemGap, titleStyles, rejoinCallButtonContainerStyles } from '../styles/NoticePage.styles';
import { useAdapter } from '../adapter/CallAdapterProvider';
import { StartCallButton } from '../components/StartCallButton';
import { CallCompositeIcon } from '../../common/icons';
import { useSelector } from '../hooks/useSelector';
import { getTargetCallees } from '../selectors/baseSelectors';
/**
* Generic page with a title and more details text for serving up a notice to the user.
*
* @private
*/
export function NoticePage(props) {
const adapter = useAdapter();
const callees = useSelector(getTargetCallees);
return React.createElement(Stack, { className: mergeStyles(props.pageStyle), verticalFill: true, verticalAlign: "center", horizontalAlign: "center", "data-ui-id": props.dataUiId, "aria-atomic": true },
React.createElement(Stack, { className: mergeStyles(containerStyle), tokens: containerItemGap },
props.iconName && React.createElement(CallCompositeIcon, { iconName: props.iconName }),
React.createElement(Text, { className: mergeStyles(titleStyles), "aria-live": "assertive", role: "alert" }, props.title),
React.createElement(Text, { className: mergeStyles(moreDetailsStyles), "aria-live": "assertive" }, props.moreDetails),
!props.disableStartCallButton && React.createElement(Stack, { styles: rejoinCallButtonContainerStyles },
React.createElement(StartCallButton, { onClick: () => {
if (callees && callees.length > 0) {
adapter.startCall(callees);
}
else {
adapter.joinCall();
}
}, disabled: false, rejoinCall: true, autoFocus: true }))));
}
//# sourceMappingURL=NoticePage.js.map