您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

NotificationsContainer.js 2.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. // @flow
  2. import { FlagGroup } from '@atlaskit/flag';
  3. import React from 'react';
  4. import { connect } from '../../../base/redux';
  5. import AbstractNotificationsContainer, {
  6. _abstractMapStateToProps,
  7. type Props as AbstractProps
  8. } from '../AbstractNotificationsContainer';
  9. import Notification from './Notification';
  10. type Props = AbstractProps & {
  11. /**
  12. * Whther we are a SIP gateway or not.
  13. */
  14. _iAmSipGateway: boolean
  15. };
  16. /**
  17. * Implements a React {@link Component} which displays notifications and handles
  18. * automatic dismissmal after a notification is shown for a defined timeout
  19. * period.
  20. *
  21. * @extends {Component}
  22. */
  23. class NotificationsContainer extends AbstractNotificationsContainer<Props> {
  24. /**
  25. * Implements React's {@link Component#render()}.
  26. *
  27. * @inheritdoc
  28. * @returns {ReactElement}
  29. */
  30. render() {
  31. if (this.props._iAmSipGateway) {
  32. return null;
  33. }
  34. return (
  35. <FlagGroup onDismissed = { this._onDismissed }>
  36. { this._renderFlags() }
  37. </FlagGroup>
  38. );
  39. }
  40. _onDismissed: number => void;
  41. /**
  42. * Renders notifications to display as ReactElements. An empty array will
  43. * be returned if notifications are disabled.
  44. *
  45. * @private
  46. * @returns {ReactElement[]}
  47. */
  48. _renderFlags() {
  49. const { _notifications } = this.props;
  50. return _notifications.map(notification => {
  51. const { props, uid } = notification;
  52. // The id attribute is necessary as {@code FlagGroup} looks for
  53. // either id or key to set a key on notifications, but accessing
  54. // props.key will cause React to print an error.
  55. return (
  56. <Notification
  57. { ...props }
  58. id = { uid }
  59. key = { uid }
  60. uid = { uid } />
  61. );
  62. });
  63. }
  64. }
  65. /**
  66. * Maps (parts of) the Redux state to the associated props for this component.
  67. *
  68. * @param {Object} state - The Redux state.
  69. * @private
  70. * @returns {Props}
  71. */
  72. function _mapStateToProps(state) {
  73. const { iAmSipGateway } = state['features/base/config'];
  74. return {
  75. ..._abstractMapStateToProps(state),
  76. _iAmSipGateway: Boolean(iAmSipGateway)
  77. };
  78. }
  79. export default connect(_mapStateToProps)(NotificationsContainer);