Bundles created with the Shopify App (Summer 2023) can't be added to cart

[jpvalery]

Hey,

I've installed Shopify newest app for bundles (https://apps.shopify.com/shopify-bundles) and found that the quantities are not coming over properly.

For instance, I have a bundle with 8 units available, yet it shows as "Out of stock" with Hull.

I'm happy to open a PR and work on a fix but I could use some support in identifying the root cause of this.

At the moment, I'm guessing the course of action would be

• Add additional logging to /api/shopify/product-update to get the full request from Shopify
• Identify how/if the quantity of the bundles are being sent over
• If they are, write logic to /api/shopify/product-update so that it's properly added
• If they aren't... No clue yet.

[jpvalery]

Update:
Tried instead to GET the URL from /api/shopify/product-inventory (aka https://${process.env.NEXT_PUBLIC_SHOPIFY_STORE_ID}.myshopify.com/admin/api/2022-10/products/${id}.json) to see if there was any difference between a bundle and a single product.

I couldn't spot any. 🤨

It seems that it's now showing the right quantity and inStock.

[ndimatteo]

hey there @jpvalery, the new Shopify bundles feature hasn't been tested with this setup yet. I imagine there's a lot more going on under-the-hood with it that's net new for HULL.

Also, considering the current version of HULL still uses the Shopify Buy SDK and a custom Sanity sync setup, there are likely some incompatibilities with the new Shopify bundles release.

I have plans to update HULL in the coming months to use a more modern flow (using Shopify's hydrogen-react and the sanity-connect plugin) which will likely have better support for the new Shopify Bundles.

Until then, feel free to continue looking into a fix and issue a PR if you find a solution! 🤘

[jpvalery]

Updating this as I'm seeing now that they can't be added to cart. I couldn't spot any difference when I logged newCheckout to the console. Trying to figure this out and will update the issue with my findings

[jpvalery]

After some trial-and-erroring, I found that the checkoutCreate doesn't work with the variantId returned by the bundle:

Continuing from there, I found that the productId doesn't return any data when used in a query:

I'm fairly confident that the root cause of the issue is here. Because we can't get the product data, we can't add it to the cart (with the storefont API—the admin API does return the proper data).

Continuing further, I tried listing all products (hoping that I'd see something in the product object for the bundle that would put on the solution's path) and realized that they're not showing up there:

Opened a ticket with Shopify to see if they have any idea—once I know how to properly find and add the bundles to the cart, the PR should be fairly easy.

[jpvalery]

Continuing my investigation, I found that adding the scope unauthenticated_read_bundles to the Storefront API permissions for the custom app made them appear in the query ✅

Still not able to add them to the cart (like this unanswered thread in their forum https://community.shopify.com/c/hydrogen-headless-and-storefront/how-to-add-product-in-cart-using-node-and-graphql-apis/m-p/2021952).

I have updated my ticket and opened a forum post to try and find what's missing here 🤔

[jpvalery]

Seems that another person facing the same issue got us a potential solution.

doing checkout.addLineItems doesn't work; but creating a cart does:

mutation {
  cartCreate(input: { 
    lines: [
      {
        merchandiseId: "variantId",
        quantity: 1
      }
    ]
  }) {
    cart {
      id
      checkoutUrl
    }
    userErrors {
      field
      message
    }
  }
}

@ndimatteo would you happen to know if this is doable with the shopify-buy package? Their doc isn't exactly clear and I'm checking in the off chance you would know.

Otherwise seems there's this option:

• the aforementioned graphql

Lines to update:

HULL/lib/context.js

Lines 303 to 307 in 699c570

	// Add it to the Shopify checkout cart
	const newCheckout = await shopifyClient.checkout.addLineItems(
	checkout.id,
	newItem
	)

[jpvalery]

Apparently Cart can't be handled by the JS SDK
Shopify/js-buy-sdk#907 (comment)

And the Shopify support team on the ticket told me they wouldn't help with this.

So GraphQL queries seem the only option...

I'm thinking that adding a cart object to initialContext and then leveraging graphQL queries for add/remove/update might be the best way to go.

Unsure if that should be a PR seen the massive change that would represent?

If it should, I'm more than happy to partner on that migration—I have a good grasp on the queries/mutations needed to create cart, add/remove items; I could benefit from some guidance on how to integrate that with the current context/setup.

[ndimatteo]

Hey there @jpvalery! Appreciate you digging into this to see what the options are for a solve.

As suspected, it sounds like the buy SDK is just not up-to-par with some of the newer features of Shopify.

Happy to review a PR, but I think a lot of this will be addressed with the next release planned (hydrogen-react, sanity-connect, etc).

[jpvalery]

Of course @ndimatteo! Least I could do!

I'm going to try and get this migrated over GraphQL queries with the following caveats:

1. I might need some of your wisdom/experience with the whole context.js
2. It might not be as elegant or efficient as the rest of your code

[jpvalery]

Fixed in #129 by jpvalery@1425889

[Hahlh]

Just wanted to say thank you @jpvalery for outlining your journey so thoroughly here.
We are currently looking into creating bundle features for clients as well and found this issue very useful.