Activities of "ldias"

Affected theme

LeptonX (Angular)

Description

When using Angular with useHash: true or a custom baseHref (e.g. /app/), the menu selection in LeptonX does not behave correctly:

• The active menu item is not marked as selected after navigation.
• In some cases, the previously selected item loses its active state when expanding another submenu without navigating.
• The issue does not occur when using default Angular routing (useHash: false and <base href="/">).

Expected behavior

• Menu items should be correctly marked as selected even when useHash or a custom baseHref is used.
• When navigating (via router or programmatically), the corresponding menu item should be highlighted.
• When opening a submenu without navigating, the previously selected item should not lose its selection.

Actual behavior

• With useHash: true, location.pathname always returns /, causing selected logic to fail.
• With <base href="/app/">, location.pathname returns /app, which also breaks comparisons.
• In LeptonX, the code uses location.pathname directly to determine the selected menu item, which does not account for useHash or baseHref.

Code reference

Inside the LeptonX Angular handling logic (routes.service.ts), there is a piece of code like:

this.router.events.pipe(
  filter(e => e instanceof NavigationEnd),
  map(() => location.pathname) //problematic
)

This does not work reliably with useHash or custom base paths.