only render header app if menu has items

src/Umbraco.Web.UI.Client/src/packages/help/header-app/help-header-app.element.ts

@@ -1,8 +1,9 @@
 import { UMB_HELP_MENU_ALIAS } from '../menu/index.js';
 import type { CSSResultGroup } from '@umbraco-cms/backoffice/external/lit';
-import { css, html, customElement, state } from '@umbraco-cms/backoffice/external/lit';
+import { css, html, customElement, state, nothing } from '@umbraco-cms/backoffice/external/lit';
 import { UmbHeaderAppButtonElement } from '@umbraco-cms/backoffice/components';
-import type { ManifestMenu } from '@umbraco-cms/backoffice/extension-registry';
+import { umbExtensionsRegistry, type ManifestMenu } from '@umbraco-cms/backoffice/extension-registry';
+import { UmbExtensionsManifestInitializer } from '@umbraco-cms/backoffice/extension-api';
 
 const elementName = 'umb-help-header-app';
 @customElement(elementName)
@@ -10,6 +11,24 @@ export class UmbHelpHeaderAppElement extends UmbHeaderAppButtonElement {
 	@state()
 	private _popoverOpen = false;
 
+	@state()
+	private _helpMenuHasMenuItems = false;
+
+	constructor() {
+		super();
+
+		new UmbExtensionsManifestInitializer(
+			this,
+			umbExtensionsRegistry,
+			'menuItem',
+			(manifest) => manifest.meta.menus.includes(UMB_HELP_MENU_ALIAS),
+			(menuItems) => {
+				const manifests = menuItems.map((menuItem) => menuItem.manifest);
+				this._helpMenuHasMenuItems = manifests.length > 0;
+			},
+		);
+	}
+
 	#onPopoverToggle(event: ToggleEvent) {
 		// TODO: This ignorer is just neede for JSON SCHEMA TO WORK, As its not updated with latest TS jet.
 		// eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -18,11 +37,21 @@ export class UmbHelpHeaderAppElement extends UmbHeaderAppButtonElement {
 	}
 
 	override render() {
+		return html` ${this.#renderButton()} ${this.#renderPopover()} `;
+	}
+
+	#renderButton() {
+		if (!this._helpMenuHasMenuItems) return nothing;
+
 		return html`
 			<uui-button popovertarget="help-menu-popover" look="primary" label="help" compact>
 				<uui-icon name="icon-help-alt"></uui-icon>
 			</uui-button>
+		`;
+	}
 
+	#renderPopover() {
+		return html`
 			<uui-popover-container id="help-menu-popover" @toggle=${this.#onPopoverToggle}>
 				<umb-popover-layout>
 					<uui-scroll-container>