Feature: Redirect to the last visited path when navigating between sections (#20084)
* redirect to the last visited path in a section * Update src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-sections.element.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * Update backoffice-header-sections.element.ts --------- Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
This commit is contained in:
@@ -16,6 +16,8 @@ export class UmbBackofficeHeaderSectionsElement extends UmbLitElement {
|
||||
|
||||
private _backofficeContext?: UmbBackofficeContext;
|
||||
|
||||
#sectionPathMap = new Map<string, string>();
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
|
||||
@@ -52,6 +54,42 @@ export class UmbBackofficeHeaderSectionsElement extends UmbLitElement {
|
||||
);
|
||||
}
|
||||
|
||||
#getSectionPath(manifest: ManifestSection | undefined) {
|
||||
return `section/${manifest?.meta.pathname}`;
|
||||
}
|
||||
|
||||
#onSectionClick(event: PointerEvent, manifest: ManifestSection | undefined) {
|
||||
// Let the browser handle the click if the Ctrl or Meta key is pressed
|
||||
if (event.ctrlKey || event.metaKey) {
|
||||
return;
|
||||
}
|
||||
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
|
||||
// Store the current path for the section so we can redirect to it next time the section is visited
|
||||
if (this._currentSectionAlias) {
|
||||
const currentPath = window.location.pathname;
|
||||
this.#sectionPathMap.set(this._currentSectionAlias, currentPath);
|
||||
}
|
||||
|
||||
if (!manifest) {
|
||||
throw new Error('Section manifest is missing');
|
||||
}
|
||||
|
||||
const clickedSectionAlias = manifest.alias;
|
||||
|
||||
// Check if we have a stored path for the clicked section
|
||||
if (this.#sectionPathMap.has(clickedSectionAlias)) {
|
||||
const storedPath = this.#sectionPathMap.get(clickedSectionAlias);
|
||||
history.pushState(null, '', storedPath);
|
||||
} else {
|
||||
// Nothing stored, so we navigate to the regular section path
|
||||
const sectionPath = this.#getSectionPath(manifest);
|
||||
history.pushState(null, '', sectionPath);
|
||||
}
|
||||
}
|
||||
|
||||
override render() {
|
||||
return html`
|
||||
<uui-tab-group id="tabs" data-mark="section-links">
|
||||
@@ -61,7 +99,8 @@ export class UmbBackofficeHeaderSectionsElement extends UmbLitElement {
|
||||
(section) => html`
|
||||
<uui-tab
|
||||
?active="${this._currentSectionAlias === section.alias}"
|
||||
href="${`section/${section.manifest?.meta.pathname}`}"
|
||||
@click=${(event: PointerEvent) => this.#onSectionClick(event, section.manifest)}
|
||||
href="${this.#getSectionPath(section.manifest)}"
|
||||
label="${ifDefined(
|
||||
section.manifest?.meta.label
|
||||
? this.localize.string(section.manifest?.meta.label)
|
||||
|
||||
Reference in New Issue
Block a user