[OpenNMS/opennms] 1b6b55: NMS-19976: Primevue migration: Menubar (#8630)

  Branch: refs/heads/release-36.x
  Home:   https://github.com/OpenNMS/opennms
  Commit: 1b6b557d545a0697cc87c8d69f1b41dfaecfae4a
      https://github.com/OpenNMS/opennms/commit/1b6b557d545a0697cc87c8d69f1b41dfaecfae4a
  Author: Scott Theleman <[email protected]>
  Date:   2026-07-15 (Wed, 15 Jul 2026)

  Changed paths:
    M core/web-assets/src/main/assets/style/opennms-theme.scss
    M core/web-assets/src/main/assets/style/vaadin-theme.scss
    M smoke-test/src/main/java/org/opennms/smoketest/selenium/AbstractOpenNMSSeleniumHelper.java
    M smoke-test/src/test/java/org/opennms/smoketest/MenuHeaderIT.java
    M smoke-test/src/test/java/org/opennms/smoketest/ProvisioningNewUIIT.java
    M smoke-test/src/test/java/org/opennms/smoketest/QuickAddNodeIT.java
    M smoke-test/src/test/java/org/opennms/smoketest/UIRefreshIT.java
    M smoke-test/src/test/java/org/opennms/smoketest/UserIT.java
    M ui/src/components/Menu/Menubar.vue
    M ui/src/components/Menu/Search.vue
    M ui/src/components/Menu/SearchResult.vue
    M ui/src/components/Menu/SideMenu.vue
    M ui/src/components/Menu/UserNotificationsMenuItem.vue
    M ui/src/components/Menu/UserSelfServiceMenuItem.vue
    M ui/src/components/Menu/utils.ts
    M ui/src/main/App.vue
    M ui/tests/components/Nodes/InterfacesTabs.test.ts
    M ui/tests/containers/SnmpDataCollection.test.ts
    M ui/tests/containers/TrapdConfiguration.test.ts

  Log Message:
  -----------
  NMS-19976: Primevue migration: Menubar (#8630)

* NMS-19976: Migrate top Menubar to PrimeVue (replace FeatherAppBar)

Replace FeatherAppBar/FeatherAppBarLink (used only as a fixed 3-column flex
bar) with a plain fixed <header>, the logo link with a plain anchor around the
existing product-logo SVG, and the Add-a-Node FeatherButton with a PrimeVue
Button. Search, the user dropdowns and the light/dark toggle are unchanged.
Introduces --onms-header-height so the side menu stays aligned.

* NMS-19976: Migrate SideMenu to PrimeVue TieredMenu rail (replace FeatherSidenav)

Replace FeatherSidenav/FeatherDock with a custom fixed rail hosting a PrimeVue
TieredMenu: icon-only when collapsed, expand on hover, pin via a toggle button
(persisted to the menu store), 2-level flyout submenus, and content pushed
aside via pushedSelector. The rail is pinned dark in both themes to match the
top bar. Feather icon components are kept and rendered via the TieredMenu #item
slot. Adds createPrimeMenuModel() in utils.ts to transform the raw menu data
into PrimeVue MenuItem[] (the Feather transform is left in place for now).

* NMS-19976: Migrate user-dropdown menus to PrimeVue Popover

Replace FeatherDropdown/FeatherDropdownItem/FeatherButton in
UserNotificationsMenuItem and UserSelfServiceMenuItem with a
primevue/popover (appendTo="self", pinned under the trigger) and
primevue/button. Driven by the existing `expanded` prop, so Menubar's
hover/mutual-exclusion coordination is unchanged. Feather icons retained
for Phase 6. Removes the last FeatherDropdown usages and the unresolved
FeatherButton component warning.

* NMS-19976: Offset legacy/SPA content below fixed Vue menus

The migrated top bar and side rail are position:fixed. Give each host a
collapsed/base left+top offset it owns (JSP #content = header+rail+gap,
Vaadin topology likewise via --onms-legacy-content-offset, SPA .app-layout
= 3rem), and add a top offset for the fixed header. SideMenu.applyPush now
only sets padding-left for the pinned-expanded rail (rail + 0.25rem gap)
and clears it otherwise, so it never clobbers the collapsed base/gap.

* NMS-19976: Make the side menu rail and flyouts scroll vertically

The TieredMenu item list scrolls when taller than the rail (overflow-y
on .p-tieredmenu + min-height:0). Because a scroll container clips the
side-opening flyouts on both axes, open first-level flyouts are promoted
to position:fixed (anchored to their item's rect) so they escape the
clip. Flyouts are also constrained to the rail's vertical band: a flyout
taller than the available height caps its max-height and scrolls
internally. Since fixed flyouts are detached from the rail, leaving the
rail (mouseleave) also closes the open flyout via TieredMenu.hide() so
it doesn't linger orphaned. Driven by a MutationObserver + scroll/resize
listeners, torn down on unmount.

* NMS-19976: Migrate Search UI off FeatherDS color vars

Search.vue/SearchResult.vue used no Feather interactive components (plain
<input> + custom dropdown), so convert their FeatherDS color vars to
PrimeVue tokens (content background/border, text/muted, highlight for
hover+keyboard-select). Remove dead :deep(.feather-input-*) overrides
left from a former FeatherInput and the now-unused @featherds/styles
mixin imports. FeatherIcon kept for the Phase 6 icon pass.

* !smoke lint fix

* NMS-19948: unmount tab-container test wrappers to fix flaky HTMLElement error

PrimeVue TabList schedules setTimeout(updateInkBar, 150) in mounted() and
never clears it in beforeUnmount(). When a test mounts a Tabs-rendering
component without unmounting, that orphaned timer outlives the test file and
fires against the torn-down happy-dom environment, throwing 'HTMLElement is
not defined' (flaky on CI, timing-dependent). Unmounting in afterEach clears
the component's template refs so updateInkBar hits its early-return guard
before touching any DOM helper.

Fixes the observed failure in SnmpDataCollection.test.ts and the same latent
flake in TrapdConfiguration.test.ts and InterfacesTabs.test.ts.

* NMS-19976: Smoke test fixes !smoke

* NMS-19976: fix and speed up PrimeVue side-menu navigation in smoke tests

Wait for the TieredMenu flyout to render after clicking a top-level item
instead of querying for the submenu link once immediately -- the immediate
query raced the async flyout render and failed on CI. Right after navigation
the top link is present but the Vue menu app is still settling, so the first
click is often a no-op; only click to open when the submenu isn't already open
(toggle-safe) and let the short-cap retry re-click once it is interactive.

Drop the implicit wait to 0 for the duration of these menu helpers so the
explicit waits aren't blocked for the full LOAD_TIMEOUT while the flyout is
absent. Apply the same treatment to clickSelfServiceItem and fix its
self-service selectors for the migrated UserSelfServiceMenuItem markup.

Reduces per-menu-item time from ~10s to ~1s.

* Fix more smoke tests !smoke

* Apply suggestions from code review

Co-authored-by: Copilot Autofix powered by AI <[email protected]>

---------

Co-authored-by: Copilot Autofix powered by AI <[email protected]>



To unsubscribe from these emails, change your notification settings at https://github.com/OpenNMS/opennms/settings/notifications


_______________________________________________
Please read the OpenNMS Mailing List FAQ:
http://www.opennms.org/wiki/index.php?page=MailingListFaq
opennms-cvs mailing list

To *unsubscribe* or change your subscription options, see the bottom of this page:
https://lists.sourceforge.net/lists/listinfo/opennms-cvs