feat: block pending account order creation

apps/storefront/src/components/B3GlobalTip.tsx

@@ -48,7 +48,7 @@ export default function B3GlobalTip() {
         dispatch({
           type: 'common',
           payload: {
-            tipMessage: {
+            globalTipMessage: {
               ...globalTipMessage,
               msgs: newMsgs,
             },

apps/storefront/src/hooks/dom/useCartToQuote.ts

@@ -10,6 +10,8 @@ import type { OpenPageState } from '@b3/hooks'
 
 import { getContrastColor } from '@/components/outSideComponents/utils/b3CustomStyles'
 import { CustomStyleContext } from '@/shared/customStyleButtton'
+import { GlobaledContext } from '@/shared/global'
+import { B3SStorage, globalSnackbar } from '@/utils'
 
 import { addQuoteToCart } from './utils'
 
@@ -19,16 +21,63 @@ interface MutationObserverProps {
   cartQuoteEnabled: boolean
 }
 
+interface IsShowBlockPendingAccountOrderCreationTipProps {
+  cartTip: number
+  checkoutTip: number
+}
+
 const useCartToQuote = ({
   setOpenPage,
   cartQuoteEnabled,
 }: MutationObserverProps) => {
   const { addToQuote, addLoadding } = addQuoteToCart(setOpenPage)
 
   const {
-    state: { addToAllQuoteBtn },
+    state: { addToAllQuoteBtn, blockPendingAccountOrderCreation },
   } = useContext(CustomStyleContext)
 
+  const {
+    state: { companyInfo },
+  } = useContext(GlobaledContext)
+
+  const urlArr = ['/cart.php', '/checkout']
+
+  const checkIsInPage = (url: string) => window.location.href.includes(url)
+
+  const isBlockPendingAccountOrderCreation =
+    (checkIsInPage(urlArr[0]) || checkIsInPage(urlArr[1])) &&
+    blockPendingAccountOrderCreation.enabled &&
+    +companyInfo.companyStatus === 0
+
+  useEffect(() => {
+    const isShowBlockPendingAccountOrderCreationTip: IsShowBlockPendingAccountOrderCreationTipProps =
+      B3SStorage.get('isShowBlockPendingAccountOrderCreationTip') || {
+        cartTip: 0,
+        checkoutTip: 0,
+      }
+    const isShowTips =
+      (checkIsInPage(urlArr[0]) &&
+        isShowBlockPendingAccountOrderCreationTip.cartTip === 0) ||
+      (checkIsInPage(urlArr[1]) &&
+        isShowBlockPendingAccountOrderCreationTip.checkoutTip === 0)
+    if (isBlockPendingAccountOrderCreation && isShowTips) {
+      globalSnackbar.warning(
+        'Your account is pending approval. Ordering will be enabled after account approval',
+        {
+          isClose: true,
+        }
+      )
+      B3SStorage.set('isShowBlockPendingAccountOrderCreationTip', {
+        cartTip:
+          +checkIsInPage(urlArr[0]) +
+          isShowBlockPendingAccountOrderCreationTip.cartTip,
+        checkoutTip:
+          +checkIsInPage(urlArr[1]) +
+          isShowBlockPendingAccountOrderCreationTip.checkoutTip,
+      })
+    }
+  }, [isBlockPendingAccountOrderCreation])
+
   const quoteCallBbck = useCallback(() => {
     const b3CartToQuote = document.querySelector('.b2b-cart-to-quote')
 

apps/storefront/src/locales/en-US/users.ts

@@ -75,6 +75,8 @@ export default {
     'Your company account application has been received. Please allow 24 hours for account approval and activation.',
   'intl.user.register.RegisterFinish.bcSuccess.tip':
     'Thank you for creating your account at {storeName}.',
+  'intl.user.register.RegisterFinish.blockPendingAccountOrderCreation.tip':
+    'Your account is pending approval. Ordering will be enabled after account approval',
 
   // register components
   'intl.user.register.RegisteredSingleCheckBox.label':

apps/storefront/src/locales/zh-CN/users.ts

@@ -65,6 +65,8 @@ export default {
     '您的公司账户申请已收到。 请等待 24 小时来批准和激活帐户。',
   'intl.user.register.RegisterFinish.bcSuccess.tip':
     '感谢您在 {storeName} 创建帐户。',
+  'intl.user.register.RegisterFinish.blockPendingAccountOrderCreation.tip':
+    '您的帐户正在等待批准。 帐户批准后将启用订购',
 
   // register components
   'intl.user.register.RegisteredSingleCheckBox.label': '电子邮件营销通讯',

apps/storefront/src/pages/registered/RegisterComplete.tsx

@@ -13,6 +13,7 @@ import { Alert, Box } from '@mui/material'
 //   Captcha,
 // } from '@/components/form'
 import { B3CustomForm } from '@/components'
+import { CustomStyleContext } from '@/shared/customStyleButtton'
 import { GlobaledContext } from '@/shared/global'
 import {
   createB2BCompanyUser,
@@ -56,6 +57,10 @@ export default function RegisterComplete(props: RegisterCompleteProps) {
     state: { currentChannelId },
   } = useContext(GlobaledContext)
 
+  const {
+    state: { blockPendingAccountOrderCreation },
+  } = useContext(CustomStyleContext)
+
   const {
     contactInformation,
     bcContactInformation,
@@ -395,6 +400,8 @@ export default function RegisterComplete(props: RegisterCompleteProps) {
           payload: {
             submitSuccess: true,
             isAutoApproval: isAuto,
+            blockPendingAccountOrderCreation:
+              blockPendingAccountOrderCreation.enabled,
           },
         })
         saveRegisterPassword(completeData)

apps/storefront/src/pages/registered/RegisteredBCToB2B.tsx

@@ -94,7 +94,7 @@ export default function RegisteredBCToB2B(props: RegisteredProps) {
   const { state, dispatch } = useContext(RegisteredContext)
 
   const {
-    state: { companyAutoApproval },
+    state: { companyAutoApproval, blockPendingAccountOrderCreation },
   } = useContext(CustomStyleContext)
 
   const showLoading = (isShow = false) => {
@@ -415,12 +415,17 @@ export default function RegisteredBCToB2B(props: RegisteredProps) {
         await getB2BFieldsValue(data, customerId, fileList)
 
         const isAuto = companyAutoApproval.enabled
+        const isBlockPendingAccountOrderCreation =
+          blockPendingAccountOrderCreation.enabled
+
         if (emailAddress) {
           dispatch({
             type: 'finishInfo',
             payload: {
               submitSuccess: true,
               isAutoApproval: isAuto,
+              blockPendingAccountOrderCreation:
+                isBlockPendingAccountOrderCreation,
             },
           })
           dispatch({

apps/storefront/src/pages/registered/RegisteredFinish.tsx

@@ -1,6 +1,6 @@
 import { useContext } from 'react'
 import { useB3Lang } from '@b3/lang'
-import { Box } from '@mui/material'
+import { Alert, Box } from '@mui/material'
 
 import RegisteredStepButton from './component/RegisteredStepButton'
 import { RegisteredContext } from './context/RegisteredContext'
@@ -14,7 +14,13 @@ export default function RegisteredFinish(props: {
   const { state } = useContext(RegisteredContext)
   const b3Lang = useB3Lang()
 
-  const { accountType, submitSuccess, isAutoApproval, storeName } = state
+  const {
+    accountType,
+    submitSuccess,
+    isAutoApproval,
+    storeName,
+    blockPendingAccountOrderCreation,
+  } = state
 
   const renderB2BSuccessPage = () => {
     if (accountType === '1') {
@@ -25,9 +31,27 @@ export default function RegisteredFinish(props: {
           })}
         </StyleTipContainer>
       ) : (
-        <StyleTipContainer>
-          {b3Lang('intl.user.register.RegisterFinish.notAutoApproved.tip')}
-        </StyleTipContainer>
+        <>
+          <StyleTipContainer>
+            {b3Lang('intl.user.register.RegisterFinish.notAutoApproved.tip')}
+          </StyleTipContainer>
+          {blockPendingAccountOrderCreation && (
+            <Alert
+              severity="warning"
+              variant="filled"
+              sx={{
+                margin: 'auto',
+                borderRadius: '4px',
+                padding: '6px 16px',
+                maxWidth: '820px',
+              }}
+            >
+              {b3Lang(
+                'intl.user.register.RegisterFinish.blockPendingAccountOrderCreation.tip'
+              )}
+            </Alert>
+          )}
+        </>
       )
     }
 

apps/storefront/src/pages/registered/context/RegisteredContext.tsx

@@ -24,6 +24,7 @@ interface RegisterState {
   submitSuccess?: boolean
   isAutoApproval?: boolean
   storeName?: string
+  blockPendingAccountOrderCreation?: boolean
 }
 interface RegisterAction {
   type: string
@@ -60,6 +61,7 @@ const initState = {
   storeName: '',
   submitSuccess: false,
   isAutoApproval: true,
+  blockPendingAccountOrderCreation: true,
 }
 
 export const RegisteredContext = createContext<RegisterContext>({

apps/storefront/src/shared/customStyleButtton/context/config.ts

@@ -12,6 +12,7 @@ type BtnKeys =
   | 'loginPageHtml'
   | 'accountLoginRegistration'
   | 'companyAutoApproval'
+  | 'blockPendingAccountOrderCreation'
 
 interface BtnStyle {
   color: string
@@ -136,6 +137,9 @@ export const initState = {
   companyAutoApproval: {
     enabled: true,
   },
+  blockPendingAccountOrderCreation: {
+    enabled: true,
+  },
 }
 
 export interface CustomStyleButtonAction {

apps/storefront/src/utils/loginInfo.ts

@@ -107,6 +107,8 @@ export const clearCurrentCustomerInfo = async (dispatch: DispatchProps) => {
   B3SStorage.set('salesRepCompanyId', '')
   B3SStorage.set('isAgenting', '')
 
+  B3SStorage.set('isShowBlockPendingAccountOrderCreationTip', {})
+
   dispatch({
     type: 'common',
     payload: {

apps/storefront/src/utils/storefrontConfig.ts

@@ -85,10 +85,6 @@ const storeforntKeys: StoreforntKeysProps[] = [
     key: 'shopping_list_on_product_page',
     name: 'shoppingListBtn',
   },
-  {
-    key: 'account_login_registration',
-    name: 'accountLoginRegistration',
-  },
   {
     key: 'quote_customer',
     name: 'quote_customer',
@@ -113,6 +109,10 @@ const storeforntKeys: StoreforntKeysProps[] = [
     key: 'company_auto_approval',
     name: 'companyAutoApproval',
   },
+  {
+    key: 'block_pending_account_order_creation',
+    name: 'blockPendingAccountOrderCreation',
+  },
 ]
 
 const getTemPlateConfig = async (
@@ -180,6 +180,13 @@ const getTemPlateConfig = async (
         }
       }
 
+      if (storeforntKey.key === 'block_pending_account_order_creation') {
+        sessionStorage.setItem(
+          'b2b-blockPendingAccountOrderCreation',
+          JSON.stringify(item.value === '1')
+        )
+      }
+
       ;(obj as CustomFieldItems)[(storeforntKey as StoreforntKeysProps).name] =
         {
           ...item.extraFields,