« Changelog History


react-apollo v3.0.0 Release Notes

Release Date: 2019-07-17 // almost 5 years ago

  • Overview

    🚀 This major release includes a large refactoring of the existing React Apollo codebase, to introduce new improvements, changes, features and bug fixes. The biggest new features are:

    • 📄 Provides new useQuery, useLazyQuery, useMutation, useSubscription, and useApolloClient hooks, following React's Hooks API.
    • 👍 Maintains support for React Apollo's graphql HOC and render proper components.
    • 📦 Introduces a new monorepo structure, with separately published packages, making it easier to use just the parts of React Apollo you're interested in:
      • @apollo/react-common
      • @apollo/react-hooks
      • @apollo/react-components
      • @apollo/react-hoc
      • @apollo/react-ssr
      • @apollo/react-testing
    • Thorough codebase pruning and cleaning to reduce the overall React Apollo bundle size.
    • And more!

    ⚡️ Consult the Hooks migration guide for more details around upgrading. For more information regarding how to use the new hooks, please consult the updated React Apollo docs (all docs have been updated to be hooks first).

    💥 Breaking Changes

    • 👍 The minimum supported React version is now 16.8.
    • 📦 The react-apollo@3 package preserves most of the functionality of react-apollo@2 by re-exporting existing components and functions from @apollo/react-components and @apollo/react-hoc. If you want to use Hooks, Components, or HOC directly, import the new @apollo/react-hooks, @apollo/react-components, and/or @apollo/react-hoc packages instead.
    • 📦 React Apollo testing utilities are no longer available as part of the react-apollo package. They should now be imported from the new @apollo/react-testing package.
    • 🚚 The deprecated walkTree function has been removed (9b24d756).
    • 🚚 The deprecated GraphqlQueryControls and MutationFunc types have been removed (ade881f0).
    • 👍 Preact is no longer supported (b742ae63).
    • 👍 Various Typescript type changes. Since we've introduced a third way of managing data with React (Hooks), we had to rework many of the existing exported types to better align with the Hooks way of doing things. Base types are used to hold common properties across Hooks, Components and the graphql HOC, and these types are then extended when needed to provide properties that are specific to a certain React paradigm (30edb1b0 and 3d138db3).
    • 🚚 catchAsyncError, wrap, and compose utilities have been removed (2c3a262, 7de864e, and e6089a7).

    Previously, compose was imported then exported directly from lodash using flowRight. To keep using compose, install the lodash.flowright package, then update your compose imports as:

      import * as compose from 'lodash.flowright';
    • Render prop components (Query, Mutation and Subscription) can no longer be extended. In other words, this is no longer possible:
      class SomeQuery extends Query<SomeData, SomeVariables> {}

    All class based render prop components have been converted to functional components, so they could then just wrap their hook based equivalents (useQuery, useMutation, useSubscription).

    While we recommend switching over to use the new hooks as soon as possible, if you're looking for a stop gap you can consider typing a Query component in a similar fashion, like:

      export const SomeQuery = () => (
    <Query<SomeData, SomeVariables> query={SOME_QUERY} ...>
      {({ data }) => {
        return <div> ... things happen... </div>;
      }}
    </Query>
  );