feat: bc shopping list and junior buyer shopping list

https://bigc-b2b.atlassian.net/browse/BUN-624 https://bigc-b2b.atlassian.net/browse/BUN-661
bigcommerce · Mar 10, 2023 · a6b586f · a6b586f
1 parent 5ca1cc1
commit a6b586f
Show file tree

Hide file tree

Showing 28 changed files with 589 additions and 110 deletions.
diff --git a/apps/storefront/src/components/filter/B3Filter.tsx b/apps/storefront/src/components/filter/B3Filter.tsx
@@ -68,6 +68,7 @@ interface B3FilterProps<T, Y> {
   handleChange: (key: string, value: string) => void
   handleFilterChange: (value: Y) => void
   handleFilterCustomButtomClick?: () => void
+  showB3FilterMoreIcon?: boolean,
 }
 
 const B3Filter:<T, Y> (props: B3FilterProps<T, Y>) => ReactElement = (props) => {
@@ -80,6 +81,7 @@ const B3Filter:<T, Y> (props: B3FilterProps<T, Y>) => ReactElement = (props) =>
     handleChange,
     handleFilterChange,
     handleFilterCustomButtomClick,
+    showB3FilterMoreIcon = true,
   } = props
 
   const [isMobile] = useMobile()
@@ -125,12 +127,16 @@ const B3Filter:<T, Y> (props: B3FilterProps<T, Y>) => ReactElement = (props) =>
               handleChange={handleSearchChange}
               w="70%"
             />
-            <B3FilterMore
-              startPicker={startPicker}
-              endPicker={endPicker}
-              fiterMoreInfo={fiterMoreInfo}
-              onChange={handleFilterChange}
-            />
+            {
+              showB3FilterMoreIcon && (
+                <B3FilterMore
+                  startPicker={startPicker}
+                  endPicker={endPicker}
+                  fiterMoreInfo={fiterMoreInfo}
+                  onChange={handleFilterChange}
+                />
+              )
+            }
           </Box>
 
           <Box

diff --git a/apps/storefront/src/pages/orderDetail/components/CreateShoppingList.tsx b/apps/storefront/src/pages/orderDetail/components/CreateShoppingList.tsx
@@ -23,6 +23,7 @@ import {
 
 import {
   createB2BShoppingList,
+  createBcShoppingList,
 } from '@/shared/service/b2b'
 
 const list = [
@@ -69,6 +70,8 @@ const CreateShoppingList = ({
   const {
     state: {
       role,
+      isB2BUser,
+      currentChannelId,
     },
   } = useContext(GlobaledContext)
 
@@ -97,11 +100,16 @@ const CreateShoppingList = ({
       if (description.indexOf('\n') > -1) {
         data.description = description.split('\n').join('\\n')
       }
-      const createShoppingData = {
-        ...data,
-        status: +role === 2 ? 30 : 0,
+      const createSL = isB2BUser ? createB2BShoppingList : createBcShoppingList
+
+      const createShoppingData = data
+      if (isB2BUser) {
+        createShoppingData.status = +role === 2 ? 30 : 0
+      } else {
+        createShoppingData.channelId = currentChannelId
       }
-      await createB2BShoppingList(createShoppingData)
+
+      await createSL(createShoppingData)
       setLoading(false)
       onChange()
     })()

diff --git a/apps/storefront/src/pages/orderDetail/components/OrderAction.tsx b/apps/storefront/src/pages/orderDetail/components/OrderAction.tsx
@@ -124,6 +124,7 @@ interface OrderCardProps {
   itemKey: string,
   orderId: string,
   currencyInfo: OrderCurrency,
+  role: number | string,
 }
 
 interface DialogData{
@@ -143,6 +144,7 @@ const OrderCard = (props: OrderCardProps) => {
     itemKey,
     orderId,
     currencyInfo,
+    role,
   } = props
 
   const {
@@ -195,7 +197,7 @@ const OrderCard = (props: OrderCardProps) => {
     } else if (name === 'printInvoice') {
       window.open(`/account.php?action=print_invoice&order_id=${orderId}`)
     } else {
-      if (!isAgenting) {
+      if (!isAgenting && +role === 3) {
         snackbar.error('To re-order, return or add product to shopping list, please masquerade')
         return
       }
@@ -310,6 +312,7 @@ export const OrderAction = (props: OrderActionProps) => {
   const {
     state: {
       isB2BUser,
+      role,
     },
   } = useContext(GlobaledContext)
 
@@ -417,7 +420,7 @@ export const OrderAction = (props: OrderActionProps) => {
       key: 'add-to-shopping-list',
       name: 'shoppingList',
       variant: 'outlined',
-      isCanShow: isB2BUser,
+      isCanShow: true,
     },
   ]
 
@@ -470,6 +473,7 @@ export const OrderAction = (props: OrderActionProps) => {
             currencyInfo={money!}
             {...item}
             itemKey={item.key}
+            role={role}
           />
         ))
       }

diff --git a/apps/storefront/src/pages/orderDetail/components/OrderDialog.tsx b/apps/storefront/src/pages/orderDetail/components/OrderDialog.tsx
@@ -2,6 +2,7 @@ import {
   useState,
   ReactElement,
   useEffect,
+  useContext,
 } from 'react'
 
 import {
@@ -15,7 +16,9 @@ import {
 
 import {
   addProductToShoppingList,
+  addProductToBcShoppingList,
   getB2BVariantInfoBySkus,
+  getBcVariantInfoBySkus,
 } from '@/shared/service/b2b'
 
 import {
@@ -24,6 +27,10 @@ import {
   addProductToCart,
 } from '@/shared/service/bc'
 
+import {
+  GlobaledContext,
+} from '@/shared/global'
+
 import {
   B3CustomForm,
   B3Dialog,
@@ -99,6 +106,12 @@ export const OrderDialog: (props: OrderDialogProps) => ReactElement = ({
   itemKey,
   currencyInfo,
 }) => {
+  const {
+    state: {
+      isB2BUser,
+    },
+  } = useContext(GlobaledContext)
+
   const [isOpenCreateShopping, setOpenCreateShopping] = useState(false)
 
   const [openShoppingList, setOpenShoppingList] = useState(false)
@@ -135,9 +148,11 @@ export const OrderDialog: (props: OrderDialogProps) => ReactElement = ({
 
   const getVariantInfoByList = async () => {
     const skus = products.map((product) => product.sku)
+    const getVariantInfoBySku = isB2BUser ? getB2BVariantInfoBySkus : getBcVariantInfoBySkus
+
     const {
       variantSku: variantInfoList = [],
-    }: CustomFieldItems = await getB2BVariantInfoBySkus({
+    }: CustomFieldItems = await getVariantInfoBySku({
       skus,
     })
 
@@ -301,7 +316,9 @@ export const OrderDialog: (props: OrderDialogProps) => ReactElement = ({
       })
       const params = items.filter((item) => checkedArr.includes(+item.variantId))
 
-      await addProductToShoppingList({
+      const addToShoppingList = isB2BUser ? addProductToShoppingList : addProductToBcShoppingList
+
+      await addToShoppingList({
         shoppingListId: +id,
         items: params,
       })

diff --git a/apps/storefront/src/pages/orderDetail/components/OrderShoppingList.tsx b/apps/storefront/src/pages/orderDetail/components/OrderShoppingList.tsx
@@ -1,6 +1,7 @@
 import {
   useState,
   useEffect,
+  useContext,
 } from 'react'
 
 import {
@@ -15,8 +16,13 @@ import styled from '@emotion/styled'
 
 import {
   getB2BShoppingList,
+  getBcShoppingList,
 } from '@/shared/service/b2b'
 
+import {
+  GlobaledContext,
+} from '@/shared/global'
+
 import {
   B3Dialog,
 } from '@/components'
@@ -67,20 +73,34 @@ export const OrderShoppingList = (props: orderShoppingListProps) => {
     setLoading = noop,
   } = props
 
+  const {
+    state: {
+      isB2BUser,
+      currentChannelId,
+    },
+  } = useContext(GlobaledContext)
+
   const [list, setList] = useState([])
   const [activeId, setActiveId] = useState('')
 
   const getList = async () => {
     setLoading(true)
     setList([])
+
+    const getShoppingList = isB2BUser ? getB2BShoppingList : getBcShoppingList
+    const infoKey = isB2BUser ? 'shoppingLists' : 'customerShoppingLists'
+    const params = isB2BUser ? {} : {
+      channelId: currentChannelId,
+    }
+
     try {
       const {
-        shoppingLists: {
+        [infoKey]: {
           edges: list = [],
         },
-      }: CustomFieldItems = await getB2BShoppingList()
+      }: CustomFieldItems = await getShoppingList(params)
 
-      const newList = list.filter((item: CustomFieldItems) => item.node.status === 0)
+      const newList = list.filter((item: CustomFieldItems) => (isB2BUser ? item.node.status === 0 : true))
 
       setList(newList)
     } finally {
@@ -137,18 +157,18 @@ export const OrderShoppingList = (props: orderShoppingListProps) => {
             }}
           >
             {
-                  list.map((item: ListItem) => (
-                    <ShoppingListMenuItem
-                      key={item.node.id}
-                      className={activeId === item.node.id ? 'active' : ''}
-                      onClick={handleListItemClicked(item)}
-                    >
-                      <ListItemText>
-                        {item.node.name}
-                      </ListItemText>
-                    </ShoppingListMenuItem>
-                  ))
-                }
+              list.map((item: ListItem) => (
+                <ShoppingListMenuItem
+                  key={item.node.id}
+                  className={activeId === item.node.id ? 'active' : ''}
+                  onClick={handleListItemClicked(item)}
+                >
+                  <ListItemText>
+                    {item.node.name}
+                  </ListItemText>
+                </ShoppingListMenuItem>
+              ))
+            }
           </MenuList>
         </Box>
 

diff --git a/apps/storefront/src/pages/pdp/PDP.tsx b/apps/storefront/src/pages/pdp/PDP.tsx
@@ -4,6 +4,7 @@ import {
   Dispatch,
   SetStateAction,
   useRef,
+  useContext,
 } from 'react'
 
 import {
@@ -27,9 +28,15 @@ import {
 
 import {
   searchB2BProducts,
+  searchBcProducts,
   addProductToShoppingList,
+  addProductToBcShoppingList,
 } from '@/shared/service/b2b'
 
+import {
+  GlobaledContext,
+} from '@/shared/global'
+
 import {
   OrderShoppingList,
 } from '../orderDetail/components/OrderShoppingList'
@@ -101,6 +108,11 @@ const PDP = ({
   setOpenPage,
 }: PDPProps) => {
   const isPromission = true
+  const {
+    state: {
+      isB2BUser,
+    },
+  } = useContext(GlobaledContext)
 
   const pdpRef = useRef<PDPRefProps>({
     timer: null,
@@ -179,10 +191,11 @@ const PDP = ({
       } = getDefaultCurrencyInfo()
 
       const companyId = B3SStorage.get('B3CompanyInfo')?.id || B3SStorage.get('salesRepCompanyId')
+      const getProducts = isB2BUser ? searchB2BProducts : searchBcProducts
 
       const {
         productsSearch,
-      } = await searchB2BProducts({
+      } = await getProducts({
         productIds: [+productId],
         currencyCode,
         companyId,
@@ -216,7 +229,9 @@ const PDP = ({
         optionList,
       }
 
-      await addProductToShoppingList({
+      const addToShoppingList = isB2BUser ? addProductToShoppingList : addProductToBcShoppingList
+
+      await addToShoppingList({
         shoppingListId: +id,
         items: [params],
       })

diff --git a/apps/storefront/src/pages/quickorder/Quickorder.tsx b/apps/storefront/src/pages/quickorder/Quickorder.tsx
@@ -34,6 +34,7 @@ const Quickorder = () => {
     state: {
       role,
       isAgenting,
+      isB2BUser,
     },
   } = useContext(GlobaledContext)
 
@@ -109,6 +110,7 @@ const Quickorder = () => {
             checkedArr={checkedArr}
             isAgenting={isAgenting}
             setIsRequestLoading={setIsRequestLoading}
+            isB2BUser={isB2BUser}
           />
         </Box>
       </Box>