[RN] Fix eslint & flow errors

This commit is contained in:
Lyubo Marinov 2017-11-03 15:14:38 -05:00
parent 3e9d26b525
commit bce2a9fba9
5 changed files with 61 additions and 46 deletions

View File

@ -1,42 +1,64 @@
// @flow // @flow
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import React, { Component } from 'react'; import React, { Component } from 'react';
import { connect } from 'react-redux'; 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} * Checks if given React component decorated in {@link AspectRatioAwareWrapper}
* which provides the <tt>aspectRatio</tt> property updated on each Redux state * has currently the {@link ASPECT_RATIO_NARROW} set in the aspect ratio
* change. * 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} * @returns {AspectRatioAwareWrapper}
*/ */
export function AspectRatioAware( export function makeAspectRatioAware(
WrapperComponent: ReactClass<*>): ReactClass<*> { WrappedComponent: Class<React$Component<*>>
return connect(_mapStateToProps)( ): Class<React$Component<*>> {
class AspectRatioAwareWrapper extends Component { /**
* Renders {@code WrappedComponent} with the React prop {@code aspectRatio}.
*/
class AspectRatioAware extends Component<*> {
/**
* Properties of the aspect ratio aware wrapper.
*/
static propTypes = {
/** /**
* Properties of the aspect ratio aware wrapper. * Either {@link ASPECT_RATIO_NARROW} or {@link ASPECT_RATIO_WIDE}.
*/ */
static propTypes = { aspectRatio: PropTypes.oneOf([
/** ASPECT_RATIO_NARROW,
* Either {@link ASPECT_RATIO_NARROW} or ASPECT_RATIO_WIDE
* {@link ASPECT_RATIO_WIDE}. ])
*/ }
aspectRatio: PropTypes.symbol
}
/** /**
* Implement's React render method to wrap the nested component. * Implement's React render method to wrap the nested component.
* *
* @returns {XML} * @returns {React$Element}
*/ */
render(): 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 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;
}

View File

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

View File

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

View File

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

View File

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