jiti-meet/react/features/notifications/components/web/NotificationsContainer.js

100 lines
2.5 KiB
JavaScript
Raw Normal View History

2018-06-14 09:14:32 +00:00
// @flow
import { FlagGroup } from '@atlaskit/flag';
2018-06-14 09:14:32 +00:00
import React from 'react';
2019-03-21 16:38:29 +00:00
2019-03-27 14:00:10 +00:00
import { connect } from '../../../base/redux';
2018-06-14 09:14:32 +00:00
import AbstractNotificationsContainer, {
_abstractMapStateToProps,
type Props as AbstractProps
2019-03-27 14:00:10 +00:00
} from '../AbstractNotificationsContainer';
2018-06-14 09:14:32 +00:00
import Notification from './Notification';
type Props = AbstractProps & {
/**
* Whether we are a SIP gateway or not.
*/
_iAmSipGateway: boolean
};
/**
* Implements a React {@link Component} which displays notifications and handles
* automatic dismissmal after a notification is shown for a defined timeout
* period.
*
* @extends {Component}
*/
2018-06-14 09:14:32 +00:00
class NotificationsContainer extends AbstractNotificationsContainer<Props> {
/**
* Implements React's {@link Component#render()}.
*
* @inheritdoc
* @returns {ReactElement}
*/
render() {
if (this.props._iAmSipGateway) {
return null;
}
return (
2021-01-14 16:12:08 +00:00
<FlagGroup
id = 'notifications-container'
onDismissed = { this._onDismissed }>
{ this._renderFlags() }
</FlagGroup>
);
}
2018-06-14 09:14:32 +00:00
_onDismissed: number => void;
/**
* Renders notifications to display as ReactElements. An empty array will
* be returned if notifications are disabled.
*
* @private
* @returns {ReactElement[]}
*/
_renderFlags() {
2018-06-14 09:14:32 +00:00
const { _notifications } = this.props;
return _notifications.map(notification => {
const { props, uid } = notification;
// The id attribute is necessary as {@code FlagGroup} looks for
// either id or key to set a key on notifications, but accessing
// props.key will cause React to print an error.
return (
<Notification
{ ...props }
id = { uid }
key = { uid }
2021-01-14 16:12:08 +00:00
onDismissed = { this._onDismissed }
uid = { uid } />
);
});
}
}
/**
* Maps (parts of) the Redux state to the associated props for this component.
*
* @param {Object} state - The Redux state.
* @private
* @returns {Props}
*/
function _mapStateToProps(state) {
const { iAmSipGateway } = state['features/base/config'];
return {
..._abstractMapStateToProps(state),
_iAmSipGateway: Boolean(iAmSipGateway)
};
}
export default connect(_mapStateToProps)(NotificationsContainer);