How to use the react-apollo.compose function in react-apollo

mostSearchedTerms: PropTypes.arrayOf(PropTypes.shape()),
  searchTerm: PropTypes.string.isRequired,
  addToSearchHistory: PropTypes.func.isRequired,
  searchHistory: PropTypes.arrayOf(PropTypes.string),
  client: PropTypes.instanceOf(ApolloClient).isRequired,
};

SearchScreen.defaultProps = {
  navigator: undefined,
  mostSearchedTerms: [],
  searchHistory: [],
};

export default withApollo(
  preventNavStackDuplicate(
    compose(
      // Queries
      graphql(mostSearched, {
        props: ({ data: { mostSearched: mostSearchedTerms, refetch: refetchMostSearched } }) => ({
          mostSearchedTerms,
          refetchMostSearched,
        }),
        options: () => ({
          fetchPolicy: 'cache-and-network',
        }),
      }),

      graphql(SEARCH_TERM, {
        props: ({ data: { searchTerm: searchTermData } }) =>
          searchTermData ? { searchTerm: searchTermData.term } : { searchTerm: '' },
      }),
      graphql(SEARCH_HISTORY, {

) : null}
          
        
      
    );
  }
}

const mapStateToProps = state => ({
  lang: state.i18n.locale,
  slug: state.debate.debateData.slug
});

export default compose(
  connect(mapStateToProps),
  graphql(SynthesesQuery, {
    props: ({ data }) => {
      if (data.error || data.loading) {
        return {
          error: data.error,
          loading: data.loading
        };
      }

      return {
        error: data.error,
        loading: data.loading,
        syntheses: data.syntheses,
        hasSyntheses: data && data.syntheses ? data.syntheses.length > 0 : false
      };

right: 20,
    backgroundColor: Colors.background.fullWhite,
    elevation: 2,
    zIndex: 200,
    overflow: 'hidden',
  },
  myLocationIcon: {
    width: 48,
    height: 48,
    borderRadius: 24,
    alignItems: 'center',
    justifyContent: 'center',
  },
});

const ShareLocationWithData = compose(withStopSpecific, withGroupParticipantIds)(ShareLocation);

class RouteMap extends PureComponent {
  static navigationOptions = {
    header: null,
  };

  constructor(props) {
    super(props);
    this.mapView = null;
    this.state = ({
      myLocationIconBottom: 20,
      showTurnOnGpsModal: false,
      fetchingPosition: false,
      initialRegion: {
        longitude: 0,
        latitude: 0,

}
              <div>
                <button type="button">Continue editing</button>
                
                  <button type="button">{isNewVersion ? "Go to new version" : "Go to updated version"}</button>
                
              </div>
            
          }
        
      
    )
  }
}

export default withRouter(compose(
  withApollo,
  withRouter,
  graphql(getAppConfigGroups, {
    name: "getAppConfigGroups",
    options: ({ match, app, fromLicenseFlow }) =&gt; {
      let sequence;
      if (fromLicenseFlow) {
        sequence = 0;
      } else if (match.params.sequence != undefined) {
        sequence = match.params.sequence;
      } else {
        sequence = app.currentSequence;
      }
      const slug = fromLicenseFlow ? match.params.slug : app.slug;
      return {
        variables: {

const extendedProps = {
    ...props,
    boardId: board ? board._id : null
  };

  return ;
};

const propTypes = {
  boardGetDefaultQuery: PropTypes.object
};

DealAddFormContainer.propTypes = propTypes;

export default compose(
  graphql(gql(queries.boardGetDefault), {
    name: 'boardGetDefaultQuery'
  })
)(DealAddFormContainer);

)
})

const PayNoteCta = ({ variation, payload, position, darkMode }) => {
  return (
    <div>
      {variation.cta === 'try' ? (
        
      ) : (
        
      )}
    </div>
  )
}

export const PayNote = compose(
  withRouter,
  withInNativeApp,
  withMemberStatus
)(
  ({
    router: { query },
    inNativeIOSApp,
    isEligibleForTrial,
    seed,
    trial,
    documentId,
    repoId,
    series,
    position
  }) =&gt; {
    const variation = getPayNoteVariation({

import {compose} from 'react-apollo'
import Component from './ContentEditor.component.js'
import query from '../../../apollo/queries/content'
import mutation from '../../../apollo/mutations/editContent'

export default compose(query, mutation)(Component)

import Frame from '../components/Frame'
import Discussion from '../components/Discussion/Discussion'
import DiscussionIndex from '../components/Discussion/DiscussionIndex'

const DiscussionPage = ({ router: { query } }) => (
  
    {query.id
      ? 
      : }
  
)

export default compose(withRouter)(DiscussionPage)

})
      }
    }),
    options: {
      refetchQueries: [{ query: ListEvents }],
      update: (dataProxy, { data: { deleteEvent: { id } } }) => {
        const query = ListEvents;
        const data = dataProxy.readQuery({ query });
        data.listEvents.items = data.listEvents.items.filter(event => event.id !== id);
        dataProxy.writeQuery({ query, data });
      }
    }
  }),
)(AllEvents);

const AddEventData = compose(
  graphql(CreateEvent, {
    options: {
      refetchQueries: [{ query: ListEvents }],
      update: (dataProxy, { data: { createEvent } }) => {
        const query = ListEvents;
        const data = dataProxy.readQuery({ query });
        data.listEvents = {
          ...data.listEvents,
          items: [
            ...data.listEvents.items,
            createEvent
          ]
        }
        dataProxy.writeQuery({ query, data });
      }
    },

variables: {
      objId,
      userId,
      subdomain,
      thematicFilter: {
        limit: 10,
      }
    }
  })
}

let EditObj = graphql(editOrCreateDetail, {
  name: "editDetail",
})(Component)

export default compose(
  graphql(query, queryOptions),
  graphql(editOrCreateObj, {
    name: "editObj",
  }),
  graphql(deleteObj, {
    name: "deleteObj",
  }),
)(
  EditObj
)