Reorg overlay feature files

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.

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

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<P: Props>
     extends Component<P, State> {

react/features/overlay/components/_.native.js

@@ -0,0 +1,3 @@
+// @flow
+
+export * from './native';

react/features/overlay/components/_.web.js

@@ -0,0 +1,3 @@
+// @flow
+
+export * from './web';

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 './_';

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 & {

react/features/overlay/components/native/index.js

@@ -0,0 +1,4 @@
+// @flow
+
+export { default as OverlayFrame } from './OverlayFrame';
+export { default as PageReloadOverlay } from './PageReloadOverlay';

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}.

react/features/overlay/components/web/AbstractSuspendedOverlay.js

@@ -1,4 +1,4 @@
-/* @flow */
+// @flow
 
 import { Component } from 'react';
 

react/features/overlay/components/web/AbstractUserMediaPermissionsOverlay.js

@@ -1,4 +1,4 @@
-/* @flow */
+// @flow
 
 import { Component } from 'react';
 

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';
 

react/features/overlay/components/web/OverlayFrame.js

@@ -1,4 +1,4 @@
-/* @flow */
+// @flow
 
 import React, { Component } from 'react';
 

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<Props> {
     /**
      * Implements React's {@link Component#render()}.
      *
@@ -38,6 +41,10 @@ class PageReloadFilmstripOnlyOverlay extends AbstractPageReloadOverlay {
             </FilmstripOnlyOverlayFrame>
         );
     }
+
+    _renderButton: () => React$Element<*> | null
+
+    _renderProgressBar: () => React$Element<*> | null
 }
 
 export default translate(

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';
 
 /**

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}.

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';

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';

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';

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 (

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';

react/features/overlay/index.js

@@ -1,3 +1,5 @@
+// @flow
+
 export * from './actions';
 export * from './components';
 export * from './functions';