diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-trees/sidebar-menu-item.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-trees/sidebar-menu-item.element.ts
index 43e27d4c5d..5537ea7ff6 100644
--- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-trees/sidebar-menu-item.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/section/section-trees/sidebar-menu-item.element.ts
@@ -1,7 +1,7 @@
+import { v4 as uuidv4 } from 'uuid';
import { css, html } from 'lit';
import { UUITextStyles } from '@umbraco-ui/uui-css/lib';
-import { customElement, property } from 'lit/decorators.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { customElement, property, state } from 'lit/decorators.js';
import { UmbLitElement } from '@umbraco-cms/element';
import type { ManifestTree } from '@umbraco-cms/models';
@@ -9,13 +9,35 @@ import type { ManifestTree } from '@umbraco-cms/models';
export class UmbSidebarMenuItem extends UmbLitElement {
static styles = [UUITextStyles, css``];
+ private _key = uuidv4();
+
+ _manifest?: ManifestTree;
@property({ type: Object, attribute: false })
- public manifest?: ManifestTree;
+ public get manifest(): ManifestTree | undefined {
+ return this._manifest;
+ }
+ public set manifest(value: ManifestTree | undefined) {
+ const oldVal = this._manifest;
+ this._manifest = value;
+ this.requestUpdate('manifest', oldVal);
+
+ if (value) {
+ this._treeItem = {
+ key: this._key,
+ name: value.meta.label ?? value.name,
+ icon: value.meta.icon,
+ type: value.meta.rootNodeEntityType,
+ hasChildren: false,
+ parentKey: null,
+ };
+ }
+ }
+
+ @state()
+ private _treeItem: Entity;
render() {
- return html`
-
- `;
+ return html``;
}
}