feat: Add static prices and sales_channel auth

framework/commercelayer/api/operations/get-all-products.ts

@@ -1,8 +1,10 @@
 import { Product } from '@commerce/types/product'
 import { GetAllProductsOperation } from '@commerce/types/product'
 import type { OperationContext } from '@commerce/api/operations'
-import type { LocalConfig, Provider } from '../index'
+import type { LocalConfig } from '../index'
 import data from '../../data.json'
+import { Price } from '@commercelayer/js-sdk'
+import { getSalesChannelToken } from '@commercelayer/js-auth'
 
 export default function getAllProductsOperation({
   commerce,
@@ -17,6 +19,35 @@ export default function getAllProductsOperation({
     config?: Partial<LocalConfig>
     preview?: boolean
   } = {}): Promise<{ products: Product[] | any[] }> {
+    const endpoint = process.env.NEXT_PUBLIC_COMMERCELAYER_ENDPOINT as string
+    const credentials = await getSalesChannelToken({
+      endpoint,
+      clientId: process.env.NEXT_PUBLIC_COMMERCELAYER_CLIENT_ID as string,
+      scope: process.env.NEXT_PUBLIC_COMMERCELAYER_MARKET_SCOPE as string,
+    })
+    if (credentials.accessToken) {
+      const skus: string[] = []
+      const config = {
+        accessToken: credentials.accessToken,
+        endpoint,
+      }
+      data.products.map(({ variants }) => skus.push(variants[0].options[0].id))
+      const prices = (
+        await Price.withCredentials(config)
+          .where({ skuCodeIn: skus.join(',') })
+          .all({ rawResponse: true })
+      ).data
+      data.products.map((product) => {
+        prices.map((price) => {
+          const skuCode = price.attributes.sku_code
+          if (skuCode.startsWith(product.id)) {
+            product.price.value = price.attributes.amount_float
+            product.price.currencyCode = price.attributes.currency_code
+          }
+        })
+        return product
+      })
+    }
     return {
       products: data.products,
     }

framework/commercelayer/auth/use-token.tsx

@@ -0,0 +1,24 @@
+import Cookies from 'js-cookie'
+import { getSalesChannelToken } from '@commercelayer/js-auth'
+import { useEffect, useState } from 'react'
+
+export default function useToken() {
+  const [token, setToken] = useState('')
+  useEffect(() => {
+    const cookieToken = Cookies.get('CL_TOKEN')
+    const getToken = async () => {
+      const credentials = await getSalesChannelToken({
+        endpoint: process.env.NEXT_PUBLIC_COMMERCELAYER_ENDPOINT as string,
+        clientId: process.env.NEXT_PUBLIC_COMMERCELAYER_CLIENT_ID as string,
+        scope: process.env.NEXT_PUBLIC_COMMERCELAYER_MARKET_SCOPE as string,
+      })
+      Cookies.set('CL_TOKEN', credentials.accessToken, {
+        expires: credentials.expires,
+      })
+      setToken(credentials.accessToken)
+    }
+    if (!cookieToken) getToken()
+    else setToken(cookieToken)
+  }, [token])
+  return token
+}

framework/commercelayer/index.tsx

@@ -6,6 +6,7 @@ import {
   CommerceProvider as CoreCommerceProvider,
   useCommerce as useCoreCommerce,
 } from '@commerce'
+import useToken from './auth/use-token'
 
 export const localConfig: CommerceConfig = {
   locale: 'en-us',
@@ -19,6 +20,8 @@ export function CommerceProvider({
   children?: ReactNode
   locale: string
 } & Partial<CommerceConfig>) {
+  const token = useToken()
+  if (token) config.cartCookie = token
   return (
     <CoreCommerceProvider
       provider={localProvider}

framework/commercelayer/provider.ts

@@ -14,6 +14,7 @@ export const localProvider = {
   locale: 'en-us',
   cartCookie: 'session',
   fetcher: fetcher,
+  token: '',
   cart: { useCart, useAddItem, useUpdateItem, useRemoveItem },
   customer: { useCustomer },
   products: { useSearch },