title: Nextjs graphql apollo cache is always returning null
body: <p>I'm trying to update the cache and create an item on [post page]. After the item is created, retrieve the latest created item on [list page].</p>
  <pre><code>mutation CREATE_JOB($input: jobInputType!){
       createJob(input: $input){
        _id,
        address
      }
  }
  </code></pre>
  <p>post.tsx</p>
  <pre><code>const updateCache = (cache: any, mutationResult: any) =&gt; {
      const newTask = mutationResult.data.createJob;
      const data = cache.readQuery({ 
        query: LIST_JOBS, 
      }); 
      console.log(data) // this is null
      cache.writeQuery({
        query: LIST_JOBS,
        variables: { input: newTask.type },
        data: { tasks: [...data.jobs, newTask] }
      })
    }
  
  export default function postJob() {
      const [
          createJob,
          { loading: mutationLoading, error: mutationError },
        ] = useMutation(CREATE_JOB, { update: updateCache });
  
      const onFinish = (values: any) =&gt; {
          const newJob = {...values, status: &quot;POSTED&quot; }
          newJob.status = &quot;POSTED&quot;
  
          console.log('Success ONFINISH:', newJob);
          createJob({variables: {input: newJob}})
          .then(_data =&gt; console.log(_data))
      }
  }
  </code></pre>
  <p>list.tsx</p>
  <pre><code>const { data, loading, error } = useQuery(LIST_JOBS);
  </code></pre>
  <p>app.tsx </p>
  <pre><code>const client = new ApolloClient({
    uri: &quot;http://localhost:3005/graphql&quot;,
    cache: new InMemoryCache(),
  });
  
  function MyApp({ Component, pageProps }: AppProps) {
    return (
      &lt;ApolloProvider client={client}&gt;
        &lt;UserProvider&gt;
         &lt;Component {...pageProps} /&gt;
        &lt;/UserProvider&gt;
      &lt;/ApolloProvider&gt;
    );
  }
  </code></pre>
  <p>Really appreciate anyone could help me figure out why cache.readQuery returns null
  Cheers</p>