Prefetching Data Decorator

fetch_data.js

import React, { Component, PropTypes } from 'react';
import hoistStatics from 'hoist-non-react-statics';

const { shape, func } = PropTypes;
let initialRender = true;

export function rendered() {
  initialRender = false;
}

export default (fetch) => {
  return WrappedComponent => {
    class FetchDataDecorator extends Component {
      static WrappedComponent = WrappedComponent;
      static fetchData = fetch;

      static contextTypes = {
        store: shape({
          subscribe: func.isRequired,
          dispatch: func.isRequired,
          getState: func.isRequired
        })
      };

      componentDidMount() {
        if (initialRender) return;

        const { getState, dispatch } = this.context.store;

        fetch(getState(), dispatch);
      }

      render() {
        return <WrappedComponent {...this.props} />;
      }
    }

    return hoistStatics(FetchDataDecorator, WrappedComponent)
  };
}