How to use the apollo-client.NetworkStatus.loading function in apollo-client

const NewEvent = ({ createEvent, data: { networkStatus, event, eventTypes, offices, organizations } }) =>
  networkStatus === NetworkStatus.loading ? (
    
  ) : (
    
  )

const Users = ({ data: { networkStatus, users }, deleteUser, togglePopover, destroyUserPopover }) =>
  networkStatus === NetworkStatus.loading ? (
    
  ) : (
    <div>
       null}
        data={users}
        columns={columns(togglePopover)}
        minRows={0}
        defaultFilterMethod={defaultFilterMethod}
        getProps={containerProps}
        getTableProps={tableProps}
        getTheadProps={theadProps}
        getTheadThProps={thProps}
        getTrGroupProps={trProps}
        getTrProps={trProps}
        getTdProps={tdProps}</div>

const ReportingPage = ({
  data: { networkStatus, users },
  reportingStartDate,
  reportingEndDate,
  changeAdminReportingStart,
  changeAdminReportingEnd,
}) =>
  networkStatus === NetworkStatus.loading ? (
    
  ) : (
    <div>
      <div>
        
      </div>
    </div>
  )

data: { networkStatus, fetchMore, currentUser, events, offices },
  locationBeforeTransitions,
  filters,
  eventPopover,
  togglePopover,
  changeShowFilter,
  changeEventFilter,
  changeOfficeFilter,
  createSignup,
  destroySignup,
  calendarDateChange,
  calendarDate,
}) => (
  <div>
    
    {eventPopover ? (
      </div>

const EditOrganization = ({ data: { networkStatus, organization }, updateOrganization }) =>
  networkStatus === NetworkStatus.loading ? (
    
  ) : (
    
  )

render() {
    const {
      data: { networkStatus, currentUser, offices },
      togglePopover,
      popover,
      children,
      updateUserOffice,
    } = this.props

    return (
      
        {children}
      
    )
  }
}

const Organizations = ({
  data: { networkStatus, organizations },
  deleteOrganization,
  togglePopover,
  destroyOrganizationPopover,
}) =>
  networkStatus === NetworkStatus.loading ? (
    
  ) : (
    <div>
      <div>
        
          <button>Add Organization</button>
        
      </div>
       null}
        data={organizations}
        columns={columns(togglePopover)}
        minRows={0}
        defaultFilterMethod={defaultFilterMethod}
        getProps={containerProps}
        getTableProps={tableProps}</div>

const LeaderboardContainer = ({
  data: { networkStatus, volunteers, offices, currentUser },
  dashboardOfficeFilter,
  changeDashboardOfficeFilter,
}) =>
  networkStatus === NetworkStatus.loading ? (
    
  ) : (
    <div>
      <div>
        <div>Top Volunteers</div>
        
      </div>
      {sortByHours(volunteers).map((user, i) =&gt; (
        <div>
          
          <span>{user.hours} hours</span>
        </div></div>

const EditEvent = ({
  data: { networkStatus, event, eventTypes, offices, organizations },
  updateEvent,
  destroySignup,
}) =>
  networkStatus === NetworkStatus.loading ? (
    
  ) : (
     destroySignup(event, user)}
      organizations={organizations}
      onSubmit={updateEvent}
    />
  )

const EventTypes = ({ data: { networkStatus, eventTypes }, deleteEventType, togglePopover, destroyEventTypePopover }) =>
  networkStatus === NetworkStatus.loading ? (
    
  ) : (
    <div>
      <div>
        
          <button>Add Event Type</button>
        
      </div>
       null}
        data={eventTypes}
        columns={columns(togglePopover)}
        minRows={0}
        defaultFilterMethod={defaultFilterMethod}
        getProps={containerProps}
        getTableProps={tableProps}</div>