title: Pass context from useQuery to Apollo client
body: <p>I'm building an next.js app in which I intend to consume several graphql-apis. I would like to pass a context when using the <code>useQuery</code> from <code>@apollo/react-hooks</code> in my components. At the moment my client looks like this:</p>
  
  <pre><code>import { ApolloClient } from '@apollo/client'
  import { InMemoryCache } from 'apollo-cache-inmemory'
  import { HttpLink } from 'apollo-link-http'
  import { ApolloLink } from 'apollo-link'
  
  let apolloClient
  
  function createApolloClient() {
      return new ApolloClient({
          ssrMode: typeof window === 'undefined',
          link: new ApolloLink((operation) =&gt; {
              console.log(operation.getContext())
              return new HttpLink({
                  uri: 'http://localhost:1337/graphql', // Server URL (must be absolute)
                  credentials: 'same-origin', // Additional fetch() options like `credentials` or `headers`
              }).request(operation)
          }),
          cache: new InMemoryCache(),
      })
  }
  
  export function initializeApollo(initialState = null) {
      const _apolloClient = apolloClient ?? createApolloClient()
  
      // If your page has Next.js data fetching methods that use Apollo Client, the initial state
      // get hydrated here
      if (initialState) {
          _apolloClient.cache.restore(initialState)
      }
      // For SSG and SSR always create a new Apollo Client
      if (typeof window === 'undefined') return _apolloClient
      // Create the Apollo Client once in the client
      if (!apolloClient) apolloClient = _apolloClient
  
      return _apolloClient
  }
  
  export function useApollo(initialState) {
      const store = useMemo(() =&gt; initializeApollo(initialState), [initialState])
      return store
  }
  </code></pre>
  
  <p>and my Sample component looks like this: </p>
  
  <pre><code>import gql from 'graphql-tag'
  
  import { useQuery } from '@apollo/react-hooks'
  import { initializeApollo } from '../lib/apolloClient'
  
  interface Props {}
  
  export const STRAPI = gql`
      query {
          questions {
              question
          }
      }
  `
  
  const Sample = (props: Props) =&gt; {
      const {
          loading: strapiLoading,
          error: strapiError,
          data: strapiData,
      } = useQuery(STRAPI, {
          context: {
              api: 'strapi',
          },
          notifyOnNetworkStatusChange: true,
      })
      return (
          &lt;div&gt;
              &lt;h1&gt;{strapiData.questions[0].question}&lt;/h1&gt;
          &lt;/div&gt;
      )
  }
  
  export async function getStaticProps() {
      const apolloClient = initializeApollo()
  
      await apolloClient.query({
          query: STRAPI,
      })
  
      return {
          props: {
              initialApolloState: apolloClient.cache.extract(),
          },
          unstable_revalidate: 1,
      }
  }
  
  export default Sample
  </code></pre>
  
  <p>In the client I try to print the context with <code>console.log(operation.getContext())</code> and I expected to see <code>'context: 'api'</code> somewhere...but nothing. Could someone help me? </p>