How preview from draft in shopify product editing

[oiccastella]

I would like to use preview from draft in shopify product editing, how should I implement this in hydrogen?

Even if hydrogen is not supported, does anyone know of an alternative solution?

[davidhousedev]

I haven't tried this yet, but my plan for doing this will likely involve having two different Hydrogen Apps in my store: one that is for production, and the other that's for preview. That way, you can set the product as active in the preview store, verify that it looks right, then make it available in your production store.

Again, I haven't tried this yet but I'm hoping it'll work because I don't have another plan in mind 😅

[juanpprieto]

I have an idea that would not require having two separate apps. I will try and put together an example and share it here 🙏🏼

[juanpprieto]

@davidhousedev @oiccastella

Here's an example repo and demo that allows draft product previews via a ?preview=true query param.

It's far from ideal to have to use the Admin API for this, but it's a descent workaround. The SFAPI team is looking into exposing draft products in the future.

Hope this helps.

P.S — Even though the Admin API key is safe here (server), I'd still ensure it has just read-only access for the product and product_listing scopes.

[davidhousedev]

Thanks @juanpprieto ! Good to know that using an admin API is also a reasonable solution.

[juanpprieto]

A working approach here