create a jwt token if there is a customerId, move the get customer id to the main utils folder. Need to add in more value to the env file. Updated the env sample.

.env.template

@@ -7,6 +7,10 @@ BIGCOMMERCE_STORE_API_URL=
 BIGCOMMERCE_STORE_API_TOKEN=
 BIGCOMMERCE_STORE_API_CLIENT_ID=
 BIGCOMMERCE_CHANNEL_ID=
+BIGCOMMERCE_STORE_URL=
+BIGCOMMERCE_STORE_API_STORE_HASH=
+BIGCOMMERCE_STORE_API_CLIENT_SECRET=
+
 
 NEXT_PUBLIC_SHOPIFY_STORE_DOMAIN=
 NEXT_PUBLIC_SHOPIFY_STOREFRONT_ACCESS_TOKEN=

framework/bigcommerce/api/endpoints/checkout/checkout.ts

@@ -1,4 +1,7 @@
 import type { CheckoutEndpoint } from '.'
+import getCustomerId from '../../utils/get-customer-id'
+import jwt from 'jsonwebtoken'
+import { uuid } from 'uuidv4'
 
 const fullCheckout = true
 
@@ -9,21 +12,44 @@ const checkout: CheckoutEndpoint['handlers']['checkout'] = async ({
 }) => {
   const { cookies } = req
   const cartId = cookies[config.cartCookie]
+  const customerToken = cookies[config.customerCookie]
+  let checkouturl: string
 
   if (!cartId) {
     res.redirect('/cart')
     return
   }
-
   const { data } = await config.storeApiFetch(
     `/v3/carts/${cartId}/redirect_urls`,
     {
       method: 'POST',
     }
   )
+  const customerId =
+    customerToken && (await getCustomerId({ customerToken, config }))
+  //if there is a customer create a jwt token
+  if (customerId >= 0) {
+    const dateCreated = Math.round(new Date().getTime() / 1000)
+    const payload = {
+      iss: config.storeApiClientId,
+      iat: dateCreated,
+      jti: uuid(),
+      operation: 'customer_login',
+      store_hash: config.storeHash,
+      customer_id: customerId,
+      channel_id: config.storeChannelId,
+      redirect_to: data.checkout_url,
+    }
+    let token = jwt.sign(payload, config.storeApiClientSecret, {
+      algorithm: 'HS256',
+    })
+    checkouturl = `${config.storeUrl}/login/token/${token}`
+  } else {
+    checkouturl = data.checkout_url
+  }
 
   if (fullCheckout) {
-    res.redirect(data.checkout_url)
+    res.redirect(checkouturl)
     return
   }
 

framework/bigcommerce/api/endpoints/wishlist/add-item.ts

@@ -1,6 +1,6 @@
 import getCustomerWishlist from '../../operations/get-customer-wishlist'
 import { parseWishlistItem } from '../../utils/parse-item'
-import getCustomerId from './utils/get-customer-id'
+import getCustomerId from '../../utils/get-customer-id'
 import type { WishlistEndpoint } from '.'
 
 // Return wishlist info

framework/bigcommerce/api/endpoints/wishlist/get-wishlist.ts

@@ -1,6 +1,6 @@
 import type { Wishlist } from '../../../types/wishlist'
 import type { WishlistEndpoint } from '.'
-import getCustomerId from './utils/get-customer-id'
+import getCustomerId from '../../utils/get-customer-id'
 import getCustomerWishlist from '../../operations/get-customer-wishlist'
 
 // Return wishlist info

framework/bigcommerce/api/endpoints/wishlist/remove-item.ts

@@ -1,6 +1,6 @@
 import type { Wishlist } from '../../../types/wishlist'
 import getCustomerWishlist from '../../operations/get-customer-wishlist'
-import getCustomerId from './utils/get-customer-id'
+import getCustomerId from '../../utils/get-customer-id'
 import type { WishlistEndpoint } from '.'
 
 // Return wishlist info

framework/bigcommerce/api/index.ts

@@ -32,6 +32,9 @@ export interface BigcommerceConfig extends CommerceAPIConfig {
   storeApiToken: string
   storeApiClientId: string
   storeChannelId?: string
+  storeUrl?: string
+  storeApiClientSecret?: string
+  storeHash?:string
   storeApiFetch<T>(endpoint: string, options?: RequestInit): Promise<T>
 }
 
@@ -41,6 +44,9 @@ const STORE_API_URL = process.env.BIGCOMMERCE_STORE_API_URL
 const STORE_API_TOKEN = process.env.BIGCOMMERCE_STORE_API_TOKEN
 const STORE_API_CLIENT_ID = process.env.BIGCOMMERCE_STORE_API_CLIENT_ID
 const STORE_CHANNEL_ID = process.env.BIGCOMMERCE_CHANNEL_ID
+const STORE_URL = process.env.BIGCOMMERCE_STORE_URL
+const CLIENT_SECRET = process.env.BIGCOMMERCE_STORE_API_CLIENT_SECRET
+const STOREFRONT_HASH = process.env.BIGCOMMERCE_STORE_API_STORE_HASH
 
 if (!API_URL) {
   throw new Error(
@@ -75,6 +81,9 @@ const config: BigcommerceConfig = {
   storeApiToken: STORE_API_TOKEN,
   storeApiClientId: STORE_API_CLIENT_ID,
   storeChannelId: STORE_CHANNEL_ID,
+  storeUrl:STORE_URL,
+  storeApiClientSecret:CLIENT_SECRET,
+  storeHash: STOREFRONT_HASH,
   storeApiFetch: createFetchStoreApi(() => getCommerceApi().getConfig()),
 }
 

next-env.d.ts

@@ -1,2 +1,3 @@
 /// <reference types="next" />
 /// <reference types="next/types/global" />
+/// <reference types="next/image-types/global" />

package.json

@@ -45,7 +45,8 @@
     "swell-js": "^4.0.0-next.0",
     "swr": "^0.5.6",
     "tabbable": "^5.2.0",
-    "tailwindcss": "^2.2.2"
+    "tailwindcss": "^2.2.2",
+    "uuidv4": "^6.2.10"
   },
   "devDependencies": {
     "@graphql-codegen/cli": "^1.21.5",

tsconfig.json

@@ -23,8 +23,8 @@
       "@components/*": ["components/*"],
       "@commerce": ["framework/commerce"],
       "@commerce/*": ["framework/commerce/*"],
-      "@framework": ["framework/local"],
+      "@framework": ["framework/bigcommerce"],
-      "@framework/*": ["framework/local/*"]
+      "@framework/*": ["framework/bigcommerce/*"]
     }
   },
   "include": ["next-env.d.ts", "**/*.d.ts", "**/*.ts", "**/*.tsx", "**/*.js"],
@@ -34,6 +34,11 @@
     "./framework/shopify",
     "./framework/swell",
     "./framework/vendure",
-    "./framework/saleor"
+    "./framework/saleor",
+    "framework/saleor",
+    "framework/shopify",
+    "framework/swell",
+    "framework/vendure",
+    "framework/local"
   ]
 }