[RN] Fix eslint & flow errors
This commit is contained in:
parent
3e9d26b525
commit
bce2a9fba9
|
@ -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;
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
/* @flow */
|
// @flow
|
||||||
|
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import {
|
import {
|
||||||
|
|
|
@ -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.
|
||||||
|
|
|
@ -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));
|
||||||
|
|
|
@ -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));
|
||||||
|
|
Loading…
Reference in New Issue