Allow creation of multiple line item options on Add To Cart

[owenhoskins]

Is your feature request related to a problem? Please describe

I have a very specific use-case which the AddToCartButton does not cover. As such, I have extended useOrderContainer to expose the addToCart method which I have found extremely helpful. Similarly, I have also exposed updateOrder and createOrder.

Part of my use-case involves adding multiple line item options when addToCart is fired and instead of maintaining my own fork of this package, I was wondering if the following solution would be acceptable, and if not, how might this need be best met?

Describe the solution you'd like

Currently, I have customized the OrderReducer's addToCart method to accept a lineItemOptions param and where the method had handled the lineItemOption... https://github.com/commercelayer/commercelayer-react-components/blob/4bc8256c0abfd7aad67a638133a9686dab02847f/packages/react-components/src/reducers/OrderReducer.ts#L467 ...I used a For Loop to support the creation of multiple line item options:

        if (lineItemOption != null) {
          lineItemOptions.push(lineItemOption)
        }
        if (lineItemOptions && lineItemOptions.length > 0) {
          for (const lineItemOption of lineItemOptions) {
            const { skuOptionId, options, quantity } = lineItemOption
            const skuOption = sdk.sku_options.relationship(skuOptionId)
            const lineItemRel = sdk.line_items.relationship(newLineItem.id)
            const lineItemOptionsAttributes: LineItemOptionCreate = {
              quantity: quantity ?? 1,
              options,
              sku_option: skuOption,
              line_item: lineItemRel
            }
            await sdk.line_item_options.create(lineItemOptionsAttributes)
          }
          await getApiOrder({ id, ...params })
        } else {
          await getApiOrder({ id, ...params, state })
        }

Please let me know, and I could open a pull request with the above code and the exposed updateOrder and createOrder in the useOrderContainer hook. Thanks!

Describe alternatives you've considered

No response

Are you able to assist to bring the feature to reality?

yes, I can

Additional context

No response

[acasazza]

Hi @owenhoskins, Could you explain better the usage with an example? Because you can use a single line items option to customize your SKU by adding attributes into the options object. Thanks. 🙌🏻

[owenhoskins]

Thanks for the reply @acasazza. I'll look into the line_item.option object for my use-case first and get back to you.

[owenhoskins]

Hello @acasazza I've finally looped back to this part of the project.

I am using the sku options to store price data that I use in my external price calculation. I could just use metadata for this purpose, but I believe line item options are more desirable because:

• durning my cart and checkout flow line item options can be further customized, and
• interacting with the SDK via line item option resources feels like a better practice and less error prone than interacting with a nested object on a single resource
• also, line item options are easy to display in the checkout and account areas

Let me know if the above makes sense!