Modal actions not rendering

Extensions
,
1

I noticed there’s a new set of props for the Modal component primaryAction and secondaryAction for the checkout/customer account extensions UI. However, when I use these props they don’t render anything. I can confirm this works properly with the Sheet component.

Example code:

      <Link overlay={(
        <Modal padding id="testing" title="Testing" primaryAction={<Button onPress={() => {}}>This never renders</Button>}>
        <TextBlock>This is a test</TextBlock>
      </Modal>
      )}>Click me</Link>

I’m not getting any Typescript error and extension saves just fine via the CLI and no console errors to speak of.

2

Hi @Nick_Mealey, the code snippet appears to be using the primaryAction prop correctly. Have you updated the extension’s API version to 2024-10 or unstable in the shopify.extension.toml configuration file?

3

I’m using the unstable version

4

Hey @Nick_Mealey! Are you only seeing this on Customer Account pages (including the Order Status Page), or on both Checkout and Customer Account pages?

5

Hey @Kenza_Iraki , I haven’t tested on the Checkout - only on the Customer Account Page

6

Hey Nick, we shipped a fix for this, can you check if this is resolved please? :pray:

5 Likes
7

@Kenza_Iraki it works great now thanks for the quick turn-around!

1 Like