Display multiple apps in checkout editor

Solved
Turbofan1178
Shopify Partner
27 3 3

I'm just getting started with developing checkout extensions and I noticed some apps that display multiple apps in the checkout editor for example, one app for delivery date and another for checkout upsell (in the image, delivery date and VAT id field show up from the same app developer). 

I'm wondering how I can do this in React. Is there a way I can setup the rendering to accomplish this.

I've attached an image to illustrate what I'm referring to.Screenshot 2023-06-14 at 02.29.59.png

Accepted Solution (1)
Turbofan1178
Shopify Partner
27 3 3

This is an accepted solution.

Thanks @Liam for replying to my post. I actually figured it out, I realised the extensions folder could contain multiple extensions so generating a new extension with 

npm run shopify app generate extension -- --type checkout_ui --name=my-checkout-ui-extension

and enabling it in the partners dashboard did the trick.

View solution in original post

Replies 3 (3)
Liam
Shopify Staff
Shopify Staff
1864 195 572

Hi Turbofan1178,

 

It's possible these apps are displayed in the theme editor based on personalisation. Just to confirm, these are not apps which are currently installed, correct?

 

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

Turbofan1178
Shopify Partner
27 3 3

This is an accepted solution.

Thanks @Liam for replying to my post. I actually figured it out, I realised the extensions folder could contain multiple extensions so generating a new extension with 

npm run shopify app generate extension -- --type checkout_ui --name=my-checkout-ui-extension

and enabling it in the partners dashboard did the trick.

Liam
Shopify Staff
Shopify Staff
1864 195 572

Great to see you figured it out - nice work!

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog