Latest Changes - Logger, Size and Colors

lib/bigcommerce/api/fragments/product.ts

@@ -9,6 +9,24 @@ export const responsiveImageFragment = /* GraphQL */ `
     isDefault
   }
 `
+export const multipleChoiceFragment = /* GraphQL */ `
+  fragment swatchOption on SwatchOptionValue {
+    isDefault
+    hexColors
+  }
+
+  fragment multipleChoiceOption on MultipleChoiceOption {
+    entityId
+    values {
+      edges {
+        node {
+          label
+          ...swatchOption
+        }
+      }
+    }
+  }
+`
 
 export const productInfoFragment = /* GraphQL */ `
   fragment productInfo on Product {
@@ -46,24 +64,17 @@ export const productInfoFragment = /* GraphQL */ `
         }
       }
     }
-    options {
+    productOptions {
       edges {
         node {
           entityId
           displayName
-          isRequired
-          values {
-            edges {
-              node {
-                entityId
-                label
-              }
-            }
-          }
+          ...multipleChoiceOption
         }
       }
     }
   }
 
   ${responsiveImageFragment}
+  ${multipleChoiceFragment}
 `

lib/bigcommerce/api/utils/fetch-graphql-api.ts

@@ -1,10 +1,12 @@
 import { CommerceAPIFetchOptions } from 'lib/commerce/api'
 import { getConfig } from '..'
+import log from '@lib/logger'
 
 export default async function fetchGraphqlApi<Q, V = any>(
   query: string,
   { variables, preview }: CommerceAPIFetchOptions<V> = {}
 ): Promise<Q> {
+  log.warn(query)
   const config = getConfig()
   const res = await fetch(config.commerceUrl + (preview ? '/preview' : ''), {
     method: 'POST',

lib/logger.ts

@@ -0,0 +1,5 @@
+import bunyan from 'bunyan'
+
+const log = bunyan.createLogger({ name: 'Next.js - Commerce' })
+
+export default log