ALEC-307: Migrate the ALEC UI to Onms Vue components - #175
Open
joseanesONMS wants to merge 3 commits into
Open
Conversation
…e bootstrap The OpenNMS 37 UI standardized on @opennms/onms-ui (Onms-* wrappers around PrimeVue, NMS-20029). The package is private/workspace-only, so ALEC vendors it (pinned to opennms develop @ 5ebe7e2c828) behind an '@opennms/onms-ui' alias that makes the published package a drop-in swap later. Also vendored: the OpenNMS PrimeVue preset, the --onms-* token theme, severity classes, 25 host icons, FormField and HelpBadge. theme/primevue-host.ts makes bundled PrimeVue work without app.use() (the host app renders ALEC's root, so we never own the app): on a PrimeVue host it bridges the host's live config to our bundled injection Symbols so theme and dark mode stay host-managed; on a Feather host it installs our own config with the vendored preset into the host app's globalProperties. Toolchain aligned with the host for the modern SFC syntax the vendored components use: TS 5.5, vue-tsc 3.3, Vue 3.5 / vue-router 4.6 types (runtime still resolves to the host's globals). npm's package-lock.json replaces the stale yarn.lock. ESLint now errors on primevue/* and @featherds/* imports outside the seam, mirroring the host rule. https://opennms.atlassian.net/browse/ALEC-307
All 30 Feather-using components/containers now use the vendored Onms-* wrappers: buttons/icon-buttons, chips, radios, checkboxes, selects, inputs, textareas, tabs, drawers, spinners, toasts (useOnmsToast via the single OnmsToastHost in MainContainer), FormField-wrapped labelled fields, and the shared severity classes for every severity affordance. FeatherDS is fully removed: the 28 @featherds packages, the ALEC-306 feather-styles bootstrap and vendored feather themes, theme-dev.ts, and variables.scss are gone; styling rides on --onms-* tokens (which resolve through PrimeVue --p-* tokens supplied by the bundled preset on any host). vue-tsc, eslint (0 errors), and all 86 unit tests pass; regenerated bundles included. https://opennms.atlassian.net/browse/ALEC-307
White-on-green failed contrast in dark mode; both Add Alarms buttons now render as standard filled primary OnmsButtons like every other action. https://opennms.atlassian.net/browse/ALEC-307
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Jira: https://opennms.atlassian.net/browse/ALEC-307
Rewrites the ALEC plugin UI from FeatherDS to the OpenNMS Onms-* component stack so it renders natively on the OpenNMS 37 Vue UI and stays self-contained on Feather-based hosts (Meridian, OpenNMS ≤36).
@opennms/onms-uiis private/workspace-only today, so the 35 wrappers are vendored (pinned to opennms develop5ebe7e2c828) behind an@opennms/onms-uialias the published package can later replace as a drop-in.ui/src/theme/primevue-host.tsbridges bundled PrimeVue to whichever host mounts the plugin: on a PrimeVue host the live host config drives theme and dark mode; on a Feather host the vendored OpenNMS preset self-installs (the host app renders ALEC's root, soapp.use()is never available to a plugin).useOnmsToast, and the shared severity classes — and FeatherDS is fully removed (28 packages, the ALEC-306 CSS stopgap,variables.scss).primevue/*and@featherds/*imports outside the seam, mirroring the host rule; the UI toolchain is aligned with the host (TS 5.5, vue-tsc 3.3, Vue 3.5 types — runtime still resolves to the host globals).