Fix Unit tests and useI18n() misuse

Vue 3's vue-i18n requires useI18n() to be called within setup()
or reactive contexts. Calling it in Options API data() creates
disconnected i18n instances that ca

Fix Unit tests and useI18n() misuse

Vue 3's vue-i18n requires useI18n() to be called within setup()
or reactive contexts. Calling it in Options API data() creates
disconnected i18n instances that cannot resolve linked messages.

Component fixes:
- Enable globalInjection in i18n.js for automatic $t injection
- Remove explicit useI18n() imports from 84 components that
incorrectly called useI18n().t in their data() functions

Unit test fixes:
- Mock @/i18n module in jest.setup.js because Webpack's
require.context() does not work in Jest, leaving the real
module with no locale messages loaded
- Re-export real createI18nInstance so i18n unit tests work
- Update snapshots to reflect real translated text instead
of raw translation keys
- Fix b-form-radio/checkbox stubs to wrap content in div for
proper data-test-id attribute inheritance
- Remove duplicate i18n plugin installations from individual
test files that caused 'already registered' warnings
- Suppress expected missing-key warning in vendor overlay test

Tested:
- Sanity testing on webui, ensured translations work.
- All Unit tests pass (19/19) with no Errors or Warnings.

Change-Id: I9789acd823261eccc7affde0957dd22e8fec06b1
Signed-off-by: Jason Westover <jwestover@nvidia.com>

show more ...

Fix Vue 3 @change event bindings for forms

In Bootstrap-Vue-Next (Vue 3), the @change event on BFormCheckbox
and BFormRadio passes an Event object instead of the boolean value.
This caused malformed

Fix Vue 3 @change event bindings for forms

In Bootstrap-Vue-Next (Vue 3), the @change event on BFormCheckbox
and BFormRadio passes an Event object instead of the boolean value.
This caused malformed API payloads like:

{"LocationIndicatorActive":
{"isTrusted": true, "_vts": 1765562875420}}

instead of:

{"LocationIndicatorActive": true}

Replace @change with @update:model-value which correctly passes the
new value in Vue 3/Bootstrap-Vue-Next.

Components fixed:
- OverviewInventory.vue: LED toggle
- InventoryServiceIndicator.vue: LED toggle
- InventoryTableSystem.vue: LED toggle
- NetworkGlobalSettings.vue: 6 network switches
- Policies.vue: 4 policy switches (SSH, IPMI, vTPM, RTAD)
- TableIpv4.vue: DHCP switch
- TableIpv6.vue: DHCPv6 switch
- Ldap.vue: LDAP auth and service type controls

Also adds safety net in api.js:
- Request interceptor to strip Vue reactivity from payloads
- Detects and warns about Event objects in API payloads
- Improved response error handling with null safety
- Conditional debug logging (development mode only)

Change-Id: I180d9143087284e28c5066a6ffc141cd7f7038c6
Signed-off-by: jason westover <jwestover@nvidia.com>

show more ...

Migrate to Bootstrap 5 and remove Vue compat plugin

Complete migration from Bootstrap 4 (bootstrap-vue) to Bootstrap 5
(bootstrap-vue-next) and remove the @vue/compat plugin to finalize
the Vue 3 mi

Migrate to Bootstrap 5 and remove Vue compat plugin

Complete migration from Bootstrap 4 (bootstrap-vue) to Bootstrap 5
(bootstrap-vue-next) and remove the @vue/compat plugin to finalize
the Vue 3 migration.

Bundle size impact:
- Before (Bootstrap 4 + bootstrap-vue): 535 KiB gzipped
- After (Bootstrap 5 + bootstrap-vue-next): 511 KiB gzipped
- Reduction: 24 KiB (4.5% smaller)

Package updates:
- Update bootstrap 4.6.2 -> 5.3.8
- Update bootstrap-vue 2.23.1 -> bootstrap-vue-next 0.40.8
- Remove @vue/compat plugin
- Update vue 3.4.29 -> 3.5.24 and related packages
- Add mitt 3.0.1 for global event bus
- Add vue-demi 0.14.10 for library compatibility

Bootstrap 5 CSS updates:
- Replace directional classes: ml/mr/pl/pr -> ms/me/ps/pe
- Replace text-left/right -> text-start/end
- Replace sr-only -> visually-hidden / visually-hidden-focusable
- Update media breakpoint xs -> sm (Bootstrap 5 removed xs)
- Update color functions: gray("700") -> $gray-700
- Add form-switch border-radius for curved toggles
- Update alert, table, toast, form, and button styles

Bootstrap-Vue-Next API changes:
- Use createBootstrap() for plugin registration
- Update modal footer slots: #modal-footer -> #footer
- Fix form select events: @change -> @update:model-value
- Add v-model bindings to modals instead of manual show()/hide()
- Update toast system with custom plugin wrapping useToast()
- Register components and directives explicitly

Vue 3 specific updates:
- Replace $root.$emit with mitt event bus (eventBus.js)
- Update render function from h(App) to createApp(App)
- Add emits option to components
- Use h() instead of $createElement in mixins
- Add Vue 3 compile-time feature flags with documentation
- Update event listeners: $on/$off to eventBus methods
- Add beforeUnmount cleanup for event listeners

New components and significant additions:
- src/plugins/toast.js - Custom toast plugin wrapping useToast() for
Options API compatibility
- src/components/Global/ConfirmModal.vue - Global confirmation dialog
shim to replace Bootstrap 4's removed bvModal.msgBoxConfirm
- src/eventBus.js - mitt-based event bus with Vue 2-compatible API
- Navigation state preservation on page refresh implemented

Critical fixes:
- Add global API interceptor to strip Vue reactivity from payloads
- Preserve binary data (File, Blob, FormData) in API requests
- Fix Generate CSR modal v-model binding for proper open/close
- Remove debug logging and fix jest configuration
- Fix responsive text visibility in AppHeader
- Update BVTableSelectableMixin for proper row selection
- Fix BVToastMixin VNode rendering for Vue 3

Vue 3 modal fixes (lazy-loaded components):
- Add v-model support to network modals (ModalIpv4, ModalIpv6, ModalDns,
ModalHostname, ModalMacAddress, ModalDefaultGateway) by adding
modelValue prop, watcher on modelValue that triggers show(), and
update:modelValue emit in resetForm
- Remove lazy loading from TableIpv4, TableIpv6, TableDns to ensure
modal component refs are available when v-model triggers
- Fix modal title accessibility by adding title prop to modals
(ModalAddDestination, ModalUser, ModalAddRoleGroup, etc.)

i18n fixes (computed properties):
- Fix computed properties using i18n translations in ModalAddRoleGroup,
ModalUser, and ModalUploadCertificate
- Move useI18n() call from data() to setup() and return i18n object
- Use i18n.t() instead of $t in computed properties and templates
- Prevents "this.$t is not a function" and "_ctx.$t is not a function"
errors in Vue 3

Toast notification fixes:
- Fix toast progress bar visibility by setting progressProps to
undefined (documented way to opt-out) instead of false
- Change modelValue prop to interval for auto-dismiss timing
- Remove temporary CSS display:none hack from _toasts.scss

Network settings fixes:
- Fix checkbox @change event sending Vue reactive proxy object instead
of boolean by casting with !! operator in changeDomainNameState and
related methods in NetworkGlobalSettings.vue
- Ensures API receives plain boolean values in PATCH requests

Navigation fixes:
- Fix nav-link styling for navigation items without children by
replacing b-nav-item with router-link in AppNavigation.vue
- Prevents blue font color from .nav-link CSS class

Configuration updates:
- Remove vue-compat webpack configuration
- Add Vue 3 feature flags (__VUE_OPTIONS_API__, etc.)
- Add .cursor to .gitignore

Accessibility improvements:
- Add autocomplete attributes to password and credential inputs
- Add modal title props for screen reader support

Build completes successfully and UI behavior matches pre-migration.

Extracted features (to be submitted in follow-up PRs):
The following features were removed from this migration PR to keep it
focused on the Bootstrap 5 upgrade. They will be submitted separately:
1. UnresponsiveModal - Server connectivity watchdog with auto-retry
2. Auth token persistence - sessionStorage support for X-Auth-Token
3. Hardware store error handling - try/catch, dynamic discovery
4. Login page connecting indicator - Backend polling with spinner
5. Test updates - Jest setup and snapshot updates for
Bootstrap-Vue-Next
6. Documentation updates - Vue 3 and Vue I18n v9+ API documentation
7. Enhanced ConfirmModal - Feature-rich confirmation dialog with
custom actions

Change-Id: Ib76a58f324b3c926cf536e6e4626e4271639de38
Signed-off-by: Jason Westover <jwestover@nvidia.com>

show more ...

fix: Update date formatting to use formatTime

Show the Time and Timezone in the overview page instead of showing date
twice. Format the date using the formatTime filters to display the
proper date a

fix: Update date formatting to use formatTime

Show the Time and Timezone in the overview page instead of showing date
twice. Format the date using the formatTime filters to display the
proper date and time in the overview page.

Before it shows date twice, In the place of time it shows date.

Change-Id: Ibd8211530750091c03f788106bfb78097be2b2d8
Signed-off-by: Surya Venkatesan <suryav@ami.com>

show more ...

style: add Sass configuration for Vue 3

Configure sass in the vue.config.js file and remove the
import of the scss file from each page. The styles are
handled by the css loaderOptions in the config

style: add Sass configuration for Vue 3

Configure sass in the vue.config.js file and remove the
import of the scss file from each page. The styles are
handled by the css loaderOptions in the config file.
Every component and page has the appropriate style applied.
The appearance adjusts to the openBmc webui in Vue 2.

Change-Id: I3773c063646185b80b7bd61d05aa80a993cbd121
Signed-off-by: Surya Venkatesan <suryav@ami.com>

show more ...

Vuelidate, I18n, and filter are upgraded to vue3

While navigating to the pages i18n, vuelidate, and filters errors
occurred. i18n, and vuelidate code changes in each page adapted to
vue3. Filter glo

Vuelidate, I18n, and filter are upgraded to vue3

While navigating to the pages i18n, vuelidate, and filters errors
occurred. i18n, and vuelidate code changes in each page adapted to
vue3. Filter global function for date and time format implemented
in the main.js file and those files which as called the filter
functions.

Change-Id: If1a2ee22d47750faef1c35ef2c263299067d9a20
Signed-off-by: Surya Venkatesan <suryav@ami.com>

show more ...

i18n, vue-router and vuex upgrade

1. Configuration of i18n legacy as false.
2. Translation function t is called using the useI18n.
3. Used the i18n.global.t() function from i18n instead of this.$t()

i18n, vue-router and vuex upgrade

1. Configuration of i18n legacy as false.
2. Translation function t is called using the useI18n.
3. Used the i18n.global.t() function from i18n instead of this.$t()
4. Event bus error that occurred during logout.
5. Implemented vue-router 4.4.0 and vuex upgrade to 4.1.0

Change-Id: I9464d82c76dcc1445ce271983ea3ab9d7b03d265
Signed-off-by: Surya Venkatesan <suryav@ami.com>

show more ...

Upgrade vue3 and all dependencies

Start the process of porting everything to Vue 3. I have most things
working. npm run-scripts build works, npm install works. prettier
passes. Styles load, logi

Upgrade vue3 and all dependencies

Start the process of porting everything to Vue 3. I have most things
working. npm run-scripts build works, npm install works. prettier
passes. Styles load, login works, webui loads.

This was primarily done using the linked documents below. It makes the
following design decisions:
1. Vue is put in compat 2 mode, which allows most of the components to
work as-is.
2. Bootstrap v4 is used along with bootstrap-vue to keep our components
working.
3. Minor changes are made to load the latest versions of vue-router,
vuex, and vue-i18n.

I suspect this patchset is good enough to start with, and we can clean
up the broken things one patchset at a time. The things that need to
happen are:

1. Get remaining features working again. This primiarily is vue-i18n
for mixins, and non vue components. This likely needs to be done by
not pulling in i18n into the non vue components, then using the .Vue
files to do the internationalization in the component context, NOT in
the mixin context. Alternatively, we could drop MixIns alltogether.
2. Get custom styles working again. Previously, we used some path
hackery in vue.config.js to optionally pre-load styles. This stops
working now that we're required to @import our modules. Likely we
need some rearangement of the paths such that custom styles are a
complete replacement (possibly importing the original) rather than
additive with overrides. That's a guess, but I don't really see
anyone else doing customization the way we've defined it here.
3. Bootstrap 5 no longer requires ANY custom vue modules, as it has
dropped the jquery dependency. We won't be able to pull in bootstrap
5 all at once, so pull in bootstrap 5 under an alias, like
"bootstrap5" that we can optionally import 5 or 4.
4. One at a time, start porting components over to Vue3 syntax and
bootstrap 5. This will be the bulk of the manual work and review.

The only thing I think left is getting unit tests passing, which I
commented out the pre-commit hook to make this PR.

Tested: Code builds. Needs better testing.

[1] https://router.vuejs.org/guide/migration/
[2] https://vue-i18n.intlify.dev/guide/migration/vue3
[3] https://vuelidate-next.netlify.app/migration_guide.html#package-name-and-imports

Change-Id: I5bb3187b9efbf2e4ff63e57994bc528756e2a981
Signed-off-by: Ed Tanous <ed@tanous.net>

show more ...

Updated Dumps card in overview page

- The Dumps count in the overview page is not displaying the count of
all
the entries. Updated to display count of all entries.
- The registration of Dumps stor

Updated Dumps card in overview page

- The Dumps count in the overview page is not displaying the count of
all
the entries. Updated to display count of all entries.
- The registration of Dumps store is in multiple locations,
store -> index.js and env -> store -> ibm.js.
Causing error in IBM machines because of duplicate
 registration.
Removed from env folder.

Change-Id: Idc57a85db090d1b1d3211c01e658b181a7fc1177
Signed-off-by: Nikhil Ashoka <a.nikhil@ibm.com>

show more ...

Added toast notification for identify LEDs

- Added success toast notification messages for identify
LEDs present at Inventory and LEDs page and Overview.

- Import of Toast was not present in Over

Added toast notification for identify LEDs

- Added success toast notification messages for identify
LEDs present at Inventory and LEDs page and Overview.

- Import of Toast was not present in Overview's Inventory
card and DIMM slot table, fixed it.

Signed-off-by: Nikhil Ashoka <a.nikhil@ibm.com>
Change-Id: If9ad84e66f6f15616cb8af51b1e84d8d06b1afd0

show more ...

Reformat files with new linter

All changes should be whitespace, and were done using npm run-script
lint.

Change-Id: I943c6b435c5c872841af5affc1e89910468b5ca6
Signed-off-by: Ed Tanous <ed@tanous.ne

Reformat files with new linter

All changes should be whitespace, and were done using npm run-script
lint.

Change-Id: I943c6b435c5c872841af5affc1e89910468b5ca6
Signed-off-by: Ed Tanous <ed@tanous.net>

show more ...

Don't count solved problems in Overview

At the moment, the Overview page shows the total number of log errors
and warnings, even if they are marked as "resolved". After the patch,
only unresolved er

Don't count solved problems in Overview

At the moment, the Overview page shows the total number of log errors
and warnings, even if they are marked as "resolved". After the patch,
only unresolved errors and warnings are counted.
Test:
Created an error event and a warning event in the log.
The Overview page displays 1 and 1.
Marked them as resolved.
The Overview page displays 0 and 0.

Change-Id: I8ee1122bbec3e678d33edfbd2035d02553fb64ea
Signed-off-by: Glukhov Mikhail <mikl@greenfil.ru>

show more ...

Fix bug in Overview endless loading

Bug description:
Before this commit there was an endless loading
on blue bar when user entering to the Overview.
Problem was missing `if` statement

Fix bug in Overview endless loading

Bug description:
Before this commit there was an endless loading
on blue bar when user entering to the Overview.
Problem was missing `if` statement
after what that promise wasn't be able to finish.

Test:
Step1. Launch webui on browser and see Overview page.
Step2. Wait a while. Blue loading bar finished pulsing.

Change-Id: I2ea3b6f125ca24fcefeea8020c4a903ea018f4f7
Signed-off-by: Konstantin Maskov <sulwirld@gmail.com>

show more ...

Server manufacturer and Firmware version on Overview tab

Add "Server manufacturer" and "Firmware version" to "Server
information" card in Overview tab.

Signed-off-by: MichalX Szopinski <michalx.szo

Server manufacturer and Firmware version on Overview tab

Add "Server manufacturer" and "Firmware version" to "Server
information" card in Overview tab.

Signed-off-by: MichalX Szopinski <michalx.szopinski@intel.com>
Change-Id: If02516b1b721920f83c5fe42a7c5e79fbb1825ca

show more ...

Fixed vuex dumps errors

Refactored getters and dispatch names were not matching
the getters and actions strings, which made dumps not work.

Made the getters and dispatch names match the vuex getter

Fixed vuex dumps errors

Refactored getters and dispatch names were not matching
the getters and actions strings, which made dumps not work.

Made the getters and dispatch names match the vuex getters
and actions strings to the refactored codebase.

Signed-off-by: Kenneth Fullbright <kennyneedsmilky@gmail.com>
Change-Id: I414a7f85ef70c270785b825b3b14f9dfb27a33a7

show more ...

Fix DHCPv4 display

Currently UI DHCPv4 element shows list of DHCP address dictionaries.
Instead of showing the whole object as it is, display only the address
of the first element in the list.

Sign

Fix DHCPv4 display

Currently UI DHCPv4 element shows list of DHCP address dictionaries.
Instead of showing the whole object as it is, display only the address
of the first element in the list.

Signed-off-by: Konstantin Aladyshev <aladyshev22@gmail.com>
Change-Id: Ifc1d8a2400f5eafba435355c3884c35392f73d74

show more ...

Fix overview error

Console errors were related to the power and network card components from
https://gerrit.openbmc-project.xyz/c/openbmc/webui-vue/+/46511

Signed-off-by: Dixsie Wolmers <dixsie@ibm

Fix overview error

Console errors were related to the power and network card components from
https://gerrit.openbmc-project.xyz/c/openbmc/webui-vue/+/46511

Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: Ib967229b74462ed8d5c28cbac24c2a2fbfc834c2

show more ...

Rename TableDataFormatter mixin to DataFormatter

Mixin was renamed to reflect usage on all components,
not only tables.

Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: Ic962ba879fffa39b9f

Rename TableDataFormatter mixin to DataFormatter

Mixin was renamed to reflect usage on all components,
not only tables.

Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: Ic962ba879fffa39b9f6f93446771fbf6f67915d0

show more ...

Update overview layout

Layout updates uses bootstrap vue cards to display
general information. View more links and download
or export ability has been added to the overview page.

Network settings d

Update overview layout

Layout updates uses bootstrap vue cards to display
general information. View more links and download
or export ability has been added to the overview page.

Network settings displays the hostname and the first IP
address for the first ethernet interface. Link status
was also added.

TODO: Add idle power and power mode properties in seperate
commit for each story.

Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: Iaf0720d76b2a9416f068a1e779ede59bffda9727

show more ...

IA update: Update configuration to settings

This is the fourth update to information architecture changes and has
the following changes:

- The configuration section is updated to settings
- The dat

IA update: Update configuration to settings

This is the fourth update to information architecture changes and has
the following changes:

- The configuration section is updated to settings
- The date and time settings page is updated to date and time
- The network settings page is updated to network
- The power restore policy page in operations section is moved to
settings section

Signed-off-by: Sandeepa Singh <sandeepa.singh@ibm.com>
Change-Id: I6f5ab25f5227530be430bd39a4d9629b3bf09d8b

show more ...

IA update: Update control section to operations

This is the third update to the information architecture changes and
has the following changes:

- The control section has been updated to operations

IA update: Update control section to operations

This is the third update to the information architecture changes and
has the following changes:

- The control section has been updated to operations
- The server led page has been removed
- The firmware page is moved to operations section

Signed-off-by: Sandeepa Singh <sandeepa.singh@ibm.com>
Change-Id: I2e23da447890d7bee51892e1f782d5f2db6dded4

show more ...

IA update: Add logs and update overview icon

This is the first patchset of the information architecture changes.
These changes are the result of several months of design research with
users to impro

IA update: Add logs and update overview icon

This is the first patchset of the information architecture changes.
These changes are the result of several months of design research with
users to improve the existing information architecture (IA). More
information can we found in the Github story.

This patchset will add a Logs section and move event logs and dumps from
the Health section to the new Logs section. It will also update the icon
used for the Overview page.

Github story: https://github.com/openbmc/webui-vue/issues/56

Testing:
1. IBM build:
- Logs contained Event logs and dumps
- Both pages rendered when clicking link
2. Intel build
- Logs contained Event logs only
- Logs page rendered when clicking link
3. Tested default build
- Logs contained Event logs only
- Logs page rendered when clicking link

Signed-off-by: Derick Montague <derick.montague@ibm.com>
Change-Id: I4621837202cf5ad3469d6ea460d9a5bdc79c8816

show more ...

Update the default firmware page

- Minor updates made to the general layout and styles
- Changes to some page copy
- Moves update firmware form to bottom of page
- Adds dynamic TFTP upload optio

Update the default firmware page

- Minor updates made to the general layout and styles
- Changes to some page copy
- Moves update firmware form to bottom of page
- Adds dynamic TFTP upload option
- Adds dynamic card layout for BMC and host firmwre
- 2 cards for combined
- 4 cards for separate
- Removes FirmwareSingleImage components that were used for IBM builds

Signed-off-by: Yoshie Muranaka <yoshiemuranaka@gmail.com>
Change-Id: Ib5465ecc30dd1505824bf41c82d33b7655d5e598

show more ...

Add test hook for overview page

Signed-off-by: Sandeepa Singh <sandeepa.singh@ibm.com>
Change-Id: I76f8abe6e28714a9c5e8af85e6f4d854146db7b2

Removed truncated style from overview page

- Removed truncated style from network information section.

Signed-off-by: Suren Neware <sneware9@in.ibm.com>
Change-Id: I11339a1c6099a733b07979dd26b13a0b

Removed truncated style from overview page

- Removed truncated style from network information section.

Signed-off-by: Suren Neware <sneware9@in.ibm.com>
Change-Id: I11339a1c6099a733b07979dd26b13a0b400de19a

show more ...