38629b437d
Do the selection in mapStateToProps so the container itself doesn't need to receive all the props that each overlay needs. Each overlay is responsible for fetching their own props and for providing a "needsDisplay" static method wich will be called with the full redux state and should return true if the overlay needs displaying. Also eliminate duplicated state keeping: the connection and conference error states can be fetched from their respective base features.
45 lines
1.4 KiB
JavaScript
45 lines
1.4 KiB
JavaScript
import React from 'react';
|
|
import { connect } from 'react-redux';
|
|
|
|
import { translate } from '../../base/i18n';
|
|
|
|
import AbstractPageReloadOverlay, { abstractMapStateToProps }
|
|
from './AbstractPageReloadOverlay';
|
|
import OverlayFrame from './OverlayFrame';
|
|
|
|
/**
|
|
* Implements a React Component for page reload overlay. Shown before the
|
|
* conference is reloaded. Shows a warning message and counts down towards the
|
|
* reload.
|
|
*/
|
|
class PageReloadOverlay extends AbstractPageReloadOverlay {
|
|
/**
|
|
* Implements React's {@link Component#render()}.
|
|
*
|
|
* @inheritdoc
|
|
* @returns {ReactElement}
|
|
*/
|
|
render() {
|
|
const { isNetworkFailure, t } = this.props;
|
|
const { message, timeLeft, title } = this.state;
|
|
|
|
return (
|
|
<OverlayFrame isLightOverlay = { isNetworkFailure }>
|
|
<div className = 'inlay'>
|
|
<span
|
|
className = 'reload_overlay_title'>
|
|
{ t(title) }
|
|
</span>
|
|
<span className = 'reload_overlay_text'>
|
|
{ t(message, { seconds: timeLeft }) }
|
|
</span>
|
|
{ this._renderProgressBar() }
|
|
{ this._renderButton() }
|
|
</div>
|
|
</OverlayFrame>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default translate(connect(abstractMapStateToProps)(PageReloadOverlay));
|