text: import React, { Component } from 'react';
  import Injector from './Container';
  import withInjector from './withInjector';
  
  /**
   * Loads the graphql HOC generated by injector
   *
   * @todo investigate converting context to a callback which returns context, performance may
   * be an issue
   *
   * @param key
   * @param context
   */
  const injectGraphql = (key, context) => (DataHandler) => {
    class GraphqlInjector extends Component {
      constructor(props) {
        super(props);
  
        this.state = {
          target: null,
          error: false,
        };
      }
  
      componentWillMount() {
        Injector.ready(() => {
          let error = true;
          let target = null;
          try {
            const graphqlContainer = this.context.injector.query(key, context);
            const apolloHOC = graphqlContainer.getApolloHOC();
            target = apolloHOC(DataHandler);
            error = false;
          } catch (e) {
            this.setState({ target, error });
  
            // re-throw the error, as we do not want to silence it in the console
            throw e;
          }
  
          this.setState({ target, error });
        });
      }
  
      render() {
        if (this.state.error) {
          const query = [key, context].join('.');
          const message = `Error loading '${query}', perhaps it wasn't registered properly?`;
          return <div>{message}</div>;
        }
  
        const Target = this.state.target;
        if (Target) {
          return <Target {...this.props} />;
        }
  
        return null;
      }
    }
  
    return withInjector(GraphqlInjector);
  };
  
  export default injectGraphql;
  