Configuring the "?" Help Menu (Info Menu)

The "?" icon in the upper-right of the Angular UI is the ncs-info-menu component. It shows the app version and a list of context-aware links to external documentation pages. All links are driven by a single JSON config file per app — no code changes needed to add or update them.

Where to edit

How it is wired up

• Loaded at app startup in app.component.ts via infoMenuService.init('assets/info-menu.json').

• Service: src/ncs-ui-app-shared/@xpedium-ui-library/core/services/info-menu.service.ts — matches the current Angular route to a config entry.

• Component: src/ncs-ui-app-shared/@xpedium-ui-library/layout/components/info-menu/info-menu.component.ts — renders the menu and opens the destination.

• Toolbar (xRMS): src/ncs-angular-clients/projects/xrms/src/app/layout/components/toolbar/toolbar.component.html passes [version] and [showInternal].

Config structure

{
    "version": {
        "url": "https://.../wiki/page-shown-when-user-clicks-version"
    },
    "documentation": [
        {
            "name": "My Page",
            "pageUrl": "feature/my-page",
            "infoMenu": [
                {
                    "name": "About My Page",
                    "url": "https://example.com/how-to",
                    "internal": false,
                    "onChildPages": true
                }
            ],
            "childPages": [
                {
                    "pageUrl": "edit/:id",
                    "infoMenu": [
                        { "name": "Editing Help", "url": "https://example.com/edit-help" }
                    ]
                }
            ]
        }
    ]
}

Field reference

Behavior of internal

• internal: true — opens in a new browser tab. Only visible to users whose role grants canReadInternalInfo (the toolbar passes this flag via [showInternal]). Typical use: Confluence pages, internal API docs, the Swagger UI under api/help/....

• internal: false (or omitted) — opens inside an in-app overlay (InfoDialogComponent) that fills the viewport. Typical use: customer-facing how-to articles.

Adding a new how-to link

1. Find the Angular route for the page you want the link to appear on (e.g. /inventory/warehouses).

2. Open the app's info-menu.json and locate or create an entry whose pageUrl matches: "pageUrl": "inventory/warehouses".

3. Add an item to its infoMenu array:

   {
       "name": "How to Manage Warehouses",
       "url": "https://your-docs-site.example/warehouses",
       "onChildPages": true
   }

4. Save. In dev (npm run xrms-start), refresh the browser — the config is fetched at app startup. For prod, the file ships under assets/ so it is picked up by the next deploy; no rebuild of TypeScript is required to change links.

Example: making a link appear on a detail page

{
    "name": "Route Version Customer",
    "pageUrl": "route/routeversioncustomer",
    "childPages": [
        {
            "pageUrl": "edit/:RVCCUSCHN/:RVCCUSNUM/:RVCSUBCUS/:RVCRTENUM/:RVCRTEVER/:RVCEFFDTE",
            "infoMenu": [
                {
                    "name": "About Route Version Customer",
                    "url": "https://fastsmd.atlassian.net/wiki/external/ZjVhMjNlMDI0ZmRmNDNlYmFjMzhkZTNmZTQyOTE0NGQ"
                }
            ]
        }
    ]
}

This adds an "About Route Version Customer" link to the "?" menu whenever the user is on /route/routeversioncustomer/edit/... regardless of the parameter values.

Tips

• Use onChildPages: true on a parent entry instead of duplicating links into every child route.

• Relative URLs (api/help/index.html?urls.primaryName=V1.0CUSTOMER) open the embedded Swagger UI for that domain — handy for internal API references.

• The version popup URL is shared across all pages; per-release content lives on the wiki page at the #Release-{version} anchor.