Admin UI Extension Not Updating on Product Navigation

Extensions
1

Hi,

I’m experiencing an issue with my Admin UI Extension for product configuration. When navigating between different product pages in the Shopify admin interface, the extension does not update to reflect the newly selected product. Instead, it continues to display data from the initial product loaded.

Expected Behavior:
When a user navigates to a different product in the Shopify admin, the extension should update to display information relevant to the new product.

Please see screenshot attached. First product visited is on the left and the second product visited is on the right.

Observed Behavior:
The extension remains static, displaying the original product’s information, and does not react to navigation changes.

Please see screenshot attached. First product visited is on the left and the second product visited is on the right.

Steps to Reproduce:

  1. Install and enable the Admin UI Extension on a development store.
  2. Navigate to the Shopify admin and open a product page where the extension is displayed.
  3. Observe that the extension displays the correct information for the initial product.
  4. Use the Shopify admin interface to navigate to a different product (e.g., using the product list).
  5. Observe that the extension does not update and continues to display information from the initial product.

Actions I’ve tested:

  • The data object from useApi(TARGET) does not update upon navigation to a new product.
  • Neither data.product.id nor extension.resource.id change when selecting a different product.
  • The extension does not re-render or remount when navigating between products.
  • There is no apparent method or API available within the Admin UI Extension environment to detect navigation events or context changes.

This is with:

api_version = "2024-07"
target = "admin.product-details.configuration.render"

I’ve triple checked the targets match in both files.

Based on my observations, it seems that data updating on navigation should be expected behavior since other admin extensions like the draft orders edit do not exhibit this issue. Can anyone confirm if this is the expected behavior for Admin UI Extensions when navigating between products? If so, could you provide guidance on how to ensure that the data object updates correctly upon navigation, or how to detect navigation events or context changes within the Admin UI Extension environment?

Any assistance or insights would be greatly appreciated.

2

Would you be able to test if when you target admin.product-details.block.render does that work for you? Just to check if its a target issue.

3

I’ve tried your test. I updated ProductDetailsConfigurationExtension.jsx to use admin.product-details.block.render and my shopify.extension.toml to use the same.
This makes the block option appear at the bottom of the page but adding the block just makes the “add block” option disappear and nothing else happens, I’m assuming that its not working because its the wrong extension type.

We need the target to admin.product-details.configuration.render as the product owner of the product to display its components the same way the Shopify bundles app does it.

4

Hey @Gabrielle_Rea yes sorry, I mean if you add the block and change products, does the extensions product information get updated correctly?
If it does, that confirms there is an issue with only the configuration section, if it doesn’t it might mean there is either a wider issue or with the extensions config. It will help narrow down the cause of the issue :slight_smile: