✨ add schema generation for customer account api in hydrogen-react ‰…

.changeset/fluffy-houses-itch.md

@@ -0,0 +1,6 @@
+---
+'@shopify/hydrogen-react': minor
+'@shopify/hydrogen': minor
+---
+
+✨ add schema generation for customer account api in hydrogen-react and export these types in both hydrogen-react & hydrogen. Note the current CA API version is `2024-01` which is a release candidate and subject to change.

packages/hydrogen-react/CONTRIBUTING.md

@@ -59,16 +59,17 @@ For most contributions, this should be enough information to work off of. Howeve
 
 Every PR must pass certain CI checks in order to be merged; you can run these checks locally yourself by running `npm run ci:checks` from the root of the repo.
 
-## Updating the Storefront API version
+## Updating the Storefront API & Customer Account API version
 
 Processes that need to happen:
 
 - Create a new changeset. Use this changeset to add notes and guides to important things that are changed as part of this update.
+- Note that Storefront API & Customer Account API share the same version number in our tooling
 - Do a find & replace in the code to replace nearly all instances of the old version with the new version.
   - However, don't replace documentation unless it makes sense.
   - Also be careful that some versions of the Storefront API don't exactly match code here: for example, SFAPI `2022-07` could be `2022-07`, `2022-7`, and `2022.7.x` in this codebase.
   - Note that the package.json `version` field cannot have leading `0`s. So you cannot have `2022.01.0`, and must instead use `2022.1.0`
-- Update the schema url to the new api version (in `codegen.ts : Line 9`) and run the `graphql-types` NPM script to generate the new types.
+- Update the schema url to the new api version (in `codegen.ts : CURRENT_API_VERSION`) and run the `graphql-types` NPM script to generate the new types.
   - Look through the new schema and see if there are any breaking changes
   - If there are new scalars, or scalars are removed, update the `codegen.yml` file's custom scalar settings and run the command again.
 - Search for all instances of `@deprecated` and see if it is time to make that breaking change

packages/hydrogen-react/codegen.ts

@@ -1,26 +1,41 @@
 import {CodegenConfig} from '@graphql-codegen/cli';
-import {storefrontApiCustomScalars} from './src/codegen.helpers';
+import {
+  storefrontApiCustomScalars,
+  customerApiCustomScalars,
+} from './src/codegen.helpers';
 
-const config: CodegenConfig = {
-  overwrite: true,
-  schema: {
-    'https://hydrogen-preview.myshopify.com/api/2023-10/graphql.json': {
+const SF_API_VERSION = '2023-10';
+const CA_API_VERSION = '2024-01';
+
+const storefrontAPISchema: CodegenConfig['schema'] = {
+  [`https://hydrogen-preview.myshopify.com/api/${SF_API_VERSION}/graphql.json`]:
+    {
       headers: {
         'X-Shopify-Storefront-Access-Token': '3b580e70970c4528da70c98e097c2fa0',
         'content-type': 'application/json',
       },
     },
-  },
+};
+
+// API Key used is specific for Hydrogen App
+const customerAPISchema: CodegenConfig['schema'] = {
+  [`https://app.myshopify.com/services/graphql/introspection/customer?api_client_api_key=159a99b8a7289a72f68603f2f4de40ac&api_version=${CA_API_VERSION}`]:
+    {method: 'GET'},
+};
+
+const config: CodegenConfig = {
+  overwrite: true,
   generates: {
     // The generated base types
     'src/storefront-api-types.d.ts': {
+      schema: storefrontAPISchema,
       plugins: [
         {
           add: {
             content: `
               /**
                * THIS FILE IS AUTO-GENERATED, DO NOT EDIT
-               * Based on Storefront API 2023-10
+               * Based on Storefront API ${SF_API_VERSION}
                * If changes need to happen to the types defined in this file, then generally the Storefront API needs to update. After it's updated, you can run \`npm run graphql-types\`.
                * Except custom Scalars, which are defined in the \`codegen.ts\` file
                */
@@ -42,6 +57,43 @@ const config: CodegenConfig = {
     },
     // The schema file, which is the local representation of the GraphQL endpoint
     './storefront.schema.json': {
+      schema: storefrontAPISchema,
+      plugins: [
+        {
+          introspection: {
+            minify: true,
+          },
+        },
+      ],
+    },
+    'src/customer-account-api-types.d.ts': {
+      schema: customerAPISchema,
+      plugins: [
+        {
+          add: {
+            content: `
+              /**
+               * THIS FILE IS AUTO-GENERATED, DO NOT EDIT
+               * Based on Customer Account API ${CA_API_VERSION}
+               * If changes need to happen to the types defined in this file, then generally the Storefront API needs to update. After it's updated, you can run \`npm run graphql-types\`.
+               * Except custom Scalars, which are defined in the \`codegen.ts\` file
+               */
+              /* eslint-disable */`,
+          },
+        },
+        {
+          typescript: {
+            useTypeImports: true,
+            defaultScalarType: 'unknown',
+            useImplementingTypes: true,
+            enumsAsTypes: true,
+            scalars: customerApiCustomScalars,
+          },
+        },
+      ],
+    },
+    './customer.schema.json': {
+      schema: customerAPISchema,
       plugins: [
         {
           introspection: {