React Native - ListView with infinite scroll and a Banner on Header

Home.js

import React, { Component, PropTypes } from 'react';
import { View, ListView, RefreshControl } from 'react-native';
import { connect } from 'react-redux';
import { NoticiaItem } from './../../components/NoticiaItem';
import { NoticiaBanner } from './../../components/NoticiaBanner';
import * as actions from './../../actions';
import styles from './styles';
import { colors } from './../../config/styles';
import { DESTAQUES } from '../../data/categories';
import banners from '../../data/banners';

class Home extends Component {
    componentDidMount() {
        this.noticiaFetch(1);
        //this.props.noticiaBannerFetch();
    }

    _onRefresh() {
        this.noticiaFetch(1);
    }

    _onEndReached() {
        setTimeout(() => {
            this.noticiaFetch(this.props.page);
        }, 500);
    }

    noticiaFetch(page) {
        this.props.noticiaByCategoriaFetch({ page, categoria: DESTAQUES });
    }

    _keyExtractor = (item) => item.id;

    renderHeader() {
        const banner = banners[Math.floor(Math.random() * banners.length)];
                
        if (this.props.loading) {
            return (
                <View style={styles.headerContainer} />                    
            );
        }

        return (
            <View style={styles.headerContainer}>
                <NoticiaBanner
                    item={banner}
                    navigation={this.props.navigation}
                />
            </View>
        );
    }

    renderRow(noticia) {
        return (
            <NoticiaItem
                item={noticia}
                title={DESTAQUES.title}
                navigation={this.props.navigation}
            />
        );
    }

    render() {
        return (
            <View style={styles.container} >
                <ListView
                    enableEmptySections
                    dataSource={this.props.dataSource}
                    renderHeader={() => this.renderHeader()}
                    renderRow={rowData => this.renderRow(rowData)}
                    onEndReached={() => this._onEndReached()}
                    onEndReachedThreshold={15}
                    automaticallyAdjustContentInsetsts={false}
                    refreshControl={
                        <RefreshControl
                            refreshing={this.props.loading}
                            onRefresh={this._onRefresh.bind(this)}
                            tintColor={colors.mainApp}
                            colors={colors.refreshControl}
                        />
                    }
                />
            </View>
        );
    }
}

Home.navigationOptions = {
    tabBarLabel: DESTAQUES.title,
    drawerLabel: 'Home'
};

Home.propTypes = {
    dataSource: PropTypes.object
};

const dataSource = new ListView.DataSource({
    rowHasChanged: (r1, r2) => r1 !== r2,
});

const mapStateToProps = ({ noticia }) => {
    return {
        dataSource: dataSource.cloneWithRows(noticia.list),
        loading: noticia.loading,
        page: noticia.page
    };
};

export default connect(mapStateToProps, actions)(Home);