Enforce prettier formatting in PRs (#11185)

.circleci/config.yml

@@ -19,6 +19,14 @@ jobs:
       - run: npm ci
       - run: npm run lint
 
+  Formatting:
+    docker:
+      - image: cimg/node:20.5.1
+    steps:
+      - checkout
+      - run: npm ci
+      - run: npm run check:format
+
   Tests:
     docker:
       - image: cimg/node:20.5.1
@@ -83,6 +91,7 @@ workflows:
     jobs:
       # - Filesize
       - Tests
+      - Formatting
       - Lint
       - BuildTarball
       - IntegrationTests:

.eslintrc

@@ -44,10 +44,7 @@
             "message": "Please only use the namespace import syntax (`import * as React from 'react'`) for React imports!"
           }
         ],
-        "import/consistent-type-specifier-style": [
-          "error",
-          "prefer-top-level"
-        ],
+        "import/consistent-type-specifier-style": ["error", "prefer-top-level"],
         "import/extensions": [
           "error",
           "always",

.git-blame-ignore-revs

@@ -10,3 +10,5 @@ f7890ae96a3ba900d3de9bf8b23254bcfba18a25
 ba3e7d9fa7d46e4c636148bbf01552833db0ceda
 # Format all non-docs files with prettier (#11170)
 352c4a9ad4d140d58850688bd1b2d5513f62c6cb
+# Format remaining files from #11170 (#11185)
+994ae91f16ea4c8ee28818bd7eaac47e4765c660

docs/source/development-testing/reducing-bundle-size.mdx

@@ -5,6 +5,7 @@ description: Squeeze those last few bytes out of your production build
 
 Two quick configuration changes can help your reduce your bundle size: turning off Apollo Client's development mode and picking a consistent style for your imports.  
 Every byte counts in optimizing your app's performance.
+
 ## Turning off development mode
 
 By default, Apollo Client is in "development mode". That means Apollo Client performs additional checks and the browser console displays warnings.
@@ -25,7 +26,7 @@ Here are some bundler-specific suggestions for configuring your bundler to remov
 export default defineConfig({
   // ...
   define: {
-    'globalThis.__DEV__': JSON.stringify(false),
+    "globalThis.__DEV__": JSON.stringify(false),
   },
 });
 ```
@@ -43,7 +44,7 @@ const nextConfig = {
   webpack(config, { webpack }) {
     config.plugins.push(
       new webpack.DefinePlugin({
-        'globalThis.__DEV__': false,
+        "globalThis.__DEV__": false,
       })
     );
     return config;
@@ -62,12 +63,12 @@ With `create-react-app`, you need to use a third-party package like [`craco`](ht
 <ExpansionPanel title="Click to expand suggested configuration">
 
 ```js title="craco.config.js"
-const webpack = require('webpack');
+const webpack = require("webpack");
 module.exports = {
   webpack: {
     plugins: [
       new webpack.DefinePlugin({
-        'globalThis.__DEV__': false,
+        "globalThis.__DEV__": false,
       }),
     ],
   },
@@ -97,7 +98,7 @@ module.exports = {
 ```js
 config.plugins.push(
   new webpack.DefinePlugin({
-    'globalThis.__DEV__': false,
+    "globalThis.__DEV__": false,
   })
 );
 ```
@@ -120,7 +121,7 @@ export default [
         compress: {
           toplevel: true,
           global_defs: {
-            '@globalThis.__DEV__': 'false',
+            "@globalThis.__DEV__": "false",
           },
         },
       }),
@@ -171,11 +172,11 @@ Apollo Client offers these two styles of imports:
 
 ```js
 // "main entrypoint import" style
-import { ApolloClient, InMemoryCache, useQuery } from '@apollo/client';
+import { ApolloClient, InMemoryCache, useQuery } from "@apollo/client";
 
 // "deep entrypoint import" style
-import { ApolloClient, InMemoryCache } from '@apollo/client/core';
-import { useQuery } from '@apollo/client/react/hooks';
+import { ApolloClient, InMemoryCache } from "@apollo/client/core";
+import { useQuery } from "@apollo/client/react/hooks";
 ```
 
 With many modern bundlers, it should not matter which of these styles you choose.<br />

package.json

@@ -43,7 +43,9 @@
     "prepdist:changesets": "ts-node-script config/prepareChangesetsRelease.ts",
     "postprocess-dist": "ts-node-script config/postprocessDist.ts",
     "clean": "rimraf dist coverage lib temp",
+    "check:format": "prettier --check .",
     "ci:precheck": "node config/precheck.js",
+    "format": "prettier --write .",
     "lint": "eslint 'src/**/*.{[jt]s,[jt]sx}'",
     "test": "jest --config ./config/jest.config.js",
     "test:debug": "node --inspect-brk node_modules/.bin/jest --config ./config/jest.config.js --runInBand --testTimeout 99999 --logHeapUsage",

src/core/QueryManager.ts

@@ -957,7 +957,7 @@ export class QueryManager<TStore> {
   public startGraphQLSubscription<T = any>({
     query,
     fetchPolicy,
-    errorPolicy = 'none',
+    errorPolicy = "none",
     variables,
     context = {},
   }: SubscriptionOptions): Observable<FetchResult<T>> {
@@ -995,13 +995,13 @@ export class QueryManager<TStore> {
           // `errorPolicy` is a mechanism for handling GraphQL errors, according
           // to our documentation, so we throw protocol errors regardless of the
           // set error policy.
-          if (errorPolicy === 'none' || hasProtocolErrors) {
+          if (errorPolicy === "none" || hasProtocolErrors) {
             throw new ApolloError(errors);
           }
         }
 
-        if (errorPolicy === 'ignore') {
-          delete result.errors
+        if (errorPolicy === "ignore") {
+          delete result.errors;
         }
 
         return result;
@@ -1567,8 +1567,8 @@ export class QueryManager<TStore> {
       fetchPolicy === "no-cache"
         ? CacheWriteBehavior.FORBID
         : // Watched queries must opt into overwriting existing data on refetch,
-          // by passing refetchWritePolicy: "overwrite" in their WatchQueryOptions.
-          networkStatus === NetworkStatus.refetch &&
+        // by passing refetchWritePolicy: "overwrite" in their WatchQueryOptions.
+        networkStatus === NetworkStatus.refetch &&
           refetchWritePolicy !== "merge"
         ? CacheWriteBehavior.OVERWRITE
         : CacheWriteBehavior.MERGE;