diff --git a/react/features/overlay/actionTypes.js b/react/features/overlay/actionTypes.js index c62e4d3d01..3712b08536 100644 --- a/react/features/overlay/actionTypes.js +++ b/react/features/overlay/actionTypes.js @@ -1,3 +1,5 @@ +// @flow + /** * The type of the Redux action which signals that the prompt for media * permission is visible or not. diff --git a/react/features/overlay/actions.js b/react/features/overlay/actions.js index ea69b69895..3a894f9361 100644 --- a/react/features/overlay/actions.js +++ b/react/features/overlay/actions.js @@ -1,3 +1,5 @@ +// @flow + import { MEDIA_PERMISSION_PROMPT_VISIBILITY_CHANGED, SET_FATAL_ERROR, @@ -17,7 +19,7 @@ import { * isVisible: {boolean} * }} */ -export function mediaPermissionPromptVisibilityChanged(isVisible, browser) { +export function mediaPermissionPromptVisibilityChanged(isVisible: boolean, browser: string) { return { type: MEDIA_PERMISSION_PROMPT_VISIBILITY_CHANGED, browser, @@ -51,7 +53,7 @@ export function suspendDetected() { * fatalError: ?Error * }} */ -export function setFatalError(fatalError) { +export function setFatalError(fatalError: Object) { return { type: SET_FATAL_ERROR, fatalError diff --git a/react/features/overlay/components/AbstractPageReloadOverlay.js b/react/features/overlay/components/AbstractPageReloadOverlay.js index 6a71f780af..5575ab87f6 100644 --- a/react/features/overlay/components/AbstractPageReloadOverlay.js +++ b/react/features/overlay/components/AbstractPageReloadOverlay.js @@ -14,7 +14,7 @@ import { isFatalJitsiConnectionError } from '../../base/lib-jitsi-meet'; -import ReloadButton from './ReloadButton'; +import ReloadButton from './web/ReloadButton'; declare var APP: Object; @@ -82,6 +82,8 @@ type State = { /** * Implements an abstract React {@link Component} for the page reload overlays. + * + * FIXME: This is not really an abstract class as some components and functions are very web specific. */ export default class AbstractPageReloadOverlay extends Component { diff --git a/react/features/overlay/components/_.native.js b/react/features/overlay/components/_.native.js new file mode 100644 index 0000000000..a32ec60612 --- /dev/null +++ b/react/features/overlay/components/_.native.js @@ -0,0 +1,3 @@ +// @flow + +export * from './native'; diff --git a/react/features/overlay/components/_.web.js b/react/features/overlay/components/_.web.js new file mode 100644 index 0000000000..40d5f46528 --- /dev/null +++ b/react/features/overlay/components/_.web.js @@ -0,0 +1,3 @@ +// @flow + +export * from './web'; diff --git a/react/features/overlay/components/index.js b/react/features/overlay/components/index.js index 108ee99e93..32ec6de9e2 100644 --- a/react/features/overlay/components/index.js +++ b/react/features/overlay/components/index.js @@ -1,15 +1,4 @@ +// @flow + export { default as OverlayContainer } from './OverlayContainer'; -export { - default as PageReloadFilmstripOnlyOverlay -} from './PageReloadFilmstripOnlyOverlay'; -export { default as PageReloadOverlay } from './PageReloadOverlay'; -export { - default as SuspendedFilmstripOnlyOverlay -} from './SuspendedFilmstripOnlyOverlay'; -export { default as SuspendedOverlay } from './SuspendedOverlay'; -export { - default as UserMediaPermissionsFilmstripOnlyOverlay -} from './UserMediaPermissionsFilmstripOnlyOverlay'; -export { - default as UserMediaPermissionsOverlay -} from './UserMediaPermissionsOverlay'; +export * from './_'; diff --git a/react/features/overlay/components/OverlayFrame.native.js b/react/features/overlay/components/native/OverlayFrame.js similarity index 100% rename from react/features/overlay/components/OverlayFrame.native.js rename to react/features/overlay/components/native/OverlayFrame.js diff --git a/react/features/overlay/components/PageReloadOverlay.native.js b/react/features/overlay/components/native/PageReloadOverlay.js similarity index 87% rename from react/features/overlay/components/PageReloadOverlay.native.js rename to react/features/overlay/components/native/PageReloadOverlay.js index e040bcae37..01c37347a0 100644 --- a/react/features/overlay/components/PageReloadOverlay.native.js +++ b/react/features/overlay/components/native/PageReloadOverlay.js @@ -3,18 +3,20 @@ import React from 'react'; import { Text } from 'react-native'; -import { appNavigate, reloadNow } from '../../app'; -import { ColorSchemeRegistry } from '../../base/color-scheme'; -import { ConfirmDialog } from '../../base/dialog'; -import { translate } from '../../base/i18n'; -import { connect } from '../../base/redux'; -import { StyleType } from '../../base/styles'; +import { appNavigate, reloadNow } from '../../../app'; +import { ColorSchemeRegistry } from '../../../base/color-scheme'; +import { ConfirmDialog } from '../../../base/dialog'; +import { translate } from '../../../base/i18n'; +import { connect } from '../../../base/redux'; +import { StyleType } from '../../../base/styles'; + +import { setFatalError } from '../../actions'; import AbstractPageReloadOverlay, { abstractMapStateToProps, type Props as AbstractProps -} from './AbstractPageReloadOverlay'; -import { setFatalError } from '../actions'; +} from '../AbstractPageReloadOverlay'; + import OverlayFrame from './OverlayFrame'; type Props = AbstractProps & { diff --git a/react/features/overlay/components/native/index.js b/react/features/overlay/components/native/index.js new file mode 100644 index 0000000000..82f341f3d5 --- /dev/null +++ b/react/features/overlay/components/native/index.js @@ -0,0 +1,4 @@ +// @flow + +export { default as OverlayFrame } from './OverlayFrame'; +export { default as PageReloadOverlay } from './PageReloadOverlay'; diff --git a/react/features/overlay/components/styles.js b/react/features/overlay/components/native/styles.js similarity index 86% rename from react/features/overlay/components/styles.js rename to react/features/overlay/components/native/styles.js index 4903f89a29..3016c73f17 100644 --- a/react/features/overlay/components/styles.js +++ b/react/features/overlay/components/native/styles.js @@ -1,6 +1,8 @@ +// @flow + import { StyleSheet } from 'react-native'; -import { ColorPalette, createStyleSheet } from '../../base/styles'; +import { ColorPalette } from '../../../base/styles'; /** * The React {@code Component} styles of {@code OverlayFrame}. diff --git a/react/features/overlay/components/AbstractSuspendedOverlay.js b/react/features/overlay/components/web/AbstractSuspendedOverlay.js similarity index 98% rename from react/features/overlay/components/AbstractSuspendedOverlay.js rename to react/features/overlay/components/web/AbstractSuspendedOverlay.js index 4b89119026..2570696d90 100644 --- a/react/features/overlay/components/AbstractSuspendedOverlay.js +++ b/react/features/overlay/components/web/AbstractSuspendedOverlay.js @@ -1,4 +1,4 @@ -/* @flow */ +// @flow import { Component } from 'react'; diff --git a/react/features/overlay/components/AbstractUserMediaPermissionsOverlay.js b/react/features/overlay/components/web/AbstractUserMediaPermissionsOverlay.js similarity index 99% rename from react/features/overlay/components/AbstractUserMediaPermissionsOverlay.js rename to react/features/overlay/components/web/AbstractUserMediaPermissionsOverlay.js index 95242bf8f4..4b8ae9cc80 100644 --- a/react/features/overlay/components/AbstractUserMediaPermissionsOverlay.js +++ b/react/features/overlay/components/web/AbstractUserMediaPermissionsOverlay.js @@ -1,4 +1,4 @@ -/* @flow */ +// @flow import { Component } from 'react'; diff --git a/react/features/overlay/components/FilmstripOnlyOverlayFrame.js b/react/features/overlay/components/web/FilmstripOnlyOverlayFrame.js similarity index 97% rename from react/features/overlay/components/FilmstripOnlyOverlayFrame.js rename to react/features/overlay/components/web/FilmstripOnlyOverlayFrame.js index fe1a9635bc..978ec51d4f 100644 --- a/react/features/overlay/components/FilmstripOnlyOverlayFrame.js +++ b/react/features/overlay/components/web/FilmstripOnlyOverlayFrame.js @@ -6,8 +6,8 @@ import { Avatar, getAvatarURL, getLocalParticipant -} from '../../base/participants'; -import { connect } from '../../base/redux'; +} from '../../../base/participants'; +import { connect } from '../../../base/redux'; import OverlayFrame from './OverlayFrame'; diff --git a/react/features/overlay/components/OverlayFrame.web.js b/react/features/overlay/components/web/OverlayFrame.js similarity index 99% rename from react/features/overlay/components/OverlayFrame.web.js rename to react/features/overlay/components/web/OverlayFrame.js index 97459a36f6..715c38067c 100644 --- a/react/features/overlay/components/OverlayFrame.web.js +++ b/react/features/overlay/components/web/OverlayFrame.js @@ -1,4 +1,4 @@ -/* @flow */ +// @flow import React, { Component } from 'react'; diff --git a/react/features/overlay/components/PageReloadFilmstripOnlyOverlay.js b/react/features/overlay/components/web/PageReloadFilmstripOnlyOverlay.js similarity index 78% rename from react/features/overlay/components/PageReloadFilmstripOnlyOverlay.js rename to react/features/overlay/components/web/PageReloadFilmstripOnlyOverlay.js index 344156ef92..19e6fc4a76 100644 --- a/react/features/overlay/components/PageReloadFilmstripOnlyOverlay.js +++ b/react/features/overlay/components/web/PageReloadFilmstripOnlyOverlay.js @@ -1,10 +1,13 @@ +// @flow + import React from 'react'; -import { translate } from '../../base/i18n'; -import { connect } from '../../base/redux'; +import { translate } from '../../../base/i18n'; +import { connect } from '../../../base/redux'; + +import AbstractPageReloadOverlay, { type Props, abstractMapStateToProps } + from '../AbstractPageReloadOverlay'; -import AbstractPageReloadOverlay, { abstractMapStateToProps } - from './AbstractPageReloadOverlay'; import FilmstripOnlyOverlayFrame from './FilmstripOnlyOverlayFrame'; /** @@ -12,7 +15,7 @@ import FilmstripOnlyOverlayFrame from './FilmstripOnlyOverlayFrame'; * mode. Shown before the conference is reloaded. Shows a warning message and * counts down towards the reload. */ -class PageReloadFilmstripOnlyOverlay extends AbstractPageReloadOverlay { +class PageReloadFilmstripOnlyOverlay extends AbstractPageReloadOverlay { /** * Implements React's {@link Component#render()}. * @@ -38,6 +41,10 @@ class PageReloadFilmstripOnlyOverlay extends AbstractPageReloadOverlay { ); } + + _renderButton: () => React$Element<*> | null + + _renderProgressBar: () => React$Element<*> | null } export default translate( diff --git a/react/features/overlay/components/PageReloadOverlay.web.js b/react/features/overlay/components/web/PageReloadOverlay.js similarity index 91% rename from react/features/overlay/components/PageReloadOverlay.web.js rename to react/features/overlay/components/web/PageReloadOverlay.js index 817d1caaaa..2e6941445a 100644 --- a/react/features/overlay/components/PageReloadOverlay.web.js +++ b/react/features/overlay/components/web/PageReloadOverlay.js @@ -2,13 +2,14 @@ import React from 'react'; -import { translate } from '../../base/i18n'; -import { connect } from '../../base/redux'; +import { translate } from '../../../base/i18n'; +import { connect } from '../../../base/redux'; import AbstractPageReloadOverlay, { abstractMapStateToProps, type Props -} from './AbstractPageReloadOverlay'; +} from '../AbstractPageReloadOverlay'; + import OverlayFrame from './OverlayFrame'; /** diff --git a/react/features/overlay/components/ReloadButton.js b/react/features/overlay/components/web/ReloadButton.js similarity index 91% rename from react/features/overlay/components/ReloadButton.js rename to react/features/overlay/components/web/ReloadButton.js index c10bb30986..58bdf96f80 100644 --- a/react/features/overlay/components/ReloadButton.js +++ b/react/features/overlay/components/web/ReloadButton.js @@ -1,10 +1,10 @@ -/* @flow */ +// @flow import React, { Component } from 'react'; -import { reloadNow } from '../../app'; -import { translate } from '../../base/i18n'; -import { connect } from '../../base/redux'; +import { reloadNow } from '../../../app'; +import { translate } from '../../../base/i18n'; +import { connect } from '../../../base/redux'; /** * The type of the React {@code Component} props of {@link ReloadButton}. diff --git a/react/features/overlay/components/SuspendedFilmstripOnlyOverlay.js b/react/features/overlay/components/web/SuspendedFilmstripOnlyOverlay.js similarity index 94% rename from react/features/overlay/components/SuspendedFilmstripOnlyOverlay.js rename to react/features/overlay/components/web/SuspendedFilmstripOnlyOverlay.js index ec0c0a7845..bb009f2005 100644 --- a/react/features/overlay/components/SuspendedFilmstripOnlyOverlay.js +++ b/react/features/overlay/components/web/SuspendedFilmstripOnlyOverlay.js @@ -1,6 +1,8 @@ +// @flow + import React from 'react'; -import { translate, translateToHTML } from '../../base/i18n'; +import { translate, translateToHTML } from '../../../base/i18n'; import AbstractSuspendedOverlay from './AbstractSuspendedOverlay'; import FilmstripOnlyOverlayFrame from './FilmstripOnlyOverlayFrame'; diff --git a/react/features/overlay/components/SuspendedOverlay.js b/react/features/overlay/components/web/SuspendedOverlay.js similarity index 94% rename from react/features/overlay/components/SuspendedOverlay.js rename to react/features/overlay/components/web/SuspendedOverlay.js index a236eab8c6..28b12cac6a 100644 --- a/react/features/overlay/components/SuspendedOverlay.js +++ b/react/features/overlay/components/web/SuspendedOverlay.js @@ -1,6 +1,8 @@ +// @flow + import React from 'react'; -import { translate, translateToHTML } from '../../base/i18n'; +import { translate, translateToHTML } from '../../../base/i18n'; import AbstractSuspendedOverlay from './AbstractSuspendedOverlay'; import OverlayFrame from './OverlayFrame'; diff --git a/react/features/overlay/components/UserMediaPermissionsFilmstripOnlyOverlay.js b/react/features/overlay/components/web/UserMediaPermissionsFilmstripOnlyOverlay.js similarity index 92% rename from react/features/overlay/components/UserMediaPermissionsFilmstripOnlyOverlay.js rename to react/features/overlay/components/web/UserMediaPermissionsFilmstripOnlyOverlay.js index e2032ee8d3..f96c644040 100644 --- a/react/features/overlay/components/UserMediaPermissionsFilmstripOnlyOverlay.js +++ b/react/features/overlay/components/web/UserMediaPermissionsFilmstripOnlyOverlay.js @@ -1,7 +1,9 @@ +// @flow + import React from 'react'; -import { translate, translateToHTML } from '../../base/i18n'; -import { connect } from '../../base/redux'; +import { translate, translateToHTML } from '../../../base/i18n'; +import { connect } from '../../../base/redux'; import AbstractUserMediaPermissionsOverlay, { abstractMapStateToProps } from './AbstractUserMediaPermissionsOverlay'; diff --git a/react/features/overlay/components/UserMediaPermissionsOverlay.js b/react/features/overlay/components/web/UserMediaPermissionsOverlay.js similarity index 76% rename from react/features/overlay/components/UserMediaPermissionsOverlay.js rename to react/features/overlay/components/web/UserMediaPermissionsOverlay.js index 4a87c054e3..79c8402387 100644 --- a/react/features/overlay/components/UserMediaPermissionsOverlay.js +++ b/react/features/overlay/components/web/UserMediaPermissionsOverlay.js @@ -1,39 +1,21 @@ -/* global interfaceConfig */ +// @flow import React from 'react'; -import { translate, translateToHTML } from '../../base/i18n'; -import { connect } from '../../base/redux'; +import { translate, translateToHTML } from '../../../base/i18n'; +import { connect } from '../../../base/redux'; import AbstractUserMediaPermissionsOverlay, { abstractMapStateToProps } from './AbstractUserMediaPermissionsOverlay'; import OverlayFrame from './OverlayFrame'; +declare var interfaceConfig: Object; + /** * Implements a React Component for overlay with guidance how to proceed with * gUM prompt. */ class UserMediaPermissionsOverlay extends AbstractUserMediaPermissionsOverlay { - /** - * Initializes a new UserMediaPermissionsOverlay instance. - * - * @param {Object} props - The read-only properties with which the new - * instance is to be initialized. - * @public - */ - constructor(props) { - super(props); - - this.state = { - /** - * The src value of the image for the policy logo. - * - * @type {string} - */ - policyLogoSrc: interfaceConfig.POLICY_LOGO - }; - } - /** * Implements React's {@link Component#render()}. * @@ -80,7 +62,7 @@ class UserMediaPermissionsOverlay extends AbstractUserMediaPermissionsOverlay { * @returns {ReactElement|null} */ _renderPolicyLogo() { - const { policyLogoSrc } = this.state; + const policyLogoSrc = interfaceConfig.POLICY_LOGO; if (policyLogoSrc) { return ( diff --git a/react/features/overlay/components/web/index.js b/react/features/overlay/components/web/index.js new file mode 100644 index 0000000000..9bbfd09b72 --- /dev/null +++ b/react/features/overlay/components/web/index.js @@ -0,0 +1,19 @@ +// @flow + +export { default as FilmstripOnlyOverlayFrame } from './FilmstripOnlyOverlayFrame'; +export { default as OverlayFrame } from './OverlayFrame'; + +export { + default as PageReloadFilmstripOnlyOverlay +} from './PageReloadFilmstripOnlyOverlay'; +export { default as PageReloadOverlay } from './PageReloadOverlay'; +export { + default as SuspendedFilmstripOnlyOverlay +} from './SuspendedFilmstripOnlyOverlay'; +export { default as SuspendedOverlay } from './SuspendedOverlay'; +export { + default as UserMediaPermissionsFilmstripOnlyOverlay +} from './UserMediaPermissionsFilmstripOnlyOverlay'; +export { + default as UserMediaPermissionsOverlay +} from './UserMediaPermissionsOverlay'; diff --git a/react/features/overlay/index.js b/react/features/overlay/index.js index 3354f4deb3..ff4db602c3 100644 --- a/react/features/overlay/index.js +++ b/react/features/overlay/index.js @@ -1,3 +1,5 @@ +// @flow + export * from './actions'; export * from './components'; export * from './functions';