[RN] Fix eslint & flow errors

react/features/base/aspect-ratio/components/AspectRatioAware.js

@@ -1,42 +1,64 @@
 // @flow
+
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 
-import { ASPECT_RATIO_NARROW } from '../constants';
+import { ASPECT_RATIO_NARROW, ASPECT_RATIO_WIDE } from '../constants';
 
 /**
- * Decorates given React component class into {@link AspectRatioAwareWrapper}
- * which provides the <tt>aspectRatio</tt> property updated on each Redux state
- * change.
+ * Checks if given React component decorated in {@link AspectRatioAwareWrapper}
+ * has currently the {@link ASPECT_RATIO_NARROW} set in the aspect ratio
+ * property.
  *
- * @param {ReactClass} WrapperComponent - A React component class to be wrapped.
+ * @param {AspectRatioAwareWrapper} component - A
+ * {@link AspectRatioAwareWrapper} which has <tt>aspectRation</tt> property.
+ * @returns {boolean}
+ */
+export function isNarrowAspectRatio(component: React$Component<*>) {
+    return component.props.aspectRatio === ASPECT_RATIO_NARROW;
+}
+
+/**
+ * Decorates a specific React {@code Component} class into an
+ * {@link AspectRatioAware} which provides the React prop {@code aspectRatio}
+ * updated on each redux state change.
+ *
+ * @param {Class<React$Component>} WrappedComponent - A React {@code Component}
+ * class to be wrapped.
  * @returns {AspectRatioAwareWrapper}
  */
-export function AspectRatioAware(
-        WrapperComponent: ReactClass<*>): ReactClass<*> {
-    return connect(_mapStateToProps)(
-        class AspectRatioAwareWrapper extends Component {
+export function makeAspectRatioAware(
+        WrappedComponent: Class<React$Component<*>>
+): Class<React$Component<*>> {
+    /**
+     * Renders {@code WrappedComponent} with the React prop {@code aspectRatio}.
+     */
+    class AspectRatioAware extends Component<*> {
         /**
          * Properties of the aspect ratio aware wrapper.
          */
         static propTypes = {
             /**
-                 * Either {@link ASPECT_RATIO_NARROW} or
-                 * {@link ASPECT_RATIO_WIDE}.
+             * Either {@link ASPECT_RATIO_NARROW} or {@link ASPECT_RATIO_WIDE}.
              */
-                aspectRatio: PropTypes.symbol
+            aspectRatio: PropTypes.oneOf([
+                ASPECT_RATIO_NARROW,
+                ASPECT_RATIO_WIDE
+            ])
         }
 
         /**
          * Implement's React render method to wrap the nested component.
          *
-             * @returns {XML}
+         * @returns {React$Element}
          */
         render(): React$Element<*> {
-                return <WrapperComponent { ...this.props } />;
+            return <WrappedComponent { ...this.props } />;
         }
-        });
+    }
+
+    return connect(_mapStateToProps)(AspectRatioAware);
 }
 
 /**
@@ -53,16 +75,3 @@ function _mapStateToProps(state) {
         aspectRatio: state['features/base/aspect-ratio'].aspectRatio
     };
 }
-
-/**
- * Checks if given React component decorated in {@link AspectRatioAwareWrapper}
- * has currently the {@link ASPECT_RATIO_NARROW} set in the aspect ratio
- * property.
- *
- * @param {AspectRatioAwareWrapper} component - A
- * {@link AspectRatioAwareWrapper} which has <tt>aspectRation</tt> property.
- * @returns {boolean}
- */
-export function isNarrowAspectRatio(component: ReactClass<*>) {
-    return component.props.aspectRatio === ASPECT_RATIO_NARROW;
-}

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

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

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

@@ -114,7 +114,7 @@ class Conference extends Component {
      * after this component is mounted.
      *
      * @inheritdoc
-     * returns {void}
+     * @returns {void}
      */
     componentDidMount() {
         // Set handling any hardware button presses for back navigation up.

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

@@ -1,11 +1,14 @@
-/* @flow */
+// @flow
 
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { ScrollView } from 'react-native';
 import { connect } from 'react-redux';
 
-import { AspectRatioAware, isNarrowAspectRatio } from '../../base/aspect-ratio';
+import {
+    isNarrowAspectRatio,
+    makeAspectRatioAware
+} from '../../base/aspect-ratio';
 import { Container } from '../../base/react';
 
 import Thumbnail from './Thumbnail';
@@ -148,4 +151,4 @@ function _mapStateToProps(state) {
     };
 }
 
-export default connect(_mapStateToProps)(AspectRatioAware(Filmstrip));
+export default connect(_mapStateToProps)(makeAspectRatioAware(Filmstrip));

react/features/toolbox/components/Toolbox.native.js

@@ -4,7 +4,10 @@ import { View } from 'react-native';
 import { connect } from 'react-redux';
 
 import { sendAnalyticsEvent } from '../../analytics';
-import { AspectRatioAware, isNarrowAspectRatio } from '../../base/aspect-ratio';
+import {
+    isNarrowAspectRatio,
+    makeAspectRatioAware
+} from '../../base/aspect-ratio';
 import { toggleAudioOnly } from '../../base/conference';
 import {
     MEDIA_TYPE,
@@ -439,4 +442,4 @@ function _mapStateToProps(state) {
 }
 
 export default connect(_mapStateToProps, _mapDispatchToProps)(
-    AspectRatioAware(Toolbox));
+    makeAspectRatioAware(Toolbox));