next-with-apollo icon indicating copy to clipboard operation
next-with-apollo copied to clipboard

Changelog + migration v4 > v5

Open Vadorequest opened this issue 5 years ago • 0 comments

There is no changelog regarding the versions of this project. And no indication about what are the breaking changes and how to upgrade.

Could you add a CHANGELOG.md file? And explain what are the breaking changes of v5 and how to upgrade a v4 example to v5? Thank you!

For instance, here is my v4.3.0 setup:

src/hoc/withUniversalGraphQLDataLoader.ts

import { InMemoryCache, NormalizedCacheObject } from 'apollo-cache-inmemory';
import { ApolloClient } from 'apollo-client';
import { createHttpLink } from 'apollo-link-http';
import fetch from 'isomorphic-unfetch';
import withApollo, { InitApolloOptions } from 'next-with-apollo';

// XXX This config is used on the FRONTEND (from the browser) or on the BACKEND (server), depending on whether it's loaded from SSR or client-side
const link = createHttpLink({
  fetch, // Switches between unfetch & node-fetch for client & server.
  uri: process.env.GRAPHCMS_CACHE_ENDPOINT,

  // Headers applied here will be applied for all requests
  // See the use of the "options" when running a graphQL query to specify options per-request at https://www.apollographql.com/docs/react/api/react-hooks/#options
  headers: {
    'gcms-locale-no-default': false,
  },
  credentials: 'same-origin', // XXX See https://www.apollographql.com/docs/react/recipes/authentication#cookie
});

/**
 * Export a HOC from next-with-apollo
 *
 * Universal, works both on client and server sides
 * Doesn't fetch any data by itself, but provides a client that allows to do it in children components
 *
 * @see https://www.npmjs.com/package/next-with-apollo
 */
export default withApollo(
  ({ initialState }: InitApolloOptions<NormalizedCacheObject>) =>
    new ApolloClient({
      link: link,

      // XXX Very important to provide the initialState, otherwise the client will replay the query upon loading,
      //  which is useless as the data were already fetched by the server (SSR)
      cache: new InMemoryCache().restore(initialState || {}), // rehydrate the cache using the initial data passed from the server
    }),
);

src/pages/_app.tsx

// ...
export default withUniversalGraphQLDataLoader(MyApp);

Vadorequest avatar Feb 02 '20 15:02 Vadorequest