With usual Compose and GraphQL from react apollo

usual-compose-graphql.js

import React, { PureComponent } from 'react';
import { View, Text } from 'react-native';
import { graphql, compose } from 'react-apollo';

import ErrorComponent from './components/ErrorComponent';
import LoadingComponent from './components/Loader';

import GET_LINEITEMS from './query/LineItem/GET_LINEITEMS';
import GET_DELIVERABLE_LIST from './query/Deliverables/GET_DELIVERABLE_LIST';
import GET_PROJECTROLE from './query/ProjectRoles/GET_PROJECTROLE';

class Dummy extends PureComponent {
  render() {
    const {
      getLineItem: { getLineItem, error: getLoadingError, loading: getLoadingItemLoading },
      projectRoles: { projectRoles, error: projectRolesError, loading: projectRolesLoading },
      deliverableList: {
        deliverableList,
        error: deliverableListError,
        loading: deliverableListLoading,
      },
    } = this.props;

    if (getLoadingError || projectRolesError || deliverableListError) {
      return <ErrorComponent />;
    }

    if (getLoadingItemLoading || projectRolesLoading || deliverableListLoading) {
      return <LoadingComponent />;
    }

    // Work With Real Data
    console.log(getLineItem, projectRoles, deliverableList);

    return (
      <View>
        <Text>Work With Real Data</Text>
      </View>
    );
  }
}

export default compose(
  graphql(GET_LINEITEMS, {
    name: 'getLineItem',
    options: props => ({
      variables: {
        id: props.deliverableId,
        projectId: props.projectId,
      },
    }),
  }),
  graphql(GET_DELIVERABLE_LIST, {
    name: 'deliverableList',
  }),
  graphql(GET_PROJECTROLE, {
    name: 'projectRoles',
    options: props => ({
      variables: {
        id: props.projectId,
      },
    }),
  })
)(Dummy);