Web-based user interface built on Vue.js for managing OpenBMC systems (mirror) https://git.radix-linux.su/BMC/OpenBmc/webui-vue.git/atom?h=master 2026-08-12T13:44:58+00:00 2026-08-12T13:44:58+00:00 Vijaysankar Ravi vijaysankarr@ami.com 2026-08-11T10:37:44+00:00 urn:sha1:4f2c725de80f3cd5a18cb7a153491f63c371453f Use findMessageId() to detect ResourceAlreadyExists in the redfish error response and show a specific toast instead of the generic add destination error. Tested: Adding a duplicate SNMP destination on AST2600 EVB shows the specific error toast instead of the generic one. Related: https://gerrit.openbmc.org/c/openbmc/phosphor-dbus-interfaces/+/90890 https://gerrit.openbmc.org/c/openbmc/phosphor-snmp/+/92218 https://gerrit.openbmc.org/c/openbmc/bmcweb/+/93102 Change-Id: I5a4fc6541c246085099aaad7d2515bb84805cb16 Signed-off-by: Vijaysankar Ravi <vijaysankarr@ami.com> 2026-06-25T06:39:00+00:00 Aravinth S aravinths@ami.com 2026-05-21T11:58:46+00:00 urn:sha1:f286d820e441325a86733fe7433be9d001a9a9d9 Non-admin users navigating to the Serial Over LAN page had no clear feedback — the page either failed silently or showed a generic error. Show the SOL button and nav item to all users and render an Access Denied alert when the session lacks the required privilege. A reusable AccessDeniedAlert global component is introduced so other restricted pages can adopt the same pattern with a single line. Change-Id: Ifbb93bb966c801b3a72230e8f3b752b62ef22929 Signed-off-by: Aravinth Sri Krishna Raja Raghavan <aravinths@ami.com> 2026-06-17T06:36:24+00:00 Aravinth S aravinths@ami.com 2026-04-22T21:01:38+00:00 urn:sha1:64ca1925df0af1524d070ab66593b24a97773f84 This change allows users to view detailed certificate information by clicking a chevron icon to expand each certificate row. This makes it easier for administrators to inspect certificates without leaving the page or using external tools. Why this enhancement is needed: System administrators need complete certificate details for security audits, compliance verification, and troubleshooting SSL/TLS issues. Previously, users had to export certificates or use external tools to view comprehensive information, which was inefficient. What's included in the expanded view: - Certificate metadata: version, serial number, signature algorithm - Complete issuer details: organization, common name, unit, location - Complete subject details: who the certificate is issued to - Full validity timestamps with timezone information Implementation details: - Expand button aria-label is row-specific (e.g. "Expand table row HTTPS Certificate") so screen readers identify each row uniquely - Two-column layout uses <b-col sm="6"> to stack on small screens, matching the Inventory page pattern - Section headings (Issuer Information, Subject Information) are conditionally rendered — hidden when all fields in the section are absent, avoiding empty bold headers - X.509 Version stored only when present in the API response; displayed as v1/v2/v3 (ASN.1 integer + 1) for human readability - formatSerialNumber only reformats strings that contain at least one A-F hex letter; pure decimal serials are returned as-is - CertificateString removed from Vuex state mapping entirely - Unit tests added: store mapping (issuer, subject, serialNumber, Version conversion, absent Version) and component tests (expandLabel per-row identity, formatSerialNumber all input cases) Tested with HTTPS, LDAP, and TrustStore certificate types. Change-Id: I735ad571c189d7ba84464bf4a9f1d2280175b128 Signed-off-by: Aravinth Sri Krishna Raja Raghavan <aravinths@ami.com> 2026-06-16T05:11:10+00:00 Aravinth S aravinths@ami.com 2026-06-10T17:09:43+00:00 urn:sha1:aa7b42222ddeaae797e754d1e9591b916e49dd0c When getEthernetData was called after any save action (e.g., adding an IPv4 address), it unconditionally reset selectedInterfaceId back to the first interface (eth0). This caused subsequent API patches to target eth0 even when the user had navigated to a different tab (e.g., eth1). Only set selectedInterfaceId to firstInterfaceId on initial load when it is empty, preserving the user's active tab selection across data refreshes. Testing: 1. Navigate to Settings > Network page 2. Verify eth0 is selected by default on initial load 3. Switch to eth1 tab 4. Add or modify an IPv4 address on eth1 5. Verify the change is saved to eth1 (not eth0) 6. Confirm eth1 tab remains selected after the save 7. Repeat steps 3-6 with other network interfaces if available 8. Test with different configuration changes (DHCP enable/disable, IPv6 settings) to ensure tab selection persists Fixes: https://github.com/openbmc/webui-vue/issues/125 Change-Id: Ic112e88173d4d3c5c1409a17bee4837673523991 Signed-off-by: Aravinth Sri Krishna Raja Raghavan <aravinths@ami.com> 2026-06-14T15:59:13+00:00 Nikhil Ashoka a.nikhil@ibm.com 2026-04-23T05:23:59+00:00 urn:sha1:e474f13a5e3c33746b3f7072608eca63b7d415d9 - Implemented Basic Auth setting in Policies page. - User able to Enable/Disable the policy setting from UI. - Added property presence check. - Tested: p11 BMC machine, Able to enable/disable Basic auth, Checked with and without redfish property to ensure UI doesn't break. Checked success and error cases. Change-Id: I08c0ccb275dbe068894de9cb35d6a286b4dc6e4f Signed-off-by: Nikhil Ashoka <a.nikhil@ibm.com> 2026-06-09T16:55:25+00:00 Nikhil Ashoka a.nikhil@ibm.com 2026-02-06T12:01:56+00:00 urn:sha1:99099183438d878391f66d3c674fa2cd037a7840 This change switches power control to the EnvironmentMetrics-based Redfish endpoint, derives minimum and maximum power cap values dynamically from Redfish data, and updates ControlMode and SetPoint handling to align with the latest schema. Key changes: 1. Power control API and Redfish types: - Removes src/api/services/powerControlService.ts; fetching and PATCH are handled in the composable using shared Redfish utilities - Adds EnvironmentMetrics and PowerLimitWatts types in src/api/types/redfish.ts with proper ControlMode enum ('Automatic' | 'Disabled' | 'Manual' | 'Override') - Chassis gains an EnvironmentMetrics link - Composable resolves the Chassis collection via useRedfishCollection<Chassis>('/redfish/v1/Chassis'), picks the first chassis with EnvironmentMetrics, and fetches that resource with useQuery; mutation sends PATCH and invalidates queries to refetch fresh server state (returns Promise<void>; view owns user-facing messages) 2. Power control composable (src/components/Composables/usePowerControl.ts): - Replaces Vuex PowerControlStore with a Composition API-based composable - Uses useRedfishRoot() and useRedfishCollection for cached ServiceRoot and Chassis; uses TanStack Query to load and cache EnvironmentMetrics power data - Configures staleTime (30s freshness window) and refetchInterval (30s automatic polling when tab visible) for live power consumption updates - Note: Only controls the first Chassis with EnvironmentMetrics in multi-chassis systems (intentional for current use case) - Forwards AbortSignal to API calls for proper request cancellation - Reuses shouldRetry function from useAllSubResources - Derives dynamic min and max power cap values from Redfish PowerLimitWatts.AllowableMin/Max - Provides a mutation for submitting updated SetPoint and ControlMode; omits SetPoint when disabling to avoid sending invalid values - Handles all ControlMode enum values (Automatic, Disabled, Manual, Override); UI sets Automatic/Disabled but preserves Manual/Override when read from server - Type-safe parameters (number | null instead of string coercion) 3. Toast composable and global plugin: - useToast.ts (renamed from .js) uses bootstrap-vue-next useToast() with TypeScript types; keeps successToast/errorToast API with i18n titles - Type restricted to string for simplicity; includes TODO for potential VNode support expansion if needed - src/plugins/toast.js continues to expose global $toast for Options API - BVToastMixin.js updated to use modelValue and extract VNode content for consistency with bootstrap-vue-next 0.40.8 - Both implementations use isStatus: true for consistent toast styling with status icons 4. Views modernization: - Refactors src/views/ResourceManagement/Power.vue to use <script setup>, usePowerControl(), and the new toast composable; submitForm uses try/catch and t('pageServerPowerOperations.toast.*') for success/error toasts - Implements value caching to preserve user's typed input when toggling power cap checkbox on/off - Guards form sync watcher with v$.value?.$dirty check to prevent overwriting in-progress edits during background refetch - Loader semantics: show on first load (isLoading) and mutations, but render cached data instantly on subsequent visits with silent background refetch (avoids flicker) - Renamed validator from 'between' to 'withinPowerCapRange' to avoid confusion with Vuelidate's built-in validator - Handles all ControlMode values (Automatic, Disabled, Manual, Override) in form state synchronization - Refactors src/views/Overview/OverviewPower.vue to read from the power control composable instead of Vuex; implements settled computed to emit overview-power-complete only when chassis collection is fetched AND either no EnvironmentMetrics exists or metrics query has completed (prevents premature completion) - Shows power cap for all active control modes (Automatic, Manual, Override) - Removes mapState/mapActions usage and related Vuex wiring 5. Store cleanup and typing: - Deletes src/store/modules/ResourceManagement/PowerControlStore.js - Removes PowerControlStore registration from src/store/index.js - Updates src/store/api.d.ts to match actual implementation (set_auth_token with snake_case, accepts string | null | undefined) - Adds src/i18n.d.ts to provide basic typing for the shared api Tested-by: Manual testing on development server - Power consumption and cap values load correctly from EnvironmentMetrics with automatic 30-second polling (refetchInterval) when tab is visible - Min and max power cap values reflect dynamic limits from Redfish - Updating the power cap and enable state sends correct SetPoint and ControlMode values; SetPoint is omitted when disabling - All ControlMode values (Automatic, Disabled, Manual, Override) are handled correctly - User's typed values are preserved when toggling power cap checkbox - Form edits are not overwritten by background refetch (dirty state guard) - Success/error toasts show localized messages with consistent modelValue-based timing and status icons - Overview power card reflects updated power state; overview loader waits for both chassis and metrics queries to settle before completing - Request cancellation works properly on component unmount Change-Id: Ic61631efd8790150a5e2914822f1dd25bd77305a Signed-off-by: Nikhil Ashoka <a.nikhil@ibm.com> 2026-06-02T09:33:37+00:00 Aravinth S aravinths@ami.com 2026-05-06T16:03:21+00:00 urn:sha1:95f0d613d5da226b190348bb36cf8ea911a2051c Enable users to switch between English, Russian, and Georgian languages directly from the application header, eliminating the need to log out and log back in to change language preferences. Prior to this enhancement, changing the interface language required users to: - Log out from their current session - Return to the login page - Select a different language - Log back in with credentials This workflow disruption made it impractical for operators to switch languages during their work sessions. The new language selector in the user dropdown allows users to: - Change language instantly from any page without logout - Switch between languages as needed during a single session - Maintain active sessions and current page context - Access all three supported languages (English, Russian, Georgian) The language preference persists across sessions via the Vuex store, so the selected language remains active after logout and login. This improvement is particularly valuable for: - Multilingual teams sharing the same BMC system - Operators who need to verify terminology in different languages - Training scenarios where instructors switch between languages - International deployments with diverse user bases Implementation includes: - Language dropdown in user menu (between Profile Settings and Log Out) - getAvailableLanguages() helper in i18n.js using Intl.DisplayNames to automatically generate language labels in "{English} - {Native}" format (e.g., "Russian - Русский", "US - English") - getRoutePageTitle() helper in i18n.js to eliminate duplicated route-to-title logic between App.vue and PageTitle.vue - Reactive translations via Vue i18n computed properties - Page title updates in both DOM (PageTitle component) and browser tab (App.vue document.title) - Component re-rendering triggered by routerKey increment - Centralized localStorage persistence in GlobalStore.js setLanguagePreference mutation - Translation keys added to en-US.json, ru-RU.json, and ka-GE.json (global.pageTitle.missing, appHeader.language) All interface text, navigation menus, and page titles update immediately when language is changed. Change-Id: Ie11523c5ff23fc1600aca2d8ee5adb542c5ce4b3 Signed-off-by: Aravinth Sri Krishna Raja Raghavan <aravinths@ami.com> 2026-05-19T05:59:53+00:00 Aravinth S aravinths@ami.com 2026-02-26T17:46:00+00:00 urn:sha1:12f127826f3ffaf2eba27e1f510974cf72ef399d Previously, when a user started virtual media redirection and navigated to another page, the image name was not shown upon returning. This update retains the image name on the Virtual Media page during Single Page Application (SPA) navigation. **Implementation:** - Active file and nbd objects are preserved in Vuex store state during SPA routing; the filename is displayed using the File.name property. - Proxy device objects are consistently shaped with file and nbd fields initialized to null in all construction paths. - Virtual media store is cleared on logout via a new clearDevices mutation, ensuring stale state is not retained across sessions. - When the BMC reports a device as Inserted but no browser-owned NBD connection exists (e.g. another UI session), the UI shows an informational label and a Stop button that ejects via Redfish EjectMedia instead of assuming a local NbdServer is present. **Limitations:** The image name is only retained during in-app navigation and is lost on: - Browser refresh (F5) - WebSocket connection cannot survive page reload - Duplicate tabs - each tab maintains independent state **Testing:** 1. Image name displays when starting virtual media redirection 2. Image name persists when navigating between pages 3. Image name clears when stopping redirection 4. Second tab with active redirection shows informational state; Stop ejects via Redfish and both tabs return to idle 5. Logout clears virtual media state; new session starts clean 6. Multiple proxy devices maintain independent state Change-Id: I5568025382a18adf89b18d3e81026c3112ae1e7e Signed-off-by: Aravinth Sri Krishna Raja Raghavan <aravinths@ami.com> 2026-05-12T10:03:40+00:00 Aravinth S aravinths@ami.com 2026-04-17T09:33:35+00:00 urn:sha1:76fe986e58261b8bb9a8fab277512d2a956e513b Exclude root user from bulk operations to prevent accidental deletion, enabling, or disabling of the critical root account. This addresses community security concerns where administrators could accidentally perform bulk operations on the root user, potentially locking themselves out of the system. - Disable root user's checkbox in the user table and show a reason tooltip - Exclude root from "select all" header checkbox selection - Add centralized root detection in userManagement store with env fallback (VITE_ROOT_USERNAME/ROOT_USERNAME, default: root) - Simplify delete action enable logic to !isSelf && !isRoot - Restore mixin-compatible onChangeHeaderCheckbox behavior (filteredItems, pagination window, post-select reconciliation) - Keep header potentially indeterminate after select-all by design when root is excluded - Do not clear bulk selection on single-user delete - Implement cross-browser tooltip behavior for disabled root checkbox (wrapper-based trigger with improved placement and readability) Testing: 1. Navigate to Security & Access > User Management 2. Verify root checkbox is disabled (grayed out) and shows tooltip 3. Click "Select All" - only non-root users are selected 4. Verify header can remain indeterminate when root exists 5. Perform single-user delete and verify existing bulk selection is preserved 6. Perform delete/enable/disable on test users and verify bulk operations work normally 7. Verify tooltip visibility/readability on Chrome, Edge, and Firefox Change-Id: Iffc9356ee6f5771bed381255173bbde08efd85e1 Signed-off-by: Aravinth Sri Krishna Raja Raghavan <aravinths@ami.com> 2026-02-13T09:54:27+00:00 Nishant Tiwari tiwari.nishant@ibm.com 2026-01-28T14:48:48+00:00 urn:sha1:d3b05033fe82aed6c53f4f2b52c23d3bd285d423 Introduce reusable Redfish API infrastructure and modernize the Sensors page to use Vue 3 Composition API with TanStack Query, eliminating the need for Vuex store patterns for server state management. This change provides a foundation for migrating other hardware status pages (Memory, Processors, Drives, etc.) to a more maintainable and performant architecture. Key changes: 1. Generic Redfish composables (src/api/composables/): - useRedfishRoot.ts: Caches ServiceRoot and detects OData support - useRedfishCollection.ts: Smart collection fetcher with OData $expand/$select support and graceful fallback - useAllSubResources.ts: Generic pattern for fetching nested resources from parent collections 2. Sensors page modernization: - Migrated from Vuex store to TanStack Query (Vue Query) - Created useSensors.ts composable for data fetching - Removed legacy Thermal and PowerSubsystem endpoints - Now uses only modern /Chassis/{id}/Sensors collection - Maintains existing UI/UX with Bootstrap Vue table 3. TypeScript support: - Added tsconfig.json and webpack ts-loader configuration - Created required Redfish type definitions - Preserves Redfish PascalCase property names 4. Performance optimizations: - Auto-detects and uses OData $expand for fewer API calls - Implements automatic caching and deduplication - Smart retry logic with exponential backoff - 30-second stale time with 5-minute garbage collection Benefits for future development: - The generic composables are designed for reuse across components: // Fetch all Memory from all Systems useAllSubResources<Memory>('/redfish/v1/Systems', 'Memory') // Fetch all Drives from all Storage useAllSubResources<Drive>('/redfish/v1/Storage', 'Drives') - Implemented TypeScript types - Reuses existing Bootstrap table components - Preserves existing UI/UX - Focuses on infrastructure reusability This pattern eliminates boilerplate Vuex store code and provides better developer experience with automatic loading states, error handling, and background refetching. Tested-by: Manual testing on development server - Sensors page loads correctly - OData optimization works when supported - Graceful fallback when OData unavailable - All table functionality preserved (sorting, filtering, export, cancel and searching) Change-Id: Id605319140f607b295d24085f3681f09ac0d5ebd Signed-off-by: Nishant Tiwari <tiwari.nishant@ibm.com>