Report.js

/**
 * Created by rob on 11/18/15.
 */
import React, {Component, PropTypes} from 'react';
import {connect} from 'react-redux';
import * as reportActions from 'redux/modules/reporting';
import {isLoaded, load} from 'redux/modules/reporting';
import connectData from 'helpers/connectData';
import { ReportItem } from 'components';

function fetchDataDeferred(getState, dispatch) {
  if (!isLoaded(getState())) {
    return dispatch(load());
  }
}

@connectData(null, fetchDataDeferred)
@connect(
  state => ({
    items: state.reporting.data,
    error: state.reporting.error,
    loading: state.reporting.loading
  }),
  {...reportActions})
export default class Report extends Component {
  static propTypes = {
    items: PropTypes.array,
    error: PropTypes.string,
    loading: PropTypes.bool
  }
  render() {
    const {items, error} = this.props;

    const styles = require('./Report.scss');
    console.log(items);
    return (<div className={styles.report}> <h1>test</h1>
      {error &&
      <div className="alert alert-danger" role="alert">
        <span className="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
        {' '}
        {error}
      </div>}
      <ul>
        {items.map(item =>
          <li><button><ReportItem entry={item} key={item.id}/></button></li>
        )}
      </ul>

    </div>);
  }
}