withOrientation.js.flow
1.26 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
// @flow
import * as React from 'react';
import { Dimensions } from 'react-native';
import hoistNonReactStatic from 'hoist-non-react-statics';
type WindowDimensions = {
width: number,
height: number,
};
type InjectedProps = {
isLandscape: boolean,
};
type State = {
isLandscape: boolean,
};
export const isOrientationLandscape = ({
width,
height,
}: WindowDimensions): boolean => width > height;
export default function<T: {}>(
WrappedComponent: React.ComponentType<T & InjectedProps>
) {
class withOrientation extends React.Component<T, State> {
constructor() {
super();
const isLandscape = isOrientationLandscape(Dimensions.get('window'));
this.state = { isLandscape };
}
componentDidMount() {
Dimensions.addEventListener('change', this.handleOrientationChange);
}
componentWillUnmount() {
Dimensions.removeEventListener('change', this.handleOrientationChange);
}
handleOrientationChange = ({ window }: { window: WindowDimensions }) => {
const isLandscape = isOrientationLandscape(window);
this.setState({ isLandscape });
};
render() {
return <WrappedComponent {...this.props} {...this.state} />;
}
}
return hoistNonReactStatic(withOrientation, WrappedComponent);
}