feat: add headless config

bigcommerce · Aug 15, 2023 · b9bea7c · b9bea7c
1 parent 7ed2390
commit b9bea7c
Show file tree

Hide file tree

Showing 4 changed files with 46 additions and 21 deletions.
diff --git a/apps/storefront/src/components/B3StoreContainer.tsx b/apps/storefront/src/components/B3StoreContainer.tsx
@@ -3,7 +3,8 @@ import { ReactNode, useContext, useLayoutEffect } from 'react'
 import { B3PageMask, showPageMask } from '@/components'
 import { GlobaledContext } from '@/shared/global'
 import { getBCStoreChannelId } from '@/shared/service/b2b'
-import { B3SStorage } from '@/utils'
+import { setHeadLessBcUrl, store } from '@/store'
+import { B3SStorage, storeHash } from '@/utils'
 import { getCurrentStoreInfo } from '@/utils/loginInfo'
 
 interface B3StoreContainerProps {
@@ -44,14 +45,23 @@ export function B3StoreContainer(props: B3StoreContainerProps) {
       try {
         const { storeBasicInfo }: CustomFieldItems = await getBCStoreChannelId()
 
+        const storeInfo = getCurrentStoreInfo(
+          (storeBasicInfo as StoreBasicInfo)?.storeSites || []
+        )
+
+        if (!storeInfo?.channelId) return
+
         const {
           channelId,
           b3ChannelId: b2bChannelId,
           b2bEnabled: storeEnabled,
-        } = getCurrentStoreInfo(
-          (storeBasicInfo as StoreBasicInfo)?.storeSites || []
-        )
+          platform,
+        } = storeInfo
 
+        const bcUrl =
+          platform === 'next'
+            ? `https://store-${storeHash}-${channelId}.mybigcommerce.com`
+            : ''
         const isEnabled = storeBasicInfo?.multiStorefrontEnabled
           ? storeEnabled
           : true
@@ -71,8 +81,10 @@ export function B3StoreContainer(props: B3StoreContainerProps) {
           showPageMask(dispatch, false)
         }
 
+        store.dispatch(setHeadLessBcUrl(bcUrl))
         B3SStorage.set('timeFormat', storeBasicInfo.timeFormat)
         B3SStorage.set('B3channelId', channelId)
+        B3SStorage.set('bcUrl', bcUrl)
         sessionStorage.setItem('currentB2BEnabled', JSON.stringify(isEnabled))
       } catch (error) {
         showPageMask(dispatch, false)

diff --git a/apps/storefront/src/store/slices/global.ts b/apps/storefront/src/store/slices/global.ts
@@ -44,6 +44,7 @@ export interface GlabolState {
   setOpenPageFn?: Dispatch<SetStateAction<OpenPageState>>
   showInclusiveTaxPrice?: boolean
   blockPendingAccountViewPrice?: boolean
+  bcUrl?: string
 }
 
 const initialState: GlabolState = {
@@ -62,6 +63,7 @@ const initialState: GlabolState = {
   setOpenPageFn: undefined,
   showInclusiveTaxPrice: false,
   blockPendingAccountViewPrice: false,
+  bcUrl: '',
 }
 
 export const glabolSlice = createSlice({
@@ -99,6 +101,9 @@ export const glabolSlice = createSlice({
     ) => {
       state.blockPendingAccountViewPrice = payload as Draft<boolean>
     },
+    setHeadLessBcUrl: (state, { payload }: PayloadAction<string>) => {
+      state.bcUrl = payload as Draft<string>
+    },
   },
 })
 
@@ -110,6 +115,7 @@ export const {
   setOpenPageReducer,
   setShowInclusiveTaxPrice,
   setBlockPendingAccountViewPrice,
+  setHeadLessBcUrl,
 } = glabolSlice.actions
 
 export default glabolSlice.reducer
diff --git a/apps/storefront/src/utils/basicConfig.ts b/apps/storefront/src/utils/basicConfig.ts
@@ -2,10 +2,12 @@ import globalB3 from '@b3/global-b3'
 
 const storeHash = globalB3?.setting?.store_hash
 
-// const captchaSetkey = globalB3?.setting?.captcha_setkey
+const bcUrl = sessionStorage.getItem('sf-bcUrl')
+  ? JSON.parse(sessionStorage.getItem('sf-bcUrl') || '')
+  : ''
 
 const isLocalDebugging = globalB3?.setting?.is_local_debugging
 
-const bcBaseUrl = isLocalDebugging ? '/bigcommerce' : ''
+const bcBaseUrl = isLocalDebugging ? '/bigcommerce' : bcUrl
 
 export { bcBaseUrl, storeHash }
diff --git a/apps/storefront/src/utils/loginInfo.ts b/apps/storefront/src/utils/loginInfo.ts
@@ -9,7 +9,7 @@ import {
 import { getBcCurrentJWT, getCustomerInfo } from '@/shared/service/bc'
 import { B3LStorage, B3SStorage, storeHash } from '@/utils'
 
-const { VITE_B2B_CLIENT_ID } = import.meta.env
+const { VITE_B2B_CLIENT_ID, VITE_LOCAL_DEBUG } = import.meta.env
 
 interface ChannelIdProps {
   channelId: number
@@ -19,6 +19,7 @@ interface ChannelIdProps {
   b3ChannelId?: number
   type: string
   platform: string
+  isEnabled: boolean
 }
 
 type B2BToken = {
@@ -41,21 +42,25 @@ export interface ChannelStoreSites {
   storeSites?: Array<ChannelIdProps> | []
 }
 
-export const getCurrentStoreInfo = (storeSites: Array<ChannelIdProps>) => {
+export const getCurrentStoreInfo = (
+  storeSites: Array<ChannelIdProps>
+): Partial<ChannelIdProps> => {
   const newStoreSites =
-    storeSites.filter(
-      (site: ChannelIdProps) =>
-        site.type === 'storefront' && site.platform === 'bigcommerce'
-    ) || []
-
-  const store: ChannelIdProps = {
-    channelId: 1,
-    urls: [],
-    b2bEnabled: true,
-    channelLogo: '',
-    b3ChannelId: 16,
-    type: 'storefront',
-    platform: 'bigcommerce',
+    storeSites.filter((site: ChannelIdProps) => !!site.isEnabled) || []
+
+  let store: ChannelIdProps | {} = {}
+
+  if (VITE_LOCAL_DEBUG) {
+    store = {
+      channelId: 1,
+      urls: [],
+      b2bEnabled: true,
+      channelLogo: '',
+      b3ChannelId: 16,
+      type: 'storefront',
+      platform: 'bigcommerce',
+      isEnabled: true,
+    }
   }
 
   const { origin } = window.location