set tree-item to active if its path exists in the url

This commit is contained in:
Mads Rasmussen
2024-03-20 12:55:31 +01:00
parent b1160e6e2d
commit 5dc34454a9

View File

@@ -13,7 +13,7 @@ import { UmbContextBase } from '@umbraco-cms/backoffice/class-api';
import { UmbContextToken } from '@umbraco-cms/backoffice/context-api';
import { UMB_ACTION_EVENT_CONTEXT, type UmbActionEventContext } from '@umbraco-cms/backoffice/action';
import type { UmbEntityActionEvent } from '@umbraco-cms/backoffice/entity-action';
import { UmbPaginationManager } from '@umbraco-cms/backoffice/utils';
import { UmbPaginationManager, debounce } from '@umbraco-cms/backoffice/utils';
import { UmbChangeEvent, UmbRequestReloadStructureForEntityEvent } from '@umbraco-cms/backoffice/event';
export type UmbTreeItemUniqueFunction<TreeItemType extends UmbTreeItemModelBase> = (
@@ -101,6 +101,8 @@ export abstract class UmbTreeItemContextBase<TreeItemType extends UmbTreeItemMod
this.loadChildren();
}
});
window.addEventListener('navigationend', this.#debouncedCheckIsActive);
}
/**
@@ -277,6 +279,7 @@ export abstract class UmbTreeItemContextBase<TreeItemType extends UmbTreeItemMod
if (!pathname || !this.entityType || this.unique === undefined) return;
const path = this.constructPath(pathname, this.entityType, this.unique);
this.#path.setValue(path);
this.#checkIsActive();
},
'observeSectionPath',
);
@@ -349,6 +352,15 @@ export abstract class UmbTreeItemContextBase<TreeItemType extends UmbTreeItemMod
this.loadChildren();
};
#debouncedCheckIsActive = debounce(() => this.#checkIsActive(), 100);
#checkIsActive() {
const path = this.#path.getValue();
const location = window.location.pathname;
const isActive = location.includes(path);
this.#isActive.setValue(isActive);
}
// TODO: use router context
constructPath(pathname: string, entityType: string, unique: string | null) {
return `section/${pathname}/workspace/${entityType}/edit/${unique}`;
@@ -359,6 +371,7 @@ export abstract class UmbTreeItemContextBase<TreeItemType extends UmbTreeItemMod
UmbReloadTreeItemChildrenRequestEntityActionEvent.TYPE,
this.#onReloadRequest as EventListener,
);
window.removeEventListener('navigationend', this.#debouncedCheckIsActive);
super.destroy();
}
}