BigCommerce returns variantId for simple products in /api/storefront/carts/{{cart_id}}

Question

I'm calling storefront api (api/storefront/carts/{{cart_id}}) from cart page.

I would like to use the lineitems available on physicalItems, digitalItems, giftCertificates, customItems available under lineItems.

Require to generate data array on template level if given product (line item) does not have variantId but API(api/storefront/carts/{{cart_id}}) returns variantId
for all the products including simple products and those offers variants as well.

Even given variantId does not exist in the product grid also.

I won't able to differentiate from API response whether a given line item is actually a simple product or products having variants.

I have attached the cart line item console as an attachment.

var  cartRecords = [];
fetch('/api/storefront/carts/{{cart_id}}?include=lineItems.physicalItems.options,lineItems.digitalItems.options', {credentials: 'include'})
                    .then(function (response) {
                        return response.json();
                    })
                    .then(function (cartData) {

                        if(!cartData){
                            return false;
                        }
                        
                        var cartLineItems = cartData.lineItems.physicalItems;
                        if(!cartLineItems){
                            return false;
                        }
                        for (let index=0; index < cartLineItems.length ; index++){

                            console.log(cartLineItems[index]);
                            var itemId = '';
                            if (cartLineItems[index]['options'].length) {
                                itemId = cartLineItems[index]['productId'] + '-variantid_' + cartLineItems[index]['variantId'];
                            } else {
                                itemId = cartLineItems[index]['productId'];
                            }

                            cartRecords.push({
                                'itemId': itemId,
                                'itemGroupId': cartLineItems[index]['productId'],
                            });
                        }
                    });

                    var cartLineItemsPage = {
                        'pageType': "cart",
                        'cartRecords': cartRecords
                    };

Answer 1

I do a graphql query to get more details on the products in the cart. I can then compare the SKU in the cart response with the SKU in the graphql product response. If they are different, then the item is a variant.

Behind the scenes, the simple products still have a single variantId. What's most important is that the consumers of your data use the same identifiers.