You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

PageReloadOverlay.js 1.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. import React from 'react';
  2. import { translate } from '../../base/i18n';
  3. import AbstractPageReloadOverlay from './AbstractPageReloadOverlay';
  4. import OverlayFrame from './OverlayFrame';
  5. /**
  6. * Implements a React Component for page reload overlay. Shown before the
  7. * conference is reloaded. Shows a warning message and counts down towards the
  8. * reload.
  9. */
  10. class PageReloadOverlay extends AbstractPageReloadOverlay {
  11. /**
  12. * Implements React's {@link Component#render()}.
  13. *
  14. * @inheritdoc
  15. * @returns {ReactElement|null}
  16. */
  17. render() {
  18. const { isNetworkFailure, t } = this.props;
  19. const { message, timeLeft, title } = this.state;
  20. return (
  21. <OverlayFrame isLightOverlay = { isNetworkFailure }>
  22. <div className = 'inlay'>
  23. <span
  24. className = 'reload_overlay_title'>
  25. { t(title) }
  26. </span>
  27. <span className = 'reload_overlay_text'>
  28. { t(message, { seconds: timeLeft }) }
  29. </span>
  30. { this._renderProgressBar() }
  31. { this._renderButton() }
  32. </div>
  33. </OverlayFrame>
  34. );
  35. }
  36. }
  37. export default translate(PageReloadOverlay);