render()

in js/common/F8Header.js [99:169]

• 68 lines of code
• 10 McCabe index (conditional complexity)

  render() {
    const {
      navItem,
      leftItem,
      rightItem,
      extraItems,
      backgroundColor,
      titleColor
    } = this.props;

    let actions = [];
    if (leftItem) {
      const { title, icon, layout } = leftItem;
      actions.push({
        icon: layout !== "title" ? icon : undefined,
        title: title,
        show: "always"
      });
    }
    if (rightItem) {
      const { title, icon, layout } = rightItem;
      actions.push({
        icon: layout !== "title" ? icon : undefined,
        title: title,
        show: "always"
      });
    }
    if (extraItems) {
      actions = actions.concat(
        extraItems.map(item => ({
          title: item.title,
          show: "never"
        }))
      );
    }

    let content;
    if (React.Children.count(this.props.children) > 0) {
      content = (
        <View collapsable={false} style={{ flex: 1 }}>
          {this.props.children}
        </View>
      );
    } else {
      content = (
        <View collapsable={false} style={{ flex: 1, justifyContent: "center" }}>
          <HeaderTitle numberOfLines={1} style={{ color: titleColor }}>
            {this.props.title}
          </HeaderTitle>
        </View>
      );
    }

    return (
      <View style={[styles.header, { backgroundColor }, this.props.style]}>
        <ToolbarAndroid
          navIcon={navItem && navItem.icon}
          onIconClicked={navItem && navItem.onPress}
          title={this.props.title}
          titleColor={titleColor}
          subtitleColor={titleColor}
          actions={actions}
          onActionSelected={this.handleActionSelected.bind(this)}
          style={styles.toolbar}
        >
          {content}
        </ToolbarAndroid>
        <Text style={{ height: 0, opacity: 0 }}>{actions.length || 0}</Text>
      </View>
    );
  }