Shopify AppBridge navigationMenu.set({active: settings}) not working

Question

The Navigation menu, the app bridge navigationMenu (https://shopify.dev/docs/apps/tools/app-bridge/actions/menu/navigation) is not working with navigationMenu.set({active: settings});

I use the latest versions of app-bridge (3.7.2) and app-bridge-utils (3.5.1).

Here is the code I use:

const app = createApp({
      apiKey: this.apiKey,
      host: this.host,
    });
 
    const dashboard = AppLink.create(app, {
      label: 'Dashboard',
      destination: '/app',
    });
 
    const settings = AppLink.create(app, {
      label: 'Settings',
      destination: '/app/settings',
    });
 
    const navigationMenu = NavigationMenu.create(app, {
      items: [dashboard, settings],
    });
 
    navigationMenu.set({active: settings})

Can anyone spot what I am doing wrong ?

Any help is appreciated!

Answer 1

You can pass the active link directly in the navigation menu create

const navigationMenu = NavigationMenu.create(ShopifyApp, {
items: [dashboard, settings],
active: settings,
});

also have a look at you create app method

let ShopifyApp = createApp({
    apiKey: '{!! config('custom.shopify.apiKey') !!}',
    shopOrigin: '{!! $currentShop->domain !!}',
    host: shopifyHost,
    forceRedirect: true,
});