All files / grid Grid.js

100% Statements 11/11
100% Branches 12/12
100% Functions 3/3
100% Lines 11/11
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 56 57 58 59 60 61 62 63 64 65 66 67 68 69                          3x 3x 2x 1x       3x       3x   3x 1x                             2x                           1x             1x          
import React, { Component, PropTypes } from 'react';
import { View, StyleSheet, TouchableOpacity } from 'react-native';
import Row from './Row';
 
class Grid extends Component {
  styles = StyleSheet.create({
    container: {
      flex: 1,
      flexDirection: this.isRow() ? 'column' : 'row',
    },
  })
 
  isRow() {
    let isRow = false;
    React.Children.forEach(this.props.children, (child) => {
      if (child && child.type === Row) {
        isRow = true;
      }
    });
 
    return isRow;
  }
 
  render() {
    const {onPress, activeOpacity, containerStyle} = this.props;
 
    if (onPress) {
      return (
        <TouchableOpacity activeOpacity={activeOpacity} onPress={onPress}>
          <View
            style={[
              this.styles.container,
              containerStyle && containerStyle,
            ]}
            {...this.props}
          >
            {this.props.children}
          </View>
        </TouchableOpacity>
      );
    }
 
    return (
      <View
        style={[
          this.styles.container,
          containerStyle && containerStyle,
        ]}
        {...this.props}
      >
        {this.props.children}
      </View>
    );
  }
}
 
Grid.propTypes = {
  containerStyle: PropTypes.any,
  onPress: PropTypes.func,
  activeOpacity: PropTypes.number,
  children: PropTypes.any,
};
 
Grid.defaultProps = {
  activeOpacity: 1,
};
 
export default Grid;