fix: shopping checkbox and number limit

bigcommerce · Feb 22, 2024 · 6129f7e · 6129f7e
1 parent 15495b9
commit 6129f7e
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 5 deletions.
diff --git a/apps/storefront/src/components/table/B3PaginationTable.tsx b/apps/storefront/src/components/table/B3PaginationTable.tsx
@@ -63,6 +63,7 @@ interface B3PaginationTableProps {
   sortDirection?: 'asc' | 'desc'
   sortByFn?: (e: { key: string }) => void
   orderBy?: string
+  pageType?: string
 }
 
 function PaginationTable(
@@ -98,6 +99,7 @@ function PaginationTable(
     sortDirection = 'asc',
     sortByFn = () => {},
     orderBy = '',
+    pageType = '',
   }: B3PaginationTableProps,
   ref?: Ref<unknown>
 ) {
@@ -273,7 +275,15 @@ function PaginationTable(
         list.forEach((item: CustomFieldItems) => {
           const option = item?.node || item
           if (option) {
-            selects.push(option[selectedSymbol])
+            if (pageType === 'shoppingListDetailsTable') {
+              selects.push(
+                option.quantity > 0 || !option.disableCurrentCheckbox
+                  ? option[selectedSymbol]
+                  : ''
+              )
+            } else {
+              selects.push(option[selectedSymbol])
+            }
           }
         })
         setSelectCheckbox(selects)

diff --git a/apps/storefront/src/pages/shoppingListDetails/components/ShoppingDetailTable.tsx b/apps/storefront/src/pages/shoppingListDetails/components/ShoppingDetailTable.tsx
@@ -218,12 +218,15 @@ function ShoppingDetailTable(
       if (node?.id === id) {
         node.quantity = `${+value}`
         node.disableCurrentCheckbox = +value === 0
-        setDisabledSelectAll(+value === 0)
       }
 
       return item
     })
 
+    const nonNumberProducts = newListItems.filter(
+      (item: ListItemProps) => +item.node.quantity === 0
+    )
+    setDisabledSelectAll(nonNumberProducts.length === newListItems.length)
     paginationTableRef.current?.setList([...newListItems])
   }
 
@@ -354,14 +357,15 @@ function ShoppingDetailTable(
   const getSelectCheckbox = (selectCheckbox: Array<string | number>) => {
     if (selectCheckbox.length > 0) {
       const productList = paginationTableRef.current?.getList() || []
-      const checkedItems = selectCheckbox.map((item: number | string) => {
+      const checkedItems: CustomFieldItems[] = []
+      selectCheckbox.forEach((item: number | string) => {
         const newItems = productList.find((product: ListItemProps) => {
           const { node } = product
 
           return node.id === item
         })
 
-        return newItems
+        if (newItems) checkedItems.push(newItems)
       })
 
       setCheckedArr([...checkedItems])
@@ -422,7 +426,7 @@ function ShoppingDetailTable(
       const nonNumberProducts = edges.filter(
         (item: ListItemProps) => item.node.quantity === 0
       )
-      setDisabledSelectAll(nonNumberProducts.length > 0)
+      setDisabledSelectAll(nonNumberProducts.length === edges.length)
     }
   }, [shoppingListInfo])
 
@@ -773,6 +777,7 @@ function ShoppingDetailTable(
         sortDirection={order}
         orderBy={orderBy}
         sortByFn={handleSetOrderBy}
+        pageType="shoppingListDetailsTable"
         renderItem={(
           row: ProductInfoProps,
           index?: number,