Discussing which implementations are better and why

impl-a.js

const selectedOrderlines = Object.entries(productQuantities)
    .filter(([, value]) => value !== '')
    .map(([productId, qty]) => {
      const quantity = Number(qty)
      return {
        branchQuantities: branchId !== undefined ? [{ branchId, quantity }] : undefined,
        productId: Number(productId),
        qty: quantity,
      }
    })

  const [showSelectionsToCart, hideSelectionsToCart] = useModal(() => (
    <AddToCart
      addType="Selections"
      onCancel={hideSelectionsToCart}
      orderlinesToAdd={selectedOrderlines}
      resetQuantities={resetQuantities}
    />

impl-b.js

  function getOrderlines() {
    return Object.entries(productQuantities).map(([productId, qty]) => {
      const quantity = Number(qty)
      return {
        ...(branchId !== undefined && { branchQuantities: [{ branchId, quantity }] }),
        productId: Number(productId),
        qty: quantity,
      }
    })
  }

  const [showSelectionsToCart, hideSelectionsToCart] = useModal(() => {
    const orderlines = getOrderlines().filter(_ => _.qty !== 0)
    return (
      <AddToCart
        addType="Selections"
        onCancel={hideSelectionsToCart}
        orderlinesToAdd={orderlines}
        resetQuantities={resetQuantities}
      />
    )
  })