BigCommerce custom fields

packages/bigcommerce/package.json

@@ -63,6 +63,7 @@
     "react-dom": "^18"
   },
   "devDependencies": {
+    "@manifoldco/swagger-to-ts": "^2.1.0",
     "@taskr/clear": "^1.1.0",
     "@taskr/esnext": "^1.1.0",
     "@taskr/watch": "^1.1.0",
@@ -74,6 +75,7 @@
     "@types/react": "^18.0.14",
     "lint-staged": "^12.1.7",
     "next": "^12.0.8",
+    "node-fetch": "^2.6.7",
     "prettier": "^2.5.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",

packages/bigcommerce/src/api/operations/get-product.ts

@@ -50,6 +50,15 @@ export const getProductQuery = /* GraphQL */ `
                       }
                     }
                   }
+                  customFields {
+                    edges {
+                      node {
+                        entityId
+                        name
+                        value
+                      }
+                    }
+                  }
                 }
               }
             }

packages/bigcommerce/src/lib/normalize.ts

@@ -1,10 +1,14 @@
 import type { Page } from '@vercel/commerce/types/page'
-import type { Product } from '@vercel/commerce/types/product'
+import type {
+  Product,
+  ProductCustomField,
+} from '@vercel/commerce/types/product'
 import type { Cart, LineItem } from '@vercel/commerce/types/cart'
 import type { Category, Brand } from '@vercel/commerce/types/site'
 import type { BigcommerceCart, BCCategory, BCBrand } from '../types'
 import type { ProductNode } from '../api/operations/get-all-products'
 import type { definitions } from '../api/definitions/store-content'
+import type { CustomFieldEdge } from '../../schema'
 
 import getSlug from './get-slug'
 
@@ -20,10 +24,20 @@ function normalizeProductOption(productOption: any) {
   }
 }
 
-export function normalizeProduct(productNode: ProductNode): Product {
+// TODO: change this after schema definition is updated
+interface ProductNodeWithCustomFields extends ProductNode {
+  customFields: {
+    edges?: CustomFieldEdge[]
+  }
+}
+
+export function normalizeProduct(
+  productNode: ProductNodeWithCustomFields
+): Product {
   const {
     entityId: id,
     productOptions,
+    customFields,
     prices,
     path,
     images,
@@ -52,6 +66,7 @@ export function normalizeProduct(productNode: ProductNode): Product {
         })
       ) || [],
     options: productOptions?.edges?.map(normalizeProductOption) || [],
+    customFields: customFields?.edges?.map(normalizeCustomFieldsValue) || [],
     slug: path?.replace(/^\/+|\/+$/g, ''),
     price: {
       value: prices?.price.value,
@@ -137,3 +152,17 @@ export function normalizeBrand(brand: BCBrand): Brand {
     path: `/${slug}`,
   }
 }
+
+function normalizeCustomFieldsValue(
+  field: CustomFieldEdge
+): ProductCustomField {
+  const {
+    node: { entityId, name, value },
+  } = field
+
+  return {
+    id: String(entityId),
+    name,
+    value,
+  }
+}