Version Packages (alpha)

[github-actions]

This PR was opened by the Changesets release GitHub action. When you're ready to do a release, you can merge this and publish to npm yourself or setup this action to publish automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to release-4.0, this PR will be updated.

⚠️⚠️⚠️⚠️⚠️⚠️

release-4.0 is currently in pre mode so this branch has prereleases rather than normal releases. If you want to exit prereleases, run changeset pre exit on release-4.0.

⚠️⚠️⚠️⚠️⚠️⚠️

Releases

@apollo/client@4.0.0-alpha.10

Major Changes

• #12559 49ace0e Thanks @jerelmiller! - ObservableQuery.variables can now be reset back to empty when calling reobserve with variables: undefined. Previously the variables key would be ignored so variables would remain unchanged.

• #12559 49ace0e Thanks @jerelmiller! - never is no longer supported as a valid TVariables generic argument for APIs that require variables as part of its type. Use Record<string, never> instead.

• #12559 49ace0e Thanks @jerelmiller! - When passing a variables key with the value undefined, the value will be replaced by the default value in the query, if it is provided, rather than leave it as undefined.

  // given this query
  const query = gql`
    query PaginatedQuery($limit: Int! = 10, $offset: Int) {
      list(limit: $limit, offset: $offset) {
        id
      }
    }
  `;
  
  const observable = client.query({
    query,
    variables: { limit: 5, offset: 0 },
  });
  console.log(observable.variables); // => { limit: 5, offset: 0 }
  
  observable.reobserve({ variables: { limit: undefined, offset: 10 } });
  // limit is now `10`. This would previously be `undefined`
  console.log(observable.variables); // => { limit: 10, offset: 10 }

• #12562 90bf0e6 Thanks @jerelmiller! - client.query no longer supports a fetchPolicy of standby. standby does not fetch and did not return data. standby is meant for watched queries where fetching should be on hold.

Minor Changes

• #12557 51d26ae Thanks @jerelmiller! - Add ability to specify message formatter for CombinedGraphQLErrors and CombinedProtocolErrors. To provide your own message formatter, override the static formatMessage property on these classes.

  CombinedGraphQLErrors.formatMessage = (
    errors,
    { result, defaultFormatMessage }
  ) => {
    return "Some formatted message";
  };
  
  CombinedProtocolErrors.formatMessage = (errors, { defaultFormatMessage }) => {
    return "Some formatted message";
  };

• #12546 5dffbbe Thanks @jerelmiller! - Add a static is method to error types defined by Apollo Client. is makes it simpler to determine whether an error is a specific type, which can be helpful in cases where you'd like to narrow the error type in order to use specific properties from that error.

  This change applies to the following error types:

  • CombinedGraphQLErrors
  • CombinedProtocolErrors
  • ServerError
  • ServerParseError
  • UnconventionalError

  Example

  import { CombinedGraphQLErrors } from "@apollo/client";
  
  if (CombinedGraphQLErrors.is(error)) {
    console.log(error.message);
    error.errors.forEach((graphQLError) => console.log(graphQLError.message));
  }

• #12561 99d72bf Thanks @jerelmiller! - Add the ability to detect if an error was an error was emitted from the link chain. This is useful if your application throws custom errors in other areas of the application and you'd like to differentiate them from errors emitted by the link chain itself.

  To detect if an error was emitted from the link chain, use LinkError.is.

  import { LinkError } from "@apollo/client";
  
  client.query({ query }).catch((error) => {
    if (LinkError.is(error)) {
      // This error originated from the link chain
    }
  });

Patch Changes

• #12559 49ace0e Thanks @jerelmiller! - The variables option used with various APIs are now enforced more consistently across the client when TVariables contains required variables. If required variables are not provided, TypeScript will now complain that it requires a variables option.

  This change affects the following APIs:

  • client.query
  • client.mutate
  • client.subscribe
  • client.watchQuery
  • useBackgroundQuery
  • useQuery
  • useSubscription
  • useSuspenseQuery

• #12559 49ace0e Thanks @jerelmiller! - Fix type of variables returned from useLazyQuery. When called is false, variables is now Partial<TVariables> instead of TVariables.

• #12562 90bf0e6 Thanks @jerelmiller! - client.query no longer supports notifyOnNetworkStatusChange in options. An error will be thrown if this option is set. The effects of this option were not observable by client.query since client.query emits a single result.

• #12557 51d26ae Thanks @jerelmiller! - Update format of the error message for CombinedGraphQLErrors and CombinedProtocolErrors to be more like v3.x.

  console.log(error.message);
  - `The GraphQL server returned with errors:
  - - Email not found
  - - Username already in use`
  + `Email not found
  + Username already in use`

• #12559 49ace0e Thanks @jerelmiller! - ObservableQuery.variables has been updated to return TVariables rather than TVariables | undefined. This is more consistent with the runtime value where an empty object ({}) will be returned when the variables option is not provided.

[svc-apollo-docs]

⚠️ Docs preview not attached to branch

The preview was not built because the PR's base branch release-4.0 is not in the list of sources.

An Apollo team member can comment one of the following commands to dictate which branch to attach the preview to:

• !docs set-base-branch version-2.6
• !docs set-base-branch main

Build ID: d9094149c8477bd0345ba03f

[pkg-pr-new]

npm i https://pkg.pr.new/@apollo/client@12570

commit: 4596835

[netlify]

✅ Deploy Preview for apollo-client-docs ready!

Name	Link
🔨 Latest commit	4596835
🔍 Latest deploy log	https://app.netlify.com/sites/apollo-client-docs/deploys/68013ce7c5e3590008bec2d2
😎 Deploy Preview	https://deploy-preview-12570--apollo-client-docs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[github-actions]

size-limit report 📦

Path	Size
import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client" (CJS)	42.42 KB (-0.01% 🔽)
import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client" (production) (CJS)	37.94 KB (-0.07% 🔽)
import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client"	32.41 KB (-0.07% 🔽)
import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client" (production)	27.38 KB (+0.05% 🔺)
import { ApolloProvider } from "@apollo/client/react"	5.19 KB (+0.06% 🔺)
import { ApolloProvider } from "@apollo/client/react" (production)	961 B (-0.11% 🔽)
import { useQuery } from "@apollo/client/react"	10.92 KB (-0.01% 🔽)
import { useQuery } from "@apollo/client/react" (production)	6.67 KB (-0.03% 🔽)
import { useLazyQuery } from "@apollo/client/react"	6.36 KB (+0.05% 🔺)
import { useLazyQuery } from "@apollo/client/react" (production)	2.13 KB (+0.1% 🔺)
import { useMutation } from "@apollo/client/react"	5.77 KB (+0.06% 🔺)
import { useMutation } from "@apollo/client/react" (production)	1.53 KB (+0.13% 🔺)
import { useSubscription } from "@apollo/client/react"	6.07 KB (-0.04% 🔽)
import { useSubscription } from "@apollo/client/react" (production)	1.84 KB (+0.16% 🔺)
import { useSuspenseQuery } from "@apollo/client/react"	7.8 KB (+0.02% 🔺)
import { useSuspenseQuery } from "@apollo/client/react" (production)	3.58 KB (+0.11% 🔺)
import { useBackgroundQuery } from "@apollo/client/react"	7.62 KB (+0.02% 🔺)
import { useBackgroundQuery } from "@apollo/client/react" (production)	3.42 KB (-0.06% 🔽)
import { useLoadableQuery } from "@apollo/client/react"	7.6 KB (-0.03% 🔽)
import { useLoadableQuery } from "@apollo/client/react" (production)	3.41 KB (0%)
import { useReadQuery } from "@apollo/client/react"	5.85 KB (+0.04% 🔺)
import { useReadQuery } from "@apollo/client/react" (production)	1.62 KB (+0.07% 🔺)
import { useFragment } from "@apollo/client/react"	5.91 KB (-0.19% 🔽)
import { useFragment } from "@apollo/client/react" (production)	1.68 KB (-0.12% 🔽)