fix: shopping list detail optimization

bigcommerce · Jan 5, 2023 · 183244d · 183244d
1 parent 85d6deb
commit 183244d
Show file tree

Hide file tree

Showing 3 changed files with 98 additions and 98 deletions.
diff --git a/apps/storefront/src/pages/shoppingListDetails/components/ReAddToCart.tsx b/apps/storefront/src/pages/shoppingListDetails/components/ReAddToCart.tsx
@@ -38,6 +38,7 @@ import {
 
 import {
   ProductsProps,
+  addlineItems,
 } from '../shared/config'
 
 interface successTipOptions{
@@ -241,34 +242,8 @@ export const ReAddToCart = (props: ShoppingProductsProps) => {
     }
     try {
       setLoading(true)
-      const lineItems = products.map((item: ProductsProps) => {
-        const {
-          node,
-        } = item
-
-        const optionList = JSON.parse(node.optionList || '[]')
-
-        const getOptionId = (id: number | string) => {
-          if (typeof id === 'number') return id
-          if (id.includes('attribute')) return +id.split('[')[1].split(']')[0]
-          return +id
-        }
-
-        const optionValue = optionList.map((option: {
-          option_id: number | string,
-          option_value: number| string,
-        }) => ({
-          optionId: getOptionId(option.option_id),
-          optionValue: option.option_value,
-        }))
-
-        return {
-          quantity: node.quantity,
-          productId: node.productId,
-          optionSelections: optionValue,
-        }
-      })
 
+      const lineItems = addlineItems(products)
       const cartInfo = await getCartInfo()
       let res
       if (cartInfo.length > 0) {

diff --git a/apps/storefront/src/pages/shoppingListDetails/components/ShoppingDetailFooter.tsx b/apps/storefront/src/pages/shoppingListDetails/components/ShoppingDetailFooter.tsx
@@ -27,6 +27,7 @@ import {
 
 import {
   ProductsProps,
+  addlineItems,
 } from '../shared/config'
 import {
   B3LinkTipContent,
@@ -148,75 +149,7 @@ const ShoppingDetailFooter = (props: ShoppingDetailFooterProps) => {
       } = verifyInventory(getInventoryInfos?.variantSku || [])
 
       if (validateSuccessArr.length !== 0) {
-        const lineItems = validateSuccessArr.map((item: ProductsProps) => {
-          const {
-            node,
-          } = item
-
-          const optionList = JSON.parse(node.optionList || '[]')
-
-          const getOptionId = (id: number | string) => {
-            if (typeof id === 'number') return id
-            if (id.includes('attribute')) return +id.split('[')[1].split(']')[0]
-            return +id
-          }
-
-          const {
-            productsSearch: {
-              allOptions,
-            },
-          } = node
-
-          const optionValue: any = []
-
-          allOptions.forEach((item: any) => {
-            const splicedId = `attribute[${item.id}]`
-
-            if (item.type === 'date') {
-              let month = ''
-              let day = ''
-              let year = ''
-              optionList.forEach((list: any) => {
-                if (list.option_id === `${splicedId}[month]`) {
-                  month = list.option_value
-                }
-                if (list.option_id === `${splicedId}[day]`) {
-                  day = list.option_value
-                }
-                if (list.option_id === `${splicedId}[year]`) {
-                  year = list.option_value
-                }
-              })
-
-              if (month && day && year) {
-                optionValue.push({
-                  optionId: getOptionId(item.id),
-                  optionValue: {
-                    day,
-                    month,
-                    year,
-                  },
-                })
-              }
-            } else {
-              const listItem = optionList.find((list: any) => list.option_id === splicedId)
-              if (listItem && listItem?.option_value) {
-                optionValue.push({
-                  optionId: getOptionId(listItem.option_id),
-                  optionValue: listItem.option_value,
-                })
-              }
-            }
-          })
-
-          return {
-            quantity: node.quantity,
-            productId: node.productId,
-            variantId: node.variantId,
-            optionSelections: optionValue,
-          }
-        })
-
+        const lineItems = addlineItems(validateSuccessArr)
         const cartInfo = await getCartInfo()
         const res = cartInfo.length ? await addProductToCart({
           lineItems,

diff --git a/apps/storefront/src/pages/shoppingListDetails/shared/config.ts b/apps/storefront/src/pages/shoppingListDetails/shared/config.ts
@@ -175,7 +175,6 @@ const getFieldOptions = (fieldType: string, option: ShoppingListProductItemModif
     const checkedId: number | string = optionValues.find((values) => values.label === 'Yes')?.id || (optionValues.length > 0 ? optionValues[0].id : '')
 
     return {
-      label: '',
       options: [{
         value: checkedId,
         label,
@@ -373,7 +372,6 @@ export const getOptionRequestData = (formFields: CustomFieldItems[], requestData
     }
 
     if (fieldType === 'checkbox') {
-      console.log(4444, fieldValue, fieldValue?.length > 0 ? fieldValue[0] : '')
       requestData[decodeName] = fieldValue?.length > 0 ? fieldValue[0] : ''
       return
     }
@@ -422,3 +420,97 @@ export const getQuickAddRowFields = (name: string | number) => [
     allowArrow: true,
   },
 ]
+
+interface OptionListProps {
+  option_id: string,
+  option_value: string,
+}
+
+interface DateProps {
+  day: string,
+  month: string,
+  year: string,
+}
+
+interface OptionValueProps {
+  optionId: string | number,
+  optionValue: string | DateProps,
+}
+
+interface AllOptionsProps {
+  id: string | number,
+  type: string,
+}
+
+export const addlineItems = (products: ProductsProps[]) => {
+  const lineItems = products.map((item: ProductsProps) => {
+    const {
+      node,
+    } = item
+
+    const optionList: OptionListProps[] = JSON.parse(node.optionList || '[]')
+
+    const getOptionId = (id: number | string) => {
+      if (typeof id === 'number') return id
+      if (id.includes('attribute')) return +id.split('[')[1].split(']')[0]
+      return +id
+    }
+
+    const {
+      productsSearch: {
+        allOptions,
+      },
+    } = node
+
+    const optionValue: OptionValueProps[] = []
+
+    allOptions.forEach((item: AllOptionsProps) => {
+      const splicedId = `attribute[${item.id}]`
+
+      if (item.type === 'date') {
+        let month: string = ''
+        let day: string = ''
+        let year: string = ''
+        optionList.forEach((list: OptionListProps) => {
+          if (list.option_id === `${splicedId}[month]`) {
+            month = list.option_value
+          }
+          if (list.option_id === `${splicedId}[day]`) {
+            day = list.option_value
+          }
+          if (list.option_id === `${splicedId}[year]`) {
+            year = list.option_value
+          }
+        })
+
+        if (month && day && year) {
+          optionValue.push({
+            optionId: getOptionId(item.id),
+            optionValue: {
+              day,
+              month,
+              year,
+            },
+          })
+        }
+      } else {
+        const listItem = optionList.find((list: OptionListProps) => list.option_id === splicedId)
+        if (listItem && listItem?.option_value) {
+          optionValue.push({
+            optionId: getOptionId(listItem.option_id),
+            optionValue: listItem.option_value,
+          })
+        }
+      }
+    })
+
+    return {
+      quantity: node.quantity,
+      productId: node.productId,
+      variantId: node.variantId,
+      optionSelections: optionValue,
+    }
+  })
+
+  return lineItems
+}