flow: tame the beast

🔥🔥🔥

react/features/app/actions.js

@@ -31,7 +31,7 @@ declare var APP: Object;
  * @returns {Function}
  */
 export function appNavigate(uri: ?string) {
-    return (dispatch: Dispatch<*>, getState: Function) =>
+    return (dispatch: Dispatch<any>, getState: Function) =>
         _appNavigateToOptionalLocation(dispatch, getState, parseURIString(uri));
 }
 
@@ -50,7 +50,7 @@ export function appNavigate(uri: ?string) {
  * @returns {Promise<void>}
  */
 function _appNavigateToMandatoryLocation(
-        dispatch: Dispatch<*>, getState: Function,
+        dispatch: Dispatch<any>, getState: Function,
         newLocation: Object
 ): Promise<void> {
     const { room } = newLocation;
@@ -111,7 +111,7 @@ function _appNavigateToMandatoryLocation(
  * @returns {void}
  */
 function _appNavigateToOptionalLocation(
-        dispatch: Dispatch<*>, getState: Function,
+        dispatch: Dispatch<any>, getState: Function,
         location: Object) {
     // If the specified location (URI) does not identify a host, use the app's
     // default.
@@ -150,7 +150,7 @@ function _appNavigateToOptionalLocation(
  * @returns {Promise<Object>}
  */
 function _loadConfig(
-        dispatch: Dispatch<*>,
+        dispatch: Dispatch<any>,
         getState: Function,
         { contextRoot, host, protocol, room }) {
     // XXX As the mobile/React Native app does not employ config on the
@@ -211,7 +211,7 @@ function _loadConfig(
  * @returns {Function}
  */
 export function redirectWithStoredParams(pathname: string) {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const { locationURL } = getState()['features/base/connection'];
         const newLocationURL = new URL(locationURL.href);
 
@@ -248,7 +248,7 @@ export function reloadNow() {
  * @returns {Function}
  */
 export function reloadWithStoredParams() {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const { locationURL } = getState()['features/base/connection'];
         const windowLocation = window.location;
         const oldSearchString = windowLocation.search;

react/features/authentication/actions.js

@@ -1,5 +1,7 @@
 // @flow
 
+import type { Dispatch } from 'redux';
+
 import { appNavigate } from '../app';
 import { checkIfCanJoin, conferenceLeft } from '../base/conference';
 import { connectionFailed } from '../base/connection';
@@ -33,7 +35,7 @@ export function authenticateAndUpgradeRole(
         id: string,
         password: string,
         conference: Object) {
-    return (dispatch: Dispatch, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const { password: roomPassword }
             = getState()['features/base/conference'];
         const process
@@ -73,7 +75,7 @@ export function authenticateAndUpgradeRole(
  * }}
  */
 export function cancelLogin() {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         dispatch({ type: CANCEL_LOGIN });
 
         // XXX The error associated with CONNECTION_FAILED was marked as
@@ -100,7 +102,7 @@ export function cancelLogin() {
  * @returns {Function}
  */
 export function cancelWaitForOwner() {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         dispatch(stopWaitForOwner());
 
         // XXX The error associated with CONFERENCE_FAILED was marked as
@@ -228,7 +230,7 @@ function _upgradeRoleStarted(thenableWithCancel) {
  * @returns {Function}
  */
 export function waitForOwner() {
-    return (dispatch: Dispatch) =>
+    return (dispatch: Dispatch<any>) =>
         dispatch({
             type: WAIT_FOR_OWNER,
             handler: () => dispatch(checkIfCanJoin()),

react/features/authentication/components/LoginDialog.native.js

@@ -3,6 +3,7 @@
 import React, { Component } from 'react';
 import { Text, TextInput, View } from 'react-native';
 import { connect as reduxConnect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { connect, toJid } from '../../base/connection';
 import {
@@ -59,7 +60,7 @@ type Props = {
     /**
      * Redux store dispatch method.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Invoked to obtain translated strings.

react/features/authentication/components/WaitForOwnerDialog.native.js

@@ -2,6 +2,7 @@
 
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { ConfirmDialog } from '../../base/dialog';
 import { translate } from '../../base/i18n';
@@ -21,7 +22,7 @@ type Props = {
     /**
      * Redux store dispatch function.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Invoked to obtain translated strings.

react/features/authentication/middleware.js

@@ -1,5 +1,7 @@
 // @flow
 
+import type { Dispatch } from 'redux';
+
 import { appNavigate } from '../app';
 import {
     CONFERENCE_FAILED,
@@ -160,7 +162,7 @@ function _clearExistingWaitForOwnerTimeout(
  * @param {Object} store - The redux store.
  * @returns {void}
  */
-function _hideLoginDialog({ dispatch }: { dispatch: Dispatch<*> }) {
+function _hideLoginDialog({ dispatch }: { dispatch: Dispatch<any> }) {
     dispatch(hideDialog(LoginDialog));
 }
 

react/features/base/app/actions.js

@@ -1,5 +1,7 @@
 // @flow
 
+import type { Dispatch } from 'redux';
+
 import { APP_WILL_MOUNT, APP_WILL_UNMOUNT } from './actionTypes';
 
 declare var APP;
@@ -14,7 +16,7 @@ declare var APP;
  * }}
  */
 export function appWillMount(app: Object) {
-    return (dispatch: Dispatch<*>) => {
+    return (dispatch: Dispatch<any>) => {
         dispatch({
             type: APP_WILL_MOUNT,
             app

react/features/base/color-scheme/ColorSchemeRegistry.js

@@ -122,8 +122,11 @@ class ColorSchemeRegistry {
                 } else if (typeof styleValue === 'function') {
                     // The value is a function, which indicates that it's a
                     // dynamic, schemed color we need to resolve.
+                    // $FlowExpectedError
+                    const value = styleValue();
+
                     schemedStyle[styleName]
-                        = this._getColor(stateful, componentName, styleValue());
+                        = this._getColor(stateful, componentName, value);
                 }
 
             }

react/features/base/conference/actions.js

@@ -299,7 +299,7 @@ export function conferenceSubjectChanged(subject: string) {
  * @returns {Function}
  */
 function _conferenceWillJoin(conference: Object) {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const localTracks
             = getLocalTracks(getState()['features/base/tracks'])
                 .map(t => t.jitsiTrack);
@@ -565,7 +565,7 @@ export function setFollowMe(enabled: boolean) {
  * @returns {Function}
  */
 export function setLastN(lastN: ?number) {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         if (typeof lastN === 'undefined') {
             const config = getState()['features/base/config'];
 
@@ -618,7 +618,7 @@ export function setPassword(
         conference: Object,
         method: Function,
         password: string) {
-    return (dispatch: Dispatch<*>, getState: Function): ?Promise<void> => {
+    return (dispatch: Dispatch<any>, getState: Function): ?Promise<void> => {
         switch (method) {
         case conference.join: {
             let state = getState()['features/base/conference'];
@@ -721,7 +721,7 @@ export function setRoom(room: ?string) {
  */
 export function setStartMutedPolicy(
         startAudioMuted: boolean, startVideoMuted: boolean) {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const conference = getCurrentConference(getState());
 
         conference && conference.setStartMutedPolicy({
@@ -740,7 +740,7 @@ export function setStartMutedPolicy(
  * @returns {Function}
  */
 export function toggleAudioOnly() {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const { audioOnly } = getState()['features/base/conference'];
 
         return dispatch(setAudioOnly(!audioOnly, true));
@@ -754,7 +754,7 @@ export function toggleAudioOnly() {
  * @returns {void}
  */
 export function setSubject(subject: string = '') {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const { conference } = getState()['features/base/conference'];
 
         if (conference) {

react/features/base/config/actions.js

@@ -59,7 +59,7 @@ export function loadConfigError(error: Error, locationURL: URL) {
  * @returns {Function}
  */
 export function setConfig(config: Object = {}) {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const { locationURL } = getState()['features/base/connection'];
 
         // Now that the loading of the config was successful override the values
@@ -99,7 +99,7 @@ export function setConfig(config: Object = {}) {
  * @returns {Function}
  */
 export function storeConfig(baseURL: string, config: Object) {
-    return (dispatch: Dispatch<*>) => {
+    return (dispatch: Dispatch<any>) => {
         // Try to store the configuration in localStorage. If the deployment
         // specified 'getroom' as a function, for example, it does not make
         // sense to and it will not be stored.

react/features/base/connection/actions.native.js

@@ -76,7 +76,7 @@ export type ConnectionFailedError = {
  * @returns {Function}
  */
 export function connect(id: ?string, password: ?string) {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const state = getState();
         const options = _constructOptions(state);
         const { issuer, jwt } = state['features/base/jwt'];
@@ -322,7 +322,7 @@ function _constructOptions(state) {
  * @returns {Function}
  */
 export function disconnect() {
-    return (dispatch: Dispatch<*>, getState: Function): Promise<void> => {
+    return (dispatch: Dispatch<any>, getState: Function): Promise<void> => {
         const state = getState();
 
         // The conference we have already joined or are joining.

react/features/base/connection/actions.web.js

@@ -19,7 +19,7 @@ export {
  * @returns {Promise<JitsiConnection>}
  */
 export function connect() {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         // XXX Lib-jitsi-meet does not accept uppercase letters.
         const room = getState()['features/base/conference'].room.toLowerCase();
 

react/features/base/dialog/actions.js

@@ -1,4 +1,6 @@
-/* @flow */
+// @flow
+
+import type { Dispatch } from 'redux';
 
 import { HIDE_DIALOG, OPEN_DIALOG } from './actionTypes';
 import { isDialogOpen } from './functions';
@@ -53,7 +55,7 @@ export function openDialog(component: Object, componentProps: ?Object) {
  * @returns {Function}
  */
 export function toggleDialog(component: Object, componentProps: ?Object) {
-    return (dispatch: Dispatch, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         if (isDialogOpen(getState, component)) {
             dispatch(hideDialog(component));
         } else {

react/features/base/dialog/components/AbstractDialog.js

@@ -1,6 +1,7 @@
 // @flow
 
 import { Component } from 'react';
+import type { Dispatch } from 'redux';
 
 import { hideDialog } from '../actions';
 import type { DialogProps } from '../constants';
@@ -8,13 +9,12 @@ import type { DialogProps } from '../constants';
 /**
  * The type of the React {@code Component} props of {@link AbstractDialog}.
  */
-export type Props = {
-    ...DialogProps,
+export type Props = DialogProps & {
 
     /**
      * Used to show/hide the dialog on cancel.
      */
-    dispatch: Dispatch<*>
+    dispatch: Dispatch<any>
 };
 
 /**

react/features/base/dialog/components/native/BaseDialog.js

@@ -16,8 +16,7 @@ import AbstractDialog, {
 } from '../AbstractDialog';
 import { brandedDialog as styles } from './styles';
 
-export type Props = {
-    ...AbstractProps,
+export type Props = AbstractProps & {
 
     /**
      * The color-schemed stylesheet of the feature.

react/features/base/dialog/components/native/BaseSubmitDialog.js

@@ -10,8 +10,7 @@ import {
     brandedDialog
 } from './styles';
 
-type Props = {
-    ...BaseProps,
+type Props = BaseProps & {
 
     /**
      * The color-schemed stylesheet of the feature.
@@ -83,7 +82,7 @@ class BaseSubmitDialog<P: Props, S: *> extends BaseDialog<P, S> {
 
     _onCancel: () => void;
 
-    _onSubmit: ?string => boolean;
+    _onSubmit: () => boolean;
 
     _renderHTML: string => Object | string
 

react/features/base/dialog/components/native/BottomSheet.js

@@ -107,4 +107,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(BottomSheet);

react/features/base/dialog/components/native/ConfirmDialog.js

@@ -13,8 +13,7 @@ import { type Props as BaseProps } from './BaseDialog';
 import BaseSubmitDialog from './BaseSubmitDialog';
 import { brandedDialog } from './styles';
 
-type Props = {
-    ...BaseProps,
+type Props = BaseProps & {
 
     /**
      * The color-schemed stylesheet of the feature.

react/features/base/dialog/components/native/CustomDialog.js

@@ -21,4 +21,5 @@ class CustomDialog extends BaseDialog<Props, *> {
     }
 }
 
+// $FlowExpectedError
 export default connect(_abstractMapStateToProps)(CustomDialog);

react/features/base/dialog/components/native/CustomSubmitDialog.js

@@ -9,9 +9,7 @@ import { _abstractMapStateToProps } from '../../functions';
 import { type Props as BaseProps } from './BaseDialog';
 import BaseSubmitDialog from './BaseSubmitDialog';
 
-type Props = {
-    ...BaseProps,
-
+type Props = BaseProps & {
     t: Function
 }
 

react/features/base/dialog/components/native/InputDialog.js

@@ -18,8 +18,7 @@ import {
     inputDialog as styles
 } from './styles';
 
-type Props = {
-    ...BaseProps,
+type Props = BaseProps & {
 
     /**
      * The color-schemed stylesheet of the feature.

react/features/base/dialog/components/web/Dialog.js

@@ -10,8 +10,7 @@ import StatelessDialog from './StatelessDialog';
 /**
  * The type of the React {@code Component} props of {@link Dialog}.
  */
-type Props = {
-    ...AbstractDialogProps,
+type Props = AbstractDialogProps & {
 
     /**
      * Whether the dialog is modal. This means clicking on the blanket will
@@ -44,7 +43,7 @@ class Dialog extends AbstractDialog<Props, State> {
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props) {
+    constructor(props: Props) {
         super(props);
 
         // Bind event handlers so they are only bound once per instance.
@@ -65,6 +64,7 @@ class Dialog extends AbstractDialog<Props, State> {
             onSubmit: this._onSubmit
         };
 
+        // $FlowExpectedError
         delete props.dispatch;
 
         return <StatelessDialog { ...props } />;
@@ -84,4 +84,5 @@ class Dialog extends AbstractDialog<Props, State> {
     _onSubmit: (?string) => void;
 }
 
+// $FlowExpectedError
 export default connect()(Dialog);

react/features/base/dialog/constants.js

@@ -5,27 +5,27 @@ export type DialogProps = {
     /**
      * Whether cancel button is disabled. Enabled by default.
      */
-    cancelDisabled: boolean,
+    cancelDisabled: ?boolean,
 
     /**
      * Optional i18n key to change the cancel button title.
      */
-    cancelKey: string,
+    cancelKey: ?string,
 
     /**
      * The React {@code Component} children which represents the dialog's body.
      */
-    children: React$Node,
+    children: ?React$Node,
 
     /**
      * Is ok button enabled/disabled. Enabled by default.
      */
-    okDisabled: boolean,
+    okDisabled: ?boolean,
 
     /**
      * Optional i18n key to change the ok button title.
      */
-    okKey: string,
+    okKey: ?string,
 
     /**
      * The handler for onCancel event.
@@ -47,14 +47,14 @@ export type DialogProps = {
     /**
      * Key to use for showing a title.
      */
-    titleKey: string,
+    titleKey: ?string,
 
     /**
      * The string to use as a title instead of {@code titleKey}. If a truthy
      * value is specified, it takes precedence over {@code titleKey} i.e.
      * the latter is unused.
      */
-    titleString: string
+    titleString: ?string
 };
 
 /**

react/features/base/lib-jitsi-meet/actions.js

@@ -20,7 +20,7 @@ declare var APP: Object;
  * @returns {Function}
  */
 export function disposeLib() {
-    return (dispatch: Dispatch<*>) => {
+    return (dispatch: Dispatch<any>) => {
         dispatch({ type: LIB_WILL_DISPOSE });
 
         // TODO Currently, lib-jitsi-meet doesn't have the functionality to
@@ -36,7 +36,7 @@ export function disposeLib() {
  * @returns {Function}
  */
 export function initLib() {
-    return (dispatch: Dispatch<*>, getState: Function): void => {
+    return (dispatch: Dispatch<any>, getState: Function): void => {
         const config = getState()['features/base/config'];
 
         if (!config) {

react/features/base/media/actions.js

@@ -99,7 +99,7 @@ export function setVideoMuted(
         muted: boolean,
         authority: number = VIDEO_MUTISM_AUTHORITY.USER,
         ensureTrack: boolean = false) {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const oldValue = getState()['features/base/media'].video.muted;
 
         // eslint-disable-next-line no-bitwise

react/features/base/media/components/AbstractVideoTrack.js

@@ -1,6 +1,7 @@
 /* @flow */
 
 import React, { Component } from 'react';
+import type { Dispatch } from 'redux';
 
 import { trackVideoStarted } from '../../tracks';
 
@@ -15,7 +16,7 @@ export type Props = {
     /**
      * The Redux dispatch function.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Callback to invoke when the {@link Video} of {@code AbstractVideoTrack}

react/features/base/media/components/native/VideoTrack.js

@@ -29,4 +29,5 @@ class VideoTrack extends AbstractVideoTrack<Props> {
     }
 }
 
+// $FlowExpectedError
 export default connect()(VideoTrack);

react/features/base/media/components/native/VideoTransform.js

@@ -5,6 +5,8 @@ import { PanResponder, PixelRatio, View } from 'react-native';
 import { connect } from 'react-redux';
 import { type Dispatch } from 'redux';
 
+import type { PanResponderInstance } from 'PanResponder';
+
 import { storeVideoTransform } from '../../actions';
 import styles from './styles';
 
@@ -117,7 +119,7 @@ class VideoTransform extends Component<Props, State> {
     /**
      * The gesture handler object.
      */
-    gestureHandlers: PanResponder;
+    gestureHandlers: PanResponderInstance;
 
     /**
      * The initial distance of the fingers on pinch start.
@@ -190,7 +192,7 @@ class VideoTransform extends Component<Props, State> {
      *
      * @inheritdoc
      */
-    componentDidUpdate(prevProps, prevState) {
+    componentDidUpdate(prevProps: Props, prevState: State) {
         if (prevProps.streamId !== this.props.streamId) {
             this._storeTransform(prevProps.streamId, prevState.transform);
             this._restoreTransform(this.props.streamId);
@@ -687,7 +689,7 @@ class VideoTransform extends Component<Props, State> {
  *     _onUnmount: Function
  * }}
  */
-function _mapDispatchToProps(dispatch: Dispatch<*>) {
+function _mapDispatchToProps(dispatch: Dispatch<any>) {
     return {
         /**
          * Dispatches actions to store the last applied transform to a video.
@@ -725,4 +727,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps, _mapDispatchToProps)(VideoTransform);

react/features/base/media/components/web/VideoTrack.js

@@ -11,8 +11,7 @@ import Video from './Video';
 /**
  * The type of the React {@code Component} props of {@link VideoTrack}.
  */
-type Props = {
-    ...AbstractVideoTrackProps,
+type Props = AbstractVideoTrackProps & {
 
     /**
      * CSS classes to add to the video element.
@@ -64,4 +63,5 @@ class VideoTrack extends AbstractVideoTrack<Props> {
     _onVideoPlaying: () => void;
 }
 
+// $FlowExpectedError
 export default connect()(VideoTrack);

react/features/base/react/Types.js

@@ -20,7 +20,7 @@ export type Item = {
     /**
      * An optional react element to append to the end of the Item.
      */
-    elementAfter?: ?ComponentType<any>,
+    elementAfter?: ?React$Node,
 
     /**
      * Unique ID of the item.

react/features/base/react/components/AbstractContainer.js

@@ -20,7 +20,7 @@ export type Props = {
     /**
      * React Elements to display within the component.
      */
-    children: React$Node | Object,
+    children: React$Node,
 
     /**
      * The event handler/listener to be invoked when this

react/features/base/react/components/native/AvatarListItem.js

@@ -32,7 +32,7 @@ type Props = {
     /**
      * Children of the component.
      */
-    children?: ?React$Element<*>,
+    children?: React$Node,
 
     /**
      * item containing data to be rendered
@@ -70,6 +70,44 @@ export default class AvatarListItem extends Component<Props> {
         this._renderItemLine = this._renderItemLine.bind(this);
     }
 
+    /**
+     * Helper function to render the content in the avatar container.
+     *
+     * @returns {React$Element}
+     */
+    _getAvatarContent() {
+        const {
+            avatarSize = AVATAR_SIZE,
+            avatarTextStyle
+        } = this.props;
+        const { avatar, title } = this.props.item;
+        const isAvatarURL = Boolean(avatar && avatar.match(/^http[s]*:\/\//i));
+
+        if (isAvatarURL) {
+            return (
+                <Avatar
+                    size = { avatarSize }
+                    uri = { avatar } />
+            );
+        }
+
+        if (avatar && !isAvatarURL) {
+            return (
+                <Icon name = { avatar } />
+            );
+        }
+
+        return (
+            <Text
+                style = { [
+                    styles.avatarContent,
+                    avatarTextStyle
+                ] }>
+                { title.substr(0, 1).toUpperCase() }
+            </Text>
+        );
+    }
+
     /**
      * Implements {@code Component#render}.
      *
@@ -78,10 +116,9 @@ export default class AvatarListItem extends Component<Props> {
     render() {
         const {
             avatarSize = AVATAR_SIZE,
-            avatarStyle,
-            avatarTextStyle
+            avatarStyle
         } = this.props;
-        const { avatar, colorBase, lines, title } = this.props.item;
+        const { colorBase, lines, title } = this.props.item;
         const avatarStyles = {
             ...styles.avatar,
             ...this._getAvatarColor(colorBase),
@@ -91,8 +128,6 @@ export default class AvatarListItem extends Component<Props> {
             width: avatarSize
         };
 
-        const isAvatarURL = Boolean(avatar && avatar.match(/^http[s]*:\/\//i));
-
         return (
             <Container
                 onClick = { this.props.onPress }
@@ -100,26 +135,7 @@ export default class AvatarListItem extends Component<Props> {
                 underlayColor = { UNDERLAY_COLOR }>
                 <Container style = { styles.avatarContainer }>
                     <Container style = { avatarStyles }>
-                        {
-                            isAvatarURL && <Avatar
-                                size = { avatarSize }
-                                uri = { avatar } />
-                        }
-
-                        {
-                            Boolean(avatar && !isAvatarURL) && <Icon
-                                name = { avatar } />
-                        }
-
-                        {
-                            !avatar && <Text
-                                style = { [
-                                    styles.avatarContent,
-                                    avatarTextStyle
-                                ] }>
-                                { title.substr(0, 1).toUpperCase() }
-                            </Text>
-                        }
+                        { this._getAvatarContent() }
                     </Container>
                 </Container>
                 <Container style = { styles.listItemDetails }>

react/features/base/react/components/native/BackButton.js

@@ -68,4 +68,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(BackButton);

react/features/base/react/components/native/Header.js

@@ -165,4 +165,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(Header);

react/features/base/react/components/native/PagedList.js

@@ -283,4 +283,5 @@ class PagedList extends Component<Props, State> {
     }
 }
 
+// $FlowExpectedError
 export default connect()(PagedList);

react/features/base/react/components/web/Watermarks.js

@@ -242,4 +242,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(translate(Watermarks));

react/features/base/redux/MiddlewareRegistry.js

@@ -32,14 +32,8 @@ class MiddlewareRegistry {
      * @returns {Middleware}
      */
     applyMiddleware(...additional: Array<Middleware<*, *>>) {
-        // XXX The explicit definition of the local variable middlewares is to
-        // satisfy flow.
-        const middlewares = [
-            ...this._elements,
-            ...additional
-        ];
-
-        return applyMiddleware(...middlewares);
+        // $FlowExpectedError
+        return applyMiddleware(...this._elements, ...additional);
     }
 
     /**

react/features/base/redux/ReducerRegistry.js

@@ -38,6 +38,7 @@ class ReducerRegistry {
      * @returns {Function}
      */
     combineReducers(additional: NameReducerMap<*, *> = {}) {
+        // $FlowExpectedError
         return combineReducers({
             ...this._elements,
             ...additional

react/features/base/redux/StateListenerRegistry.js

@@ -1,5 +1,7 @@
 // @flow
 
+import type { Store } from 'redux';
+
 const logger = require('jitsi-meet-logger').getLogger(__filename);
 
 /**
@@ -16,7 +18,8 @@ const logger = require('jitsi-meet-logger').getLogger(__filename);
  * invoked only if {@code prevSelection} and {@code selection} are different.
  * Immutable!
  */
-type Listener = (selection: any, store: Store, prevSelection: any) => void;
+type Listener
+    = (selection: any, store: Store<*, *>, prevSelection: any) => void;
 
 /**
  * The type selector supported for registration with
@@ -65,7 +68,10 @@ class StateListenerRegistry {
      */
     _selectorListeners: Set<SelectorListener> = new Set();
 
-    _listener: (Store) => void;
+    _listener: ({
+        prevSelections: Map<SelectorListener, any>,
+        store: Store<*, *>
+    }) => void;
 
     /**
      * Invoked by a specific redux store any time an action is dispatched, and
@@ -78,7 +84,7 @@ class StateListenerRegistry {
      */
     _listener({ prevSelections, store }: {
             prevSelections: Map<SelectorListener, any>,
-            store: Store
+            store: Store<*, *>
     }) {
         for (const selectorListener of this._selectorListeners) {
             const prevSelection = prevSelections.get(selectorListener);
@@ -129,7 +135,7 @@ class StateListenerRegistry {
      * {@code StateListenerRegistry} is to {@code subscribe}.
      * @returns {void}
      */
-    subscribe(store: Store) {
+    subscribe(store: Store<*, *>) {
         // XXX If StateListenerRegistry is not utilized by the app to listen to
         // state changes, do not bother subscribing to the store at all.
         if (this._selectorListeners.size) {

react/features/base/responsive-ui/actions.js

@@ -30,7 +30,7 @@ const REDUCED_UI_THRESHOLD = 300;
  * }}
  */
 export function setAspectRatio(width: number, height: number): Function {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         // Don't change the aspect ratio if width and height are the same, that
         // is, if we transition to a 1:1 aspect ratio.
         if (width !== height) {
@@ -60,7 +60,7 @@ export function setAspectRatio(width: number, height: number): Function {
  * }}
  */
 export function setReducedUI(width: number, height: number): Function {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const reducedUI = Math.min(width, height) < REDUCED_UI_THRESHOLD;
 
         if (reducedUI !== getState()['features/base/responsive-ui'].reducedUI) {

react/features/base/responsive-ui/components/AspectRatioDetector.js

@@ -52,7 +52,7 @@ class AspectRatioDetector extends Component<Props> {
  *     _onDimensionsChanged: Function
  * }}
  */
-function _mapDispatchToProps(dispatch: Dispatch<*>) {
+function _mapDispatchToProps(dispatch: Dispatch<any>) {
     return {
         /**
          * Handles the "on dimensions changed" event and dispatches aspect ratio
@@ -69,4 +69,5 @@ function _mapDispatchToProps(dispatch: Dispatch<*>) {
     };
 }
 
+// $FlowExpectedError
 export default connect(undefined, _mapDispatchToProps)(AspectRatioDetector);

react/features/base/responsive-ui/components/ReducedUIDetector.js

@@ -53,7 +53,7 @@ class ReducedUIDetector extends Component<Props> {
  *     _onDimensionsChanged: Function
  * }}
  */
-function _mapDispatchToProps(dispatch: Dispatch<*>) {
+function _mapDispatchToProps(dispatch: Dispatch<any>) {
     return {
         /**
          * Handles the "on dimensions changed" event and dispatches the
@@ -70,4 +70,5 @@ function _mapDispatchToProps(dispatch: Dispatch<*>) {
     };
 }
 
+// $FlowExpectedError
 export default connect(undefined, _mapDispatchToProps)(ReducedUIDetector);

react/features/base/sounds/components/SoundCollection.js

@@ -153,4 +153,5 @@ export function _mapDispatchToProps(dispatch: Function) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps, _mapDispatchToProps)(SoundCollection);

react/features/base/styles/functions.js

@@ -46,7 +46,7 @@ const _WELL_KNOWN_NUMBER_PROPERTIES = [ 'height', 'width' ];
  * @returns {StyleType} - The merged styles.
  */
 export function combineStyles(a: StyleType, b: StyleType): StyleType {
-    const result = [];
+    const result: Array<StyleSheet> = [];
 
     if (a) {
         if (Array.isArray(a)) {

react/features/base/testing/components/TestConnectionInfo.js

@@ -89,7 +89,7 @@ class TestConnectionInfo extends Component<Props, State> {
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props: Object) {
+    constructor(props: Props) {
         super(props);
 
         this._onStatsUpdated = this._onStatsUpdated.bind(this);
@@ -142,7 +142,7 @@ class TestConnectionInfo extends Component<Props, State> {
      * @inheritdoc
      * returns {void}
      */
-    componentDidUpdate(prevProps) {
+    componentDidUpdate(prevProps: Props) {
         if (prevProps._localUserId !== this.props._localUserId) {
             statsEmitter.unsubscribeToClientStats(
                 prevProps._localUserId, this._onStatsUpdated);
@@ -215,4 +215,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(TestConnectionInfo);

react/features/base/testing/components/TestHint.ios.js

@@ -34,4 +34,5 @@ class TestHint extends Component<TestHintProps> {
     }
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(TestHint);

react/features/base/toolbox/components/AbstractToolboxItem.js

@@ -201,6 +201,7 @@ export default class AbstractToolboxItem<P : Props> extends Component<P> {
      */
     _renderItem() {
         // To be implemented by a subclass.
+        return null;
     }
 
     /**

react/features/calendar-sync/actions.native.js

@@ -1,6 +1,8 @@
 // @flow
 import { generateRoomWithoutSeparator } from 'js-utils/random';
 
+import type { Dispatch } from 'redux';
+
 import { getDefaultURL } from '../app';
 import { openDialog } from '../base/dialog';
 
@@ -35,7 +37,7 @@ export function openUpdateCalendarEventDialog(eventId: string) {
  * @returns {Function}
  */
 export function updateCalendarEvent(eventId: string) {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const defaultUrl = getDefaultURL(getState);
         const roomName = generateRoomWithoutSeparator();
 

react/features/calendar-sync/actions.web.js

@@ -1,6 +1,7 @@
 // @flow
 
 import { generateRoomWithoutSeparator } from 'js-utils/random';
+import type { Dispatch } from 'redux';
 
 import { loadGoogleAPI } from '../google-api';
 
@@ -197,7 +198,7 @@ export function setIntegrationReady(integrationType: string) {
  * @returns {Function}
  */
 export function signIn(calendarType: string): Function {
-    return (dispatch: Dispatch<*>) => {
+    return (dispatch: Dispatch<any>) => {
         const integration = _getCalendarIntegration(calendarType);
 
         if (!integration) {
@@ -229,7 +230,7 @@ export function signIn(calendarType: string): Function {
  * @returns {Function}
  */
 export function updateCalendarEvent(id: string, calendarId: string): Function {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
 
         const { integrationType } = getState()['features/calendar-sync'];
         const integration = _getCalendarIntegration(integrationType);
@@ -276,7 +277,7 @@ export function updateCalendarEvent(id: string, calendarId: string): Function {
  * @returns {Function}
  */
 export function updateProfile(calendarType: string): Function {
-    return (dispatch: Dispatch<*>) => {
+    return (dispatch: Dispatch<any>) => {
         const integration = _getCalendarIntegration(calendarType);
 
         if (!integration) {

react/features/calendar-sync/components/AddMeetingUrlButton.web.js

@@ -1,8 +1,9 @@
 // @flow
 
+import Tooltip from '@atlaskit/tooltip';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
-import Tooltip from '@atlaskit/tooltip';
+import type { Dispatch } from 'redux';
 
 import {
     createCalendarClickedEvent,
@@ -25,7 +26,7 @@ type Props = {
     /**
      * Invoked to add a meeting URL to a calendar event.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * The ID of the calendar event that will have a meeting URL added on click.

react/features/calendar-sync/components/CalendarListContent.native.js

@@ -108,7 +108,7 @@ class CalendarListContent extends Component<Props> {
         );
     }
 
-    _onPress: (string, string) => Function;
+    _onPress: (string, ?string) => Function;
 
     /**
      * Handles the list's navigate action.

react/features/calendar-sync/components/CalendarListContent.web.js

@@ -59,7 +59,7 @@ class CalendarListContent extends Component<Props> {
      *
      * @inheritdoc
      */
-    constructor(props) {
+    constructor(props: Props) {
         super(props);
 
         // Bind event handlers so they are only bound once per instance.
@@ -114,7 +114,7 @@ class CalendarListContent extends Component<Props> {
         this._onPress(url, 'calendar.meeting.join');
     }
 
-    _onPress: (string, string) => Function;
+    _onPress: (string, ?string) => Function;
 
     /**
      * Handles the list's navigate action.
@@ -173,5 +173,7 @@ function _mapStateToProps(state: Object) {
 }
 
 export default isCalendarEnabled()
+
+    // $FlowExpectedError
     ? connect(_mapStateToProps)(CalendarListContent)
     : undefined;

react/features/calendar-sync/functions.native.js

@@ -2,6 +2,7 @@
 
 import { NativeModules, Platform } from 'react-native';
 import RNCalendarEvents from 'react-native-calendar-events';
+import type { Store } from 'redux';
 
 import { getShareInfoText } from '../invite';
 
@@ -22,7 +23,7 @@ const logger = require('jitsi-meet-logger').getLogger(__filename);
  * @returns {Promise<*>}
  */
 export function addLinkToCalendarEntry(
-        state: Object, id: string, link: string) {
+        state: Object, id: string, link: string): Promise<any> {
     return new Promise((resolve, reject) => {
         getShareInfoText(state, link, true).then(shareInfoText => {
             RNCalendarEvents.findEventById(id).then(event => {
@@ -76,9 +77,9 @@ export function isCalendarEnabled() {
  * @returns {void}
  */
 export function _fetchCalendarEntries(
-        store,
-        maybePromptForPermission,
-        forcePermission) {
+        store: Store<*, *>,
+        maybePromptForPermission: boolean,
+        forcePermission: ?boolean) {
     const { dispatch, getState } = store;
     const promptForPermission
         = (maybePromptForPermission

react/features/calendar-sync/functions.web.js

@@ -47,9 +47,9 @@ export function isCalendarEnabled() {
  * @returns {void}
  */
 export function _fetchCalendarEntries(
-        store,
-        maybePromptForPermission,
-        forcePermission) {
+        store: Object,
+        maybePromptForPermission: boolean,
+        forcePermission: ?boolean) {
     /* eslint-enable no-unused-vars */
     const { dispatch, getState } = store;
 

react/features/calendar-sync/web/googleCalendar.js

@@ -1,4 +1,6 @@
-/* @flow */
+// @flow
+
+import type { Dispatch } from 'redux';
 
 import {
     getCalendarEntries,
@@ -29,7 +31,7 @@ export const googleCalendarApi = {
     /**
      * Returns the email address for the currently logged in user.
      *
-     * @returns {function(Dispatch<*>): Promise<string|never>}
+     * @returns {function(Dispatch<any>): Promise<string|never>}
      */
     getCurrentEmail() {
         return updateProfile();
@@ -38,10 +40,10 @@ export const googleCalendarApi = {
     /**
      * Initializes the google api if needed.
      *
-     * @returns {function(Dispatch<*>, Function): Promise<void>}
+     * @returns {function(Dispatch<any>, Function): Promise<void>}
      */
     load() {
-        return (dispatch: Dispatch<*>, getState: Function) => {
+        return (dispatch: Dispatch<any>, getState: Function) => {
             const { googleApiApplicationClientID }
                 = getState()['features/base/config'];
 
@@ -52,7 +54,7 @@ export const googleCalendarApi = {
     /**
      * Prompts the participant to sign in to the Google API Client Library.
      *
-     * @returns {function(Dispatch<*>): Promise<string|never>}
+     * @returns {function(Dispatch<any>): Promise<string|never>}
      */
     signIn,
 
@@ -72,7 +74,7 @@ export const googleCalendarApi = {
      * @param {string} id - The event id.
      * @param {string} calendarId - The id of the calendar to use.
      * @param {string} location - The location to save to the event.
-     * @returns {function(Dispatch<*>): Promise<string|never>}
+     * @returns {function(Dispatch<any>): Promise<string|never>}
      */
     updateCalendarEvent
 };

react/features/calendar-sync/web/microsoftCalendar.js

@@ -1,7 +1,8 @@
-/* @flow */
+// @flow
 
 import { Client } from '@microsoft/microsoft-graph-client';
 import rs from 'jsrsasign';
+import type { Dispatch } from 'redux';
 
 import { createDeferred } from '../../../../modules/util/helpers';
 
@@ -77,10 +78,10 @@ export const microsoftCalendarApi = {
      * @param {number} fetchStartDays - The number of days to go back
      * when fetching.
      * @param {number} fetchEndDays - The number of days to fetch.
-     * @returns {function(Dispatch<*>, Function): Promise<CalendarEntries>}
+     * @returns {function(Dispatch<any>, Function): Promise<CalendarEntries>}
      */
     getCalendarEntries(fetchStartDays: ?number, fetchEndDays: ?number) {
-        return (dispatch: Dispatch<*>, getState: Function): Promise<*> => {
+        return (dispatch: Dispatch<any>, getState: Function): Promise<*> => {
             const state = getState()['features/calendar-sync'] || {};
             const token = state.msAuthState && state.msAuthState.accessToken;
 
@@ -118,7 +119,7 @@ export const microsoftCalendarApi = {
      * @returns {function(Dispatch<*, Function>): Promise<string>}
      */
     getCurrentEmail(): Function {
-        return (dispatch: Dispatch<*>, getState: Function) => {
+        return (dispatch: Dispatch<any>, getState: Function) => {
             const { msAuthState = {} }
                 = getState()['features/calendar-sync'] || {};
             const email = msAuthState.userSigninName || '';
@@ -139,10 +140,10 @@ export const microsoftCalendarApi = {
     /**
      * Prompts the participant to sign in to the Microsoft API Client Library.
      *
-     * @returns {function(Dispatch<*>, Function): Promise<void>}
+     * @returns {function(Dispatch<any>, Function): Promise<void>}
      */
     signIn(): Function {
-        return (dispatch: Dispatch<*>, getState: Function) => {
+        return (dispatch: Dispatch<any>, getState: Function) => {
             // Ensure only one popup window at a time.
             if (popupAuthWindow) {
                 popupAuthWindow.focus();
@@ -238,10 +239,10 @@ export const microsoftCalendarApi = {
     /**
      * Returns whether or not the user is currently signed in.
      *
-     * @returns {function(Dispatch<*>, Function): Promise<boolean>}
+     * @returns {function(Dispatch<any>, Function): Promise<boolean>}
      */
     _isSignedIn(): Function {
-        return (dispatch: Dispatch<*>, getState: Function) => {
+        return (dispatch: Dispatch<any>, getState: Function) => {
             const now = new Date().getTime();
             const state
                 = getState()['features/calendar-sync'].msAuthState || {};
@@ -250,7 +251,7 @@ export const microsoftCalendarApi = {
 
             if (state.accessToken && isExpired) {
                 // token expired, let's refresh it
-                return dispatch(this._refreshAuthToken())
+                return dispatch(refreshAuthToken())
                     .then(() => true)
                     .catch(() => false);
             }
@@ -259,58 +260,6 @@ export const microsoftCalendarApi = {
         };
     },
 
-    /**
-     * Renews an existing auth token so it can continue to be used.
-     *
-     * @private
-     * @returns {function(Dispatch<*>, Function): Promise<void>}
-     */
-    _refreshAuthToken(): Function {
-        return (dispatch: Dispatch<*>, getState: Function) => {
-            const { microsoftApiApplicationClientID }
-                = getState()['features/base/config'];
-            const { msAuthState = {} }
-                = getState()['features/calendar-sync'] || {};
-
-            const refreshAuthUrl = getAuthRefreshUrl(
-                microsoftApiApplicationClientID,
-                msAuthState.userDomainType,
-                msAuthState.userSigninName);
-
-            const iframe = document.createElement('iframe');
-
-            iframe.setAttribute('id', 'auth-iframe');
-            iframe.setAttribute('name', 'auth-iframe');
-            iframe.setAttribute('style', 'display: none');
-            iframe.setAttribute('src', refreshAuthUrl);
-
-            const signInPromise = new Promise(resolve => {
-                iframe.onload = () => {
-                    resolve(iframe.contentWindow.location.hash);
-                };
-            });
-
-            // The check for body existence is done for flow, which also runs
-            // against native where document.body may not be defined.
-            if (!document.body) {
-                return Promise.reject(
-                    'Cannot refresh auth token in this environment');
-            }
-
-            document.body.appendChild(iframe);
-
-            return signInPromise.then(hash => {
-                const params = getParamsFromHash(hash);
-
-                dispatch(setCalendarAPIAuthState({
-                    accessToken: params.access_token,
-                    idToken: params.id_token,
-                    tokenExpires: params.tokenExpires
-                }));
-            });
-        };
-    },
-
     /**
      * Updates calendar event by generating new invite URL and editing the event
      * adding some descriptive text and location.
@@ -318,10 +267,10 @@ export const microsoftCalendarApi = {
      * @param {string} id - The event id.
      * @param {string} calendarId - The id of the calendar to use.
      * @param {string} location - The location to save to the event.
-     * @returns {function(Dispatch<*>): Promise<string|never>}
+     * @returns {function(Dispatch<any>): Promise<string|never>}
      */
     updateCalendarEvent(id: string, calendarId: string, location: string) {
-        return (dispatch: Dispatch<*>, getState: Function): Promise<*> => {
+        return (dispatch: Dispatch<any>, getState: Function): Promise<*> => {
             const state = getState()['features/calendar-sync'] || {};
             const token = state.msAuthState && state.msAuthState.accessToken;
 
@@ -533,6 +482,58 @@ function getValidatedTokenParts(tokenInfo, guids, appId) {
     };
 }
 
+/**
+ * Renews an existing auth token so it can continue to be used.
+ *
+ * @private
+ * @returns {function(Dispatch<any>, Function): Promise<void>}
+ */
+function refreshAuthToken(): Function {
+    return (dispatch: Dispatch<any>, getState: Function) => {
+        const { microsoftApiApplicationClientID }
+            = getState()['features/base/config'];
+        const { msAuthState = {} }
+            = getState()['features/calendar-sync'] || {};
+
+        const refreshAuthUrl = getAuthRefreshUrl(
+            microsoftApiApplicationClientID,
+            msAuthState.userDomainType,
+            msAuthState.userSigninName);
+
+        const iframe = document.createElement('iframe');
+
+        iframe.setAttribute('id', 'auth-iframe');
+        iframe.setAttribute('name', 'auth-iframe');
+        iframe.setAttribute('style', 'display: none');
+        iframe.setAttribute('src', refreshAuthUrl);
+
+        const signInPromise = new Promise(resolve => {
+            iframe.onload = () => {
+                resolve(iframe.contentWindow.location.hash);
+            };
+        });
+
+        // The check for body existence is done for flow, which also runs
+        // against native where document.body may not be defined.
+        if (!document.body) {
+            return Promise.reject(
+                'Cannot refresh auth token in this environment');
+        }
+
+        document.body.appendChild(iframe);
+
+        return signInPromise.then(hash => {
+            const params = getParamsFromHash(hash);
+
+            dispatch(setCalendarAPIAuthState({
+                accessToken: params.access_token,
+                idToken: params.id_token,
+                tokenExpires: params.tokenExpires
+            }));
+        });
+    };
+}
+
 /**
  * Retrieves calendar entries from a specific calendar.
  *

react/features/chat/components/AbstractChat.js

@@ -1,6 +1,7 @@
 // @flow
 
 import { Component } from 'react';
+import type { Dispatch } from 'redux';
 
 import { getLocalParticipant } from '../../base/participants';
 
@@ -41,7 +42,7 @@ export type Props = {
     /**
      * The Redux dispatch function.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Function to be used to translate i18n labels.
@@ -64,7 +65,7 @@ export default class AbstractChat<P: Props> extends Component<P> {}
  * }}
  * @private
  */
-export function _mapDispatchToProps(dispatch: Dispatch<*>) {
+export function _mapDispatchToProps(dispatch: Dispatch<any>) {
     return {
         /**
          * Toggles the chat window.

react/features/chat/components/native/ChatButton.js

@@ -126,4 +126,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps, _mapDispatchToProps)(ChatButton);

react/features/chat/components/web/ChatCounter.js

@@ -57,4 +57,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(ChatCounter);

react/features/chat/components/web/ChatInput.js

@@ -3,6 +3,7 @@
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import Emoji from 'react-emoji-render';
+import type { Dispatch } from 'redux';
 
 import { sendMessage } from '../../actions';
 
@@ -16,7 +17,7 @@ type Props = {
     /**
      * Invoked to send chat messages.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Optional callback to get a reference to the chat input element.
@@ -231,4 +232,5 @@ class ChatInput extends Component<Props, State> {
     }
 }
 
+// $FlowExpectedError
 export default connect()(ChatInput);

react/features/chat/components/web/DisplayNameForm.js

@@ -3,6 +3,7 @@
 import { FieldTextStateless } from '@atlaskit/field-text';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { translate } from '../../../base/i18n';
 import { updateSettings } from '../../../base/settings';
@@ -15,7 +16,7 @@ type Props = {
     /**
      * Invoked to set the local participant display name.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Invoked to obtain translated strings.

react/features/conference/components/native/DisplayNameLabel.js

@@ -76,4 +76,5 @@ function _mapStateToProps(state: Object) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(DisplayNameLabel);

react/features/conference/components/native/Labels.js

@@ -367,4 +367,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(makeAspectRatioAware(Labels));

react/features/conference/components/native/NavigationBar.js

@@ -93,4 +93,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(NavigationBar);

react/features/conference/components/web/Conference.js

@@ -308,4 +308,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default reactReduxConnect(_mapStateToProps)(translate(Conference));

react/features/conference/components/web/Labels.js

@@ -38,7 +38,7 @@ class Labels extends AbstractLabels<Props, State> {
      *
      * @inheritdoc
      */
-    static getDerivedStateFromProps(props, prevState) {
+    static getDerivedStateFromProps(props: Props, prevState: State) {
         return {
             filmstripBecomingVisible: !prevState.filmstripBecomingVisible
                 && props._filmstripVisible
@@ -105,4 +105,5 @@ class Labels extends AbstractLabels<Props, State> {
     _renderVideoQualityLabel: () => React$Element<*>;
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(Labels);

react/features/conference/components/web/Subject.js

@@ -64,4 +64,6 @@ function _mapStateToProps(state) {
         _visible: isToolboxVisible(state)
     };
 }
+
+// $FlowExpectedError
 export default connect(_mapStateToProps)(Subject);

react/features/deep-linking/actions.js

@@ -1,4 +1,6 @@
-/* @flow */
+// @flow
+
+import type { Dispatch } from 'redux';
 
 import { appNavigate } from '../app';
 
@@ -10,7 +12,7 @@ import { OPEN_DESKTOP_APP, OPEN_WEB_APP } from './actionTypes';
  * @returns {Function}
  */
 export function openWebApp() {
-    return (dispatch: Dispatch<*>) => {
+    return (dispatch: Dispatch<any>) => {
         // In order to go to the web app we need to skip the deep linking
         // interceptor. OPEN_WEB_APP action should set launchInWeb to true in
         // the redux store. After this when appNavigate() is called the

react/features/deep-linking/components/DeepLinkingDesktopPage.web.js

@@ -1,9 +1,10 @@
-/* @flow */
+// @flow
 
 import Button, { ButtonGroup } from '@atlaskit/button';
 import { AtlasKitThemeProvider } from '@atlaskit/theme';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { createDeepLinkingPageEvent, sendAnalytics } from '../../analytics';
 import { translate } from '../../base/i18n';
@@ -25,7 +26,7 @@ declare var interfaceConfig: Object;
     /**
      * Used to dispatch actions from the buttons.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Used to obtain translations.

react/features/desktop-picker/components/DesktopPicker.js

@@ -3,6 +3,7 @@
 import Tabs from '@atlaskit/tabs';
 import React, { PureComponent } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { Dialog, hideDialog } from '../../base/dialog';
 import { translate } from '../../base/i18n';
@@ -54,7 +55,7 @@ type Props = {
     /**
      * Used to request DesktopCapturerSources.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * The callback to be invoked when the component is closed or when a

react/features/display-name/components/AbstractDisplayNamePrompt.js

@@ -1,6 +1,7 @@
 // @flow
 
 import { Component } from 'react';
+import type { Dispatch } from 'redux';
 
 import { updateSettings } from '../../base/settings';
 
@@ -13,7 +14,7 @@ export type Props = {
     /**
      * Invoked to update the local participant's display name.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Function to be invoked after a successful display name change.

react/features/display-name/components/DisplayName.web.js

@@ -2,6 +2,7 @@
 
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { appendSuffix } from '../functions';
 
@@ -29,7 +30,7 @@ type Props = {
     /**
      * Invoked to update the participant's display name.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * A string to append to the displayName, if provided.

react/features/display-name/components/DisplayNamePrompt.native.js

@@ -27,4 +27,5 @@ class DisplayNamePrompt extends AbstractDisplayNamePrompt<*> {
     _onSetDisplayName: string => boolean;
 }
 
+// $FlowExpectedError
 export default connect()(DisplayNamePrompt);

react/features/feedback/actions.js

@@ -1,5 +1,7 @@
 // @flow
 
+import type { Dispatch } from 'redux';
+
 import { openDialog } from '../base/dialog';
 import { FEEDBACK_REQUEST_IN_PROGRESS } from '../../../modules/UI/UIErrors';
 
@@ -46,7 +48,7 @@ export function maybeOpenFeedbackDialog(conference: Object) {
         showThankYou: boolean
     };
 
-    return (dispatch: Dispatch<*>, getState: Function): Promise<R> => {
+    return (dispatch: Dispatch<any>, getState: Function): Promise<R> => {
         const state = getState();
 
         if (interfaceConfig.filmStripOnly || config.iAmRecorder) {

react/features/feedback/components/FeedbackDialog.web.js

@@ -1,10 +1,11 @@
-/* @flow */
+// @flow
 
 import { FieldTextAreaStateless } from '@atlaskit/field-text-area';
 import StarIcon from '@atlaskit/icon/glyph/star';
 import StarFilledIcon from '@atlaskit/icon/glyph/star-filled';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import {
     createFeedbackOpenEvent,
@@ -62,7 +63,7 @@ type Props = {
     /**
      * Invoked to signal feedback submission or canceling.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Callback invoked when {@code FeedbackDialog} is unmounted.

react/features/filmstrip/components/native/Filmstrip.js

@@ -219,4 +219,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(makeAspectRatioAware(Filmstrip));

react/features/filmstrip/components/native/LocalThumbnail.js

@@ -60,4 +60,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(LocalThumbnail);

react/features/filmstrip/components/native/Thumbnail.js

@@ -2,6 +2,7 @@
 
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { ColorSchemeRegistry } from '../../../base/color-scheme';
 import { openDialog } from '../../../base/dialog';
@@ -81,7 +82,7 @@ type Props = {
     /**
      * Invoked to trigger state changes in Redux.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * The Redux representation of the participant to display.
@@ -254,4 +255,5 @@ function _mapStateToProps(state, ownProps) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps, _mapDispatchToProps)(Thumbnail);

react/features/filmstrip/components/native/TileView.js

@@ -7,6 +7,7 @@ import {
     View
 } from 'react-native';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import {
     getNearestReceiverVideoQualityLevel,
@@ -34,7 +35,7 @@ type Props = {
     /**
      * Invoked to update the receiver video quality.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Callback to invoke when tile view is tapped.
@@ -334,4 +335,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(makeAspectRatioAware(TileView));

react/features/filmstrip/components/web/Filmstrip.js

@@ -3,6 +3,7 @@
 import _ from 'lodash';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import {
     createShortcutEvent,
@@ -53,7 +54,7 @@ type Props = {
     /**
      * The redux {@code dispatch} function.
      */
-    dispatch: Dispatch<*>
+    dispatch: Dispatch<any>
 };
 
 /**
@@ -318,4 +319,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(Filmstrip);

react/features/filmstrip/components/web/Toolbar.js

@@ -90,4 +90,5 @@ function _mapStateToProps(state): Object { // eslint-disable-line no-unused-vars
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(Toolbar);

react/features/google-api/actions.js

@@ -1,4 +1,7 @@
-/* @flow */
+// @flow
+
+import type { Dispatch } from 'redux';
+
 import { getShareInfoText } from '../invite';
 
 import {
@@ -13,7 +16,7 @@ import googleApi from './googleApi';
  *
  * @param {number} fetchStartDays - The number of days to go back when fetching.
  * @param {number} fetchEndDays - The number of days to fetch.
- * @returns {function(Dispatch<*>): Promise<CalendarEntries>}
+ * @returns {function(Dispatch<any>): Promise<CalendarEntries>}
  */
 export function getCalendarEntries(
         fetchStartDays: ?number, fetchEndDays: ?number) {
@@ -30,7 +33,7 @@ export function getCalendarEntries(
  * @returns {Function}
  */
 export function loadGoogleAPI(clientId: string) {
-    return (dispatch: Dispatch<*>, getState: Function) =>
+    return (dispatch: Dispatch<any>, getState: Function) =>
         googleApi.get()
         .then(() => {
             if (getState()['features/google-api'].googleAPIState
@@ -146,10 +149,10 @@ export function showAccountSelection() {
 /**
  * Prompts the participant to sign in to the Google API Client Library.
  *
- * @returns {function(Dispatch<*>): Promise<string | never>}
+ * @returns {function(Dispatch<any>): Promise<string | never>}
  */
 export function signIn() {
-    return (dispatch: Dispatch<*>) => googleApi.get()
+    return (dispatch: Dispatch<any>) => googleApi.get()
             .then(() => googleApi.signInIfNotSignedIn())
             .then(() => dispatch({
                 type: SET_GOOGLE_API_STATE,
@@ -160,10 +163,10 @@ export function signIn() {
 /**
  * Logs out the user.
  *
- * @returns {function(Dispatch<*>): Promise<string | never>}
+ * @returns {function(Dispatch<any>): Promise<string | never>}
  */
 export function signOut() {
-    return (dispatch: Dispatch<*>) =>
+    return (dispatch: Dispatch<any>) =>
         googleApi.get()
             .then(() => googleApi.signOut())
             .then(() => {
@@ -181,10 +184,10 @@ export function signOut() {
 /**
  * Updates the profile data that is currently used.
  *
- * @returns {function(Dispatch<*>): Promise<string | never>}
+ * @returns {function(Dispatch<any>): Promise<string | never>}
  */
 export function updateProfile() {
-    return (dispatch: Dispatch<*>) => googleApi.get()
+    return (dispatch: Dispatch<any>) => googleApi.get()
         .then(() => googleApi.signInIfNotSignedIn())
         .then(() => dispatch({
             type: SET_GOOGLE_API_STATE,
@@ -207,11 +210,11 @@ export function updateProfile() {
  * @param {string} id - The event id to update.
  * @param {string} calendarId - The calendar id to use.
  * @param {string} location - The location to add to the event.
- * @returns {function(Dispatch<*>): Promise<string | never>}
+ * @returns {function(Dispatch<any>): Promise<string | never>}
  */
 export function updateCalendarEvent(
         id: string, calendarId: string, location: string) {
-    return (dispatch: Dispatch<*>, getState: Function) =>
+    return (dispatch: Dispatch<any>, getState: Function) =>
         getShareInfoText(getState(), location)
             .then(text =>
                 googleApi._updateCalendarEntry(id, calendarId, location, text));

react/features/invite/actions.js

@@ -1,5 +1,7 @@
 // @flow
 
+import type { Dispatch } from 'redux';
+
 import { getInviteURL } from '../base/connection';
 import { inviteVideoRooms } from '../videosipgw';
 import { getParticipants } from '../base/participants';
@@ -51,7 +53,7 @@ export function invite(
         invitees: Array<Object>,
         showCalleeInfo: boolean = false) {
     return (
-            dispatch: Dispatch<*>,
+            dispatch: Dispatch<any>,
             getState: Function): Promise<Array<Object>> => {
         const state = getState();
         const participants = getParticipants(state);
@@ -161,7 +163,7 @@ export function invite(
  * @returns {Function}
  */
 export function updateDialInNumbers() {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const state = getState();
         const { dialInConfCodeUrl, dialInNumbersUrl, hosts }
             = state['features/base/config'];

react/features/invite/components/InfoDialogButton.web.js

@@ -3,6 +3,7 @@
 import InlineDialog from '@atlaskit/inline-dialog';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { createToolbarEvent, sendAnalytics } from '../../analytics';
 import { openDialog } from '../../base/dialog';
@@ -58,7 +59,7 @@ type Props = {
     /**
      * Invoked to toggle display of the info dialog.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Whether to show the label or not.

react/features/invite/components/InviteButton.native.js

@@ -71,7 +71,7 @@ class InviteButton extends AbstractButton<Props, *> {
  * }}
  * @private
  */
-function _mapDispatchToProps(dispatch: Dispatch<*>) {
+function _mapDispatchToProps(dispatch: Dispatch<any>) {
     return {
 
         /**

react/features/invite/components/add-people-dialog/AbstractAddPeopleDialog.js

@@ -158,7 +158,7 @@ export default class AbstractAddPeopleDialog<P: Props, S: State>
             || this.state.addToCallInProgress;
     }
 
-    _query: (string) => Promise<Array<Object>>;
+    _query: (?string) => Promise<Array<Object>>;
 
     /**
      * Performs a people and phone number search request.

react/features/invite/components/add-people-dialog/native/AddPeopleDialog.js

@@ -268,9 +268,11 @@ class AddPeopleDialog extends AbstractAddPeopleDialog<Props, State> {
                 });
             } else {
                 // Item is not selected yet, need to add to the list.
+                const items: Array<*> = inviteItems.concat(item);
+
                 this.setState({
-                    inviteItems: _.orderBy(
-                        inviteItems.concat(item), [ 'name' ], [ 'asc' ])
+                    // $FlowExpectedError
+                    inviteItems: _.orderBy(items, [ 'name' ], [ 'asc' ])
                 });
             }
         };
@@ -320,10 +322,10 @@ class AddPeopleDialog extends AbstractAddPeopleDialog<Props, State> {
                 }
             });
 
-            selectableItems
-                = _.orderBy(
-                    this.state.inviteItems.concat(selectableItems),
-                    [ 'name' ], [ 'asc' ]);
+            const items = this.state.inviteItems.concat(selectableItems);
+
+            // $FlowExpectedError
+            selectableItems = _.orderBy(items, [ 'name' ], [ 'asc' ]);
 
             this.setState({
                 selectableItems
@@ -402,7 +404,7 @@ class AddPeopleDialog extends AbstractAddPeopleDialog<Props, State> {
         );
     }
 
-    _renderSeparator: () => ?React$Element<*>
+    _renderSeparator: () => React$Element<*> | null
 
     /**
      * Renders the item separator.

react/features/invite/components/add-people-dialog/web/AddPeopleDialog.js

@@ -4,6 +4,7 @@ import Avatar from '@atlaskit/avatar';
 import InlineMessage from '@atlaskit/inline-message';
 import React from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { createInviteDialogEvent, sendAnalytics } from '../../../../analytics';
 import { Dialog, hideDialog } from '../../../../base/dialog';
@@ -38,7 +39,7 @@ type Props = AbstractProps & {
     /**
      * The redux {@code dispatch} function.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Invoked to obtain translated strings.
@@ -267,7 +268,7 @@ class AddPeopleDialog extends AbstractAddPeopleDialog<Props, State> {
             });
     }
 
-    _parseQueryResults: (Array<Object>, string) => Array<Object>;
+    _parseQueryResults: (?Array<Object>) => Array<Object>;
 
     /**
      * Processes results from requesting available numbers and people by munging

react/features/invite/components/callee-info/CalleeInfo.js

@@ -158,4 +158,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(CalleeInfo);

react/features/invite/components/callee-info/CalleeInfoContainer.js

@@ -61,4 +61,5 @@ function _mapStateToProps(state: Object): Object {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(CalleeInfoContainer);

react/features/invite/components/info-dialog/InfoDialog.web.js

@@ -2,6 +2,7 @@
 
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { setPassword } from '../../../base/conference';
 import { getInviteURL } from '../../../base/connection';
@@ -65,7 +66,7 @@ type Props = {
     /**
      * Invoked to open a dialog for adding participants to the conference.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Whether is Atlaskit InlineDialog or a normal dialog.

react/features/large-video/actions.js

@@ -1,5 +1,7 @@
 // @flow
 
+import type { Dispatch } from 'redux';
+
 import {
     createSelectParticipantFailedEvent,
     sendAnalytics
@@ -23,7 +25,7 @@ declare var APP: Object;
  * @returns {Function}
  */
 export function selectParticipant() {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const state = getState();
         const { conference } = state['features/base/conference'];
 
@@ -54,7 +56,7 @@ export function selectParticipant() {
  * @returns {Function}
  */
 export function selectParticipantInLargeVideo() {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         const state = getState();
         const participantId = _electParticipantInLargeVideo(state);
         const largeVideo = state['features/large-video'];

react/features/large-video/components/LargeVideo.native.js

@@ -72,7 +72,7 @@ class LargeVideo extends Component<Props, State> {
      * @param {Object} props - The read-only properties with which the new
      * instance is to be initialized.
      */
-    constructor(props) {
+    constructor(props: Props) {
         super(props);
 
         // Bind event handlers so they are only bound once per instance.
@@ -159,4 +159,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(LargeVideo);

react/features/local-recording/components/LocalRecordingInfoDialog.js

@@ -1,8 +1,9 @@
-/* @flow */
+// @flow
 
 import moment from 'moment';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
+import type { Dispatch } from 'redux';
 
 import { Dialog } from '../../base/dialog';
 import { translate } from '../../base/i18n';
@@ -24,7 +25,7 @@ type Props = {
     /**
      * Redux store dispatch function.
      */
-    dispatch: Dispatch<*>,
+    dispatch: Dispatch<any>,
 
     /**
      * Current encoding format.

react/features/local-recording/recording/flac/flacEncodeWorker.js

@@ -69,17 +69,17 @@ const EncoderState = Object.freeze({
     /**
      * Initial state, when libflac.js is not initialized.
      */
-    UNINTIALIZED: Symbol('uninitialized'),
+    UNINTIALIZED: 'uninitialized',
 
     /**
      * Actively encoding new audio bits.
      */
-    WORKING: Symbol('working'),
+    WORKING: 'working',
 
     /**
      * Encoding has finished and encoded bits are available.
      */
-    FINISHED: Symbol('finished')
+    FINISHED: 'finished'
 });
 
 /**

react/features/mobile/background/actions.js

@@ -1,4 +1,6 @@
-/* @flow */
+// @flow
+
+import type { Dispatch } from 'redux';
 
 import {
     createTrackMutedEvent,
@@ -37,7 +39,7 @@ export function _setAppStateListener(listener: ?Function) {
  * @returns {Function}
  */
 export function _setBackgroundVideoMuted(muted: boolean) {
-    return (dispatch: Dispatch<*>, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         // Disable remote video when we mute by setting lastN to 0. Skip it if
         // the conference is in audio-only mode, as it's already configured to
         // have no video. Leave it as undefined when unmuting, the default value

react/features/mobile/background/middleware.js

@@ -91,7 +91,7 @@ function _appStateChanged(dispatch: Function, appState: string) {
  * @private
  * @returns {void}
  */
-function _onAppStateChange(dispatch: Dispatch<*>, appState: string) {
+function _onAppStateChange(dispatch: Dispatch<any>, appState: string) {
     dispatch(appStateChanged(appState));
 }
 

react/features/mobile/network-activity/components/NetworkActivityIndicator.js

@@ -1,4 +1,4 @@
-/* @flow */
+// @flow
 
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
@@ -52,4 +52,5 @@ function _mapStateToProps(state) {
     };
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(NetworkActivityIndicator);

react/features/mobile/picture-in-picture/actions.js

@@ -1,6 +1,7 @@
 // @flow
 
 import { NativeModules } from 'react-native';
+import type { Dispatch } from 'redux';
 
 import { getAppProp } from '../../base/app';
 import { Platform } from '../../base/react';
@@ -20,7 +21,7 @@ const logger = require('jitsi-meet-logger').getLogger(__filename);
  * @returns {Function}
  */
 export function enterPictureInPicture() {
-    return (dispatch: Dispatch, getState: Function) => {
+    return (dispatch: Dispatch<any>, getState: Function) => {
         // XXX At the time of this writing this action can only be dispatched by
         // the button which is on the conference view, which means that it's
         // fine to enter PiP mode.

react/features/notifications/components/NotificationsContainer.web.js

@@ -63,4 +63,5 @@ class NotificationsContainer extends AbstractNotificationsContainer<Props> {
     }
 }
 
+// $FlowExpectedError
 export default connect(_mapStateToProps)(NotificationsContainer);