diff --git a/react/features/base/conference/middleware.js b/react/features/base/conference/middleware.js index 2c42f2b16..bd61aaae4 100644 --- a/react/features/base/conference/middleware.js +++ b/react/features/base/conference/middleware.js @@ -113,7 +113,7 @@ function _pinParticipant(store, next, action) { pin = !localParticipant || !localParticipant.pinned; } if (pin) { - const conference = state['features/base/conference'].conference; + const { conference } = state['features/base/conference']; try { conference.pinParticipant(id); diff --git a/react/features/conference/route.js b/react/features/conference/route.js index cd22a3d46..096517132 100644 --- a/react/features/conference/route.js +++ b/react/features/conference/route.js @@ -23,10 +23,10 @@ RouteRegistry.register({ }); /** - * Initialization of the app. + * Initialization of the app. * - * @private - * @returns {void} + * @private + * @returns {void} */ function _initConference() { _setTokenData(); @@ -79,7 +79,9 @@ function _obtainConfigAndInit() { .catch(err => { // Show obtain config error. APP.UI.messageHandler.openReportDialog( - null, 'dialog.connectError', err); + null, + 'dialog.connectError', + err); }); } else { chooseBOSHAddress(config, room); @@ -112,9 +114,7 @@ function _setTokenData() { const { caller } = state['features/jwt']; if (caller) { - const email = caller.email; - const avatarUrl = caller.avatarUrl; - const name = caller.name; + const { avatarUrl, email, name } = caller; APP.settings.setEmail((email || '').trim(), true); APP.settings.setAvatarUrl((avatarUrl || '').trim()); diff --git a/react/features/invite/components/DialInNumbersForm.js b/react/features/invite/components/DialInNumbersForm.js index aaa5edf34..986c307a4 100644 --- a/react/features/invite/components/DialInNumbersForm.js +++ b/react/features/invite/components/DialInNumbersForm.js @@ -10,11 +10,9 @@ import { updateDialInNumbers } from '../actions'; const logger = require('jitsi-meet-logger').getLogger(__filename); -const EXPAND_ICON = ; - /** * React {@code Component} responsible for fetching and displaying telephone - * numbers for dialing into the conference. Also supports copying a selected + * numbers for dialing into a conference. Also supports copying a selected * dial-in number to the clipboard. * * @extends Component @@ -105,8 +103,10 @@ class DialInNumbersForm extends Component { * returns {void} */ componentWillMount() { - if (this.props._dialIn.numbers) { - this._setDefaultNumber(this.props._dialIn.numbers); + const { numbers } = this.props._dialIn; + + if (numbers) { + this._setDefaultNumber(numbers); } else { this.props.dispatch(updateDialInNumbers()); } @@ -209,7 +209,7 @@ class DialInNumbersForm extends Component { type = 'text' value = { triggerText || '' } /> - { EXPAND_ICON } + ); diff --git a/react/features/invite/components/InviteDialog.js b/react/features/invite/components/InviteDialog.js index 235decc92..f04bf227f 100644 --- a/react/features/invite/components/InviteDialog.js +++ b/react/features/invite/components/InviteDialog.js @@ -4,14 +4,11 @@ import { connect } from 'react-redux'; import { Dialog } from '../../base/dialog'; import { translate } from '../../base/i18n'; import JitsiMeetJS from '../../base/lib-jitsi-meet'; -import { - getLocalParticipant, - PARTICIPANT_ROLE -} from '../../base/participants'; +import { getLocalParticipant, PARTICIPANT_ROLE } from '../../base/participants'; +import DialInNumbersForm from './DialInNumbersForm'; import PasswordContainer from './PasswordContainer'; import ShareLinkForm from './ShareLinkForm'; -import DialInNumbersForm from './DialInNumbersForm'; /** * A React {@code Component} for displaying other components responsible for diff --git a/react/features/invite/reducer.js b/react/features/invite/reducer.js index 6cbf2c3ed..9195b9230 100644 --- a/react/features/invite/reducer.js +++ b/react/features/invite/reducer.js @@ -1,6 +1,4 @@ -import { - ReducerRegistry -} from '../base/redux'; +import { ReducerRegistry } from '../base/redux'; import { UPDATE_DIAL_IN_NUMBERS_FAILED, diff --git a/react/features/overlay/actions.js b/react/features/overlay/actions.js index 3e7fad350..35b35613c 100644 --- a/react/features/overlay/actions.js +++ b/react/features/overlay/actions.js @@ -9,12 +9,12 @@ import { * @param {boolean} isVisible - If the value is true - the prompt for media * permission is visible otherwise the value is false/undefined. * @param {string} browser - The name of the current browser. + * @public * @returns {{ * type: MEDIA_PERMISSION_PROMPT_VISIBILITY_CHANGED, * browser: {string}, * isVisible: {boolean} * }} - * @public */ export function mediaPermissionPromptVisibilityChanged(isVisible, browser) { return { @@ -27,10 +27,10 @@ export function mediaPermissionPromptVisibilityChanged(isVisible, browser) { /** * Signals that suspend was detected. * + * @public * @returns {{ * type: SUSPEND_DETECTED * }} - * @public */ export function suspendDetected() { return { diff --git a/react/features/overlay/components/AbstractPageReloadOverlay.js b/react/features/overlay/components/AbstractPageReloadOverlay.js index 759320e41..f6a7973bf 100644 --- a/react/features/overlay/components/AbstractPageReloadOverlay.js +++ b/react/features/overlay/components/AbstractPageReloadOverlay.js @@ -1,3 +1,5 @@ +/* @flow */ + import React, { Component } from 'react'; import { randomInt } from '../../base/util'; @@ -36,9 +38,51 @@ export default class AbstractPageReloadOverlay extends Component { * @public * @type {string} */ - reason: React.PropTypes.string + reason: React.PropTypes.string, + + /** + * The function to translate human-readable text. + * + * @public + * @type {Function} + */ + t: React.PropTypes.func }; + _interval: ?number + + state: { + + /** + * The translation key for the title of the overlay. + * + * @type {string} + */ + message: string, + + /** + * Current value(time) of the timer. + * + * @type {number} + */ + timeLeft: number, + + /** + * How long the overlay dialog will be displayed before the + * conference will be reloaded. + * + * @type {number} + */ + timeoutSeconds: number, + + /** + * The translation key for the title of the overlay. + * + * @type {string} + */ + title: string + } + /** * Initializes a new AbstractPageReloadOverlay instance. * @@ -46,7 +90,7 @@ export default class AbstractPageReloadOverlay extends Component { * instance is to be initialized. * @public */ - constructor(props) { + constructor(props: Object) { super(props); /** @@ -68,42 +112,87 @@ export default class AbstractPageReloadOverlay extends Component { } this.state = { - /** - * The translation key for the title of the overlay. - * - * @type {string} - */ message, - - /** - * Current value(time) of the timer. - * - * @type {number} - */ timeLeft: timeoutSeconds, - - /** - * How long the overlay dialog will be displayed before the - * conference will be reloaded. - * - * @type {number} - */ timeoutSeconds, - - /** - * The translation key for the title of the overlay. - * - * @type {string} - */ title }; } + /** + * React Component method that executes once component is mounted. + * + * @inheritdoc + * @returns {void} + */ + componentDidMount() { + // FIXME (CallStats - issue) This event will not make it to CallStats + // because the log queue is not flushed before "fabric terminated" is + // sent to the backed. + // FIXME: We should dispatch action for this. + APP.conference.logEvent( + 'page.reload', + /* value */ undefined, + /* label */ this.props.reason); + logger.info( + `The conference will be reloaded after ${ + this.state.timeoutSeconds} seconds.`); + + AJS.progressBars.update('#reloadProgressBar', 0); + + this._interval + = setInterval( + () => { + if (this.state.timeLeft === 0) { + if (this._interval) { + clearInterval(this._interval); + this._interval = undefined; + } + + reconnectNow(); + } else { + this.setState(prevState => { + return { + timeLeft: prevState.timeLeft - 1 + }; + }); + } + }, + 1000); + } + + /** + * React Component method that executes once component is updated. + * + * @inheritdoc + * @returns {void} + */ + componentDidUpdate() { + const { timeLeft, timeoutSeconds } = this.state; + + AJS.progressBars.update( + '#reloadProgressBar', + (timeoutSeconds - timeLeft) / timeoutSeconds); + } + + /** + * Clears the timer interval. + * + * @inheritdoc + * @returns {void} + */ + componentWillUnmount() { + if (this._interval) { + clearInterval(this._interval); + this._interval = undefined; + } + } + /** * Renders the button for relaod the page if necessary. * + * @protected * @returns {ReactElement|null} - * @private */ _renderButton() { if (this.props.isNetworkFailure) { @@ -118,8 +207,8 @@ export default class AbstractPageReloadOverlay extends Component { /** * Renders the progress bar. * - * @returns {ReactElement|null} * @protected + * @returns {ReactElement} */ _renderProgressBar() { return ( @@ -130,63 +219,4 @@ export default class AbstractPageReloadOverlay extends Component { ); } - - /** - * React Component method that executes once component is mounted. - * - * @inheritdoc - * @returns {void} - * @protected - */ - componentDidMount() { - // FIXME (CallStats - issue) This event will not make it to CallStats - // because the log queue is not flushed before "fabric terminated" is - // sent to the backed. - // FIXME: We should dispatch action for this. - APP.conference.logEvent( - 'page.reload', - /* value */ undefined, - /* label */ this.props.reason); - logger.info( - 'The conference will be reloaded after ' - + `${this.state.timeoutSeconds} seconds.`); - - AJS.progressBars.update('#reloadProgressBar', 0); - - this.intervalId = setInterval(() => { - if (this.state.timeLeft === 0) { - clearInterval(this.intervalId); - reconnectNow(); - } else { - this.setState(prevState => { - return { - timeLeft: prevState.timeLeft - 1 - }; - }); - } - }, 1000); - } - - /** - * React Component method that executes once component is updated. - * - * @inheritdoc - * @returns {void} - * @protected - */ - componentDidUpdate() { - AJS.progressBars.update('#reloadProgressBar', - (this.state.timeoutSeconds - this.state.timeLeft) - / this.state.timeoutSeconds); - } - - /** - * Clears the timer interval. - * - * @inheritdoc - * @returns {void} - */ - componentWillUnmount() { - clearInterval(this.intervalId); - } } diff --git a/react/features/overlay/components/PageReloadFilmstripOnlyOverlay.js b/react/features/overlay/components/PageReloadFilmstripOnlyOverlay.js index 20046074c..b77636a38 100644 --- a/react/features/overlay/components/PageReloadFilmstripOnlyOverlay.js +++ b/react/features/overlay/components/PageReloadFilmstripOnlyOverlay.js @@ -11,23 +11,6 @@ import FilmstripOnlyOverlayFrame from './FilmstripOnlyOverlayFrame'; * counts down towards the reload. */ class PageReloadFilmstripOnlyOverlay extends AbstractPageReloadOverlay { - /** - * PageReloadFilmstripOnlyOverlay component's property types. - * - * @static - */ - static propTypes = { - ...AbstractPageReloadOverlay.propTypes, - - /** - * The function to translate human-readable text. - * - * @public - * @type {Function} - */ - t: React.PropTypes.func - }; - /** * Implements React's {@link Component#render()}. * @@ -48,12 +31,8 @@ class PageReloadFilmstripOnlyOverlay extends AbstractPageReloadOverlay { { t(message, { seconds: timeLeft }) } - { - this._renderButton() - } - { - this._renderProgressBar() - } + { this._renderButton() } + { this._renderProgressBar() } ); } diff --git a/react/features/overlay/components/PageReloadOverlay.js b/react/features/overlay/components/PageReloadOverlay.js index f41f57561..e63586a32 100644 --- a/react/features/overlay/components/PageReloadOverlay.js +++ b/react/features/overlay/components/PageReloadOverlay.js @@ -11,23 +11,6 @@ import OverlayFrame from './OverlayFrame'; * reload. */ class PageReloadOverlay extends AbstractPageReloadOverlay { - /** - * PageReloadOverlay component's property types. - * - * @static - */ - static propTypes = { - ...AbstractPageReloadOverlay.propTypes, - - /** - * The function to translate human-readable text. - * - * @public - * @type {Function} - */ - t: React.PropTypes.func - }; - /** * Implements React's {@link Component#render()}. * diff --git a/react/features/overlay/components/ReloadButton.js b/react/features/overlay/components/ReloadButton.js index 095876f07..abf7a0b0d 100644 --- a/react/features/overlay/components/ReloadButton.js +++ b/react/features/overlay/components/ReloadButton.js @@ -34,8 +34,8 @@ class ReloadButton extends Component { /** * Renders the button for relaod the page if necessary. * - * @returns {ReactElement|null} * @private + * @returns {ReactElement} */ render() { const className @@ -54,6 +54,7 @@ class ReloadButton extends Component { /* eslint-enable react/jsx-handler-names */ } +} } diff --git a/react/features/overlay/components/SuspendedOverlay.js b/react/features/overlay/components/SuspendedOverlay.js index 8cc53b8d6..01cae6c17 100644 --- a/react/features/overlay/components/SuspendedOverlay.js +++ b/react/features/overlay/components/SuspendedOverlay.js @@ -48,8 +48,7 @@ class SuspendedOverlay extends Component { translateToHTML(t, 'suspendedoverlay.title') } - + ); diff --git a/react/features/toolbox/components/Toolbar.web.js b/react/features/toolbox/components/Toolbar.web.js index 4d836b4e3..6f61d212a 100644 --- a/react/features/toolbox/components/Toolbar.web.js +++ b/react/features/toolbox/components/Toolbar.web.js @@ -3,9 +3,7 @@ import React, { Component } from 'react'; import { connect } from 'react-redux'; -import { - setToolbarHovered -} from '../actions'; +import { setToolbarHovered } from '../actions'; import ToolbarButton from './ToolbarButton'; /** @@ -108,8 +106,8 @@ class Toolbar extends Component { * @param {Array} keyValuePair - Key value pair containing button and its * key. * @param {number} index - Index of the key value pair in the array. - * @returns {Array} Array of toolbar buttons and splitter if it's on. * @private + * @returns {Array} Array of toolbar buttons and splitter if it's on. */ _renderToolbarButton(acc: Array<*>, keyValuePair: Array<*>, index: number): Array> { @@ -153,8 +151,8 @@ class Toolbar extends Component { * Maps part of Redux actions to component's props. * * @param {Function} dispatch - Redux action dispatcher. - * @returns {Object} * @private + * @returns {Object} */ function _mapDispatchToProps(dispatch: Function): Object { return { @@ -180,4 +178,4 @@ function _mapDispatchToProps(dispatch: Function): Object { }; } -export default connect(null, _mapDispatchToProps)(Toolbar); +export default connect(undefined, _mapDispatchToProps)(Toolbar);