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

OverlayContainer.js 4.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141
  1. // @flow
  2. import React, { Component } from 'react';
  3. import { connect } from 'react-redux';
  4. import PageReloadFilmstripOnlyOverlay from './PageReloadFilmstripOnlyOverlay';
  5. import PageReloadOverlay from './PageReloadOverlay';
  6. import SuspendedFilmstripOnlyOverlay from './SuspendedFilmstripOnlyOverlay';
  7. import SuspendedOverlay from './SuspendedOverlay';
  8. import UserMediaPermissionsFilmstripOnlyOverlay
  9. from './UserMediaPermissionsFilmstripOnlyOverlay';
  10. import UserMediaPermissionsOverlay from './UserMediaPermissionsOverlay';
  11. declare var interfaceConfig: Object;
  12. /**
  13. * The lazily-initialized list of overlay React {@link Component} types used The
  14. * user interface is filmstrip-only.
  15. *
  16. * XXX The value is meant to be compile-time defined so it does not contradict
  17. * our coding style to not have global values that are runtime defined and
  18. * merely works around side effects of circular imports.
  19. *
  20. * @type Array
  21. */
  22. let _filmstripOnlyOverlays;
  23. /**
  24. * The lazily-initialized list of overlay React {@link Component} types used The
  25. * user interface is not filmstrip-only.
  26. *
  27. * XXX The value is meant to be compile-time defined so it does not contradict
  28. * our coding style to not have global values that are runtime defined and
  29. * merely works around side effects of circular imports.
  30. *
  31. * @type Array
  32. */
  33. let _nonFilmstripOnlyOverlays;
  34. /**
  35. * The type of the React {@link Component} props of {@code OverlayContainer}.
  36. */
  37. type Props = {
  38. /**
  39. * The React {@link Component} type of overlay to be rendered by the
  40. * associated {@code OverlayContainer}.
  41. */
  42. overlay: ?React$ComponentType<*>
  43. }
  44. /**
  45. * Implements a React {@link Component} that will display the correct overlay
  46. * when needed.
  47. */
  48. class OverlayContainer extends Component<Props> {
  49. /**
  50. * Implements React's {@link Component#render()}.
  51. *
  52. * @inheritdoc
  53. * @public
  54. * @returns {ReactElement|null}
  55. */
  56. render() {
  57. const { overlay } = this.props;
  58. return overlay ? React.createElement(overlay, {}) : null;
  59. }
  60. }
  61. /**
  62. * Returns the list of overlay React {@link Component} types to be rendered by
  63. * {@code OverlayContainer}. The list is lazily initialized the first time it is
  64. * required in order to works around side effects of circular imports.
  65. *
  66. * @param {boolean} filmstripOnly - The indicator which determines whether the
  67. * user interface is filmstrip-only.
  68. * @returns {Array} The list of overlay React {@code Component} types to be
  69. * rendered by {@code OverlayContainer}.
  70. */
  71. function _getOverlays(filmstripOnly) {
  72. let overlays;
  73. if (filmstripOnly) {
  74. if (!(overlays = _filmstripOnlyOverlays)) {
  75. overlays = _filmstripOnlyOverlays = [
  76. PageReloadFilmstripOnlyOverlay,
  77. SuspendedFilmstripOnlyOverlay,
  78. UserMediaPermissionsFilmstripOnlyOverlay
  79. ];
  80. }
  81. } else if (!(overlays = _nonFilmstripOnlyOverlays)) {
  82. overlays = _nonFilmstripOnlyOverlays = [
  83. PageReloadOverlay,
  84. SuspendedOverlay,
  85. UserMediaPermissionsOverlay
  86. ];
  87. }
  88. return overlays;
  89. }
  90. /**
  91. * Maps (parts of) the redux state to the associated {@code OverlayContainer}'s
  92. * props.
  93. *
  94. * @param {Object} state - The redux state.
  95. * @private
  96. * @returns {{
  97. * overlay: ?Object
  98. * }}
  99. */
  100. function _mapStateToProps(state) {
  101. // XXX In the future interfaceConfig is expected to not be a global variable
  102. // but a redux state like config. Hence, the variable filmStripOnly
  103. // naturally belongs here in preparation for the future.
  104. const filmstripOnly
  105. = typeof interfaceConfig === 'object' && interfaceConfig.filmStripOnly;
  106. let overlay;
  107. for (const o of _getOverlays(filmstripOnly)) {
  108. // react-i18n / react-redux wrap components and thus we cannot access
  109. // the wrapped component's static methods directly.
  110. const component = o.WrappedComponent || o;
  111. if (component.needsRender(state)) {
  112. overlay = o;
  113. break;
  114. }
  115. }
  116. return {
  117. /**
  118. * The React {@link Component} type of overlay to be rendered by the
  119. * associated {@code OverlayContainer}.
  120. */
  121. overlay
  122. };
  123. }
  124. export default connect(_mapStateToProps)(OverlayContainer);