* feat: add component health dashboard sections
Add health summary and component health tables with severity filters and expandable check details.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Signed-off-by: Jack Yu <jack.yu@suse.com>
* feat: use health API group for component health resources
Update dashboard resource types to use the health.harvesterhci.io API group.
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Signed-off-by: Jack Yu <jack.yu@suse.com>
* feat: add component health ignore controls
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Signed-off-by: Jack Yu <jack.yu@suse.com>
* feat: gate component health behind the componentHealth feature flag
Only show the component health dashboard sections on Harvester v1.10.0 and later.
Signed-off-by: Jack Yu <jack.yu@suse.com>
* fix: address component health review comments
- sort the health summary table by a severity rank
- use buttons instead of anchors for restore and show more actions
- let the affected resources list expand so every resource can be restored
- widen the ignore popup and cap its height
Signed-off-by: Jack Yu <jack.yu@suse.com>
* refactor: split component health into dedicated components
Move the health summary, component health tabs and ignore popup out of
the dashboard page into components/health, and share the constants and
helpers through utils/component-health.
Signed-off-by: Jack Yu <jack.yu@suse.com>
* fix: sort component health by severity rank
Signed-off-by: Jack Yu <jack.yu@suse.com>
* fix: toggle health rows in place and tell empty filters from no checks
- toggle the expanded message and resource ids by mutating the unwrapped
arrays, the template does not pass refs
- show "No checks match the selected filters" when the severity filters
hide existing checks, keep "No issues detected" for a report without
checks
Signed-off-by: Jack Yu <jack.yu@suse.com>
* refactor: fetch component health resources in their own components
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Signed-off-by: Jack Yu <jack.yu@suse.com>
* feat: move health into a Components tab with the checks as sub-rows
The dashboard showed the summary table, then side tabs with a second
table for each component. It is now one table in a new Components tab
next to the Events tabs: one row per component, which opens to its
checks. Rows start closed, and the component name is a button so the
keyboard can open them. The tab only shows when the addon's resources
exist.
The table's own filter box replaces the severity dropdown. It only looks
at the table's own rows and the checks are in the sub-rows, so the rows
give it the text of their checks, a row only shows the checks it found,
and the rows it found open.
Ignoring a check moves from a popover, which cut off its Reason field
and Ignore button, to an RcModal that starts over each time it opens.
Signed-off-by: Marcelo Fukumoto <marcelo.fukumoto@suse.com>
* refactor: use RcButton for the component health buttons
The Ignore modal's button already was one. This moves the rest of them,
the row's Ignore, Restore, the "show more" links and the component name,
off the global btn classes.
Signed-off-by: Marcelo Fukumoto <marcelo.fukumoto@suse.com>
* refactor: manage one ignore rule per check from the row's actions
A check now has one rule, reached through the table's action menu: create
it when the check has none, view, edit or delete it when it has one. View
and edit use the same modal as create. This replaces the Ignore button and
the Restore links, which could only delete a whole rule and said the check
was restored when it wasn't.
The modal's section titles were the radio group's h3, as big as the modal's
own title. They follow what rancher/dashboard does in its forms now.
The actions follow what the user may do. The rules are only loaded with
their schema, and a list that fails no longer empties the table.
Signed-off-by: Marcelo Fukumoto <marcelo.fukumoto@suse.com>
* refactor: let the tables filter by themselves and show resources as chips
The filter had logic of its own on top of the table's. The nested table now
filters its rows the way the outer one does, with what is typed in the box.
Rows no longer open by themselves, which is how the other tables with
sub-rows behave. Expand All and Collapse All are there instead, copied from
what the table has from shell 3.0.15.
Affected resources are chips under the name the UI has for their type, with
the usual counter badge and the API version beside it. Ignored resources are
outlined instead of filled, and the text of an ignored check is muted. The
links use the shell's wording.
The component rows lose Last Updated. The summary only has one time, for its
counts as a whole, so it said nothing about the component in the row. They say
Error instead of Critical, as the checks inside them do. The Node column goes,
as nothing sets its label.
The Components tab shows the number of errors as a badge, as nothing else on
the page tells there are any.
Signed-off-by: Marcelo Fukumoto <marcelo.fukumoto@suse.com>
* fix: name the ignore rule after its check and make its expiry clear
- Name the rule the UI makes after its check, so Kubernetes refuses a
second one for the same check. The row's menu only manages that rule.
- Show the rule's current expiry above the durations, and the new one
under them once a duration is chosen. Edit starts with none chosen,
Save stays off until something changes, and a warning says when an
expired rule would stay expired.
- Delete the rule through the shell's delete prompt, like every other
delete.
- Say which list could not be loaded, instead of showing it as empty.
- Keep the full count of affected resources, say how many ignored ones
are left out of the list, and count them on Show ignored.
- Drop the checks' Last Updated, which is the time of their whole report.
- Leave out the row menu when no check has an action.
- Mark the Components tab with the shell's alert icon when there are
errors, with their number in its tooltip, instead of a badge.
Signed-off-by: Marcelo Fukumoto <marcelo.fukumoto@suse.com>
---------
Signed-off-by: Jack Yu <jack.yu@suse.com>
Signed-off-by: Marcelo Fukumoto <marcelo.fukumoto@suse.com>
Co-authored-by: Jack Yu <jack.yu@suse.com>
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
(cherry picked from commit 67ff2777d6)
harvester-ui-extension
The Harvester UI Extension is a Rancher extension that provides the user interface for Harvester within the Rancher Dashboard.
Note: This extension is available starting from Rancher 2.10.0. Ensure your Rancher version is 2.10.0 or later to access Harvester integration.
Table of Contents
- Installation
- Development Setup
- Commit Message Guidelines
- Branch Structure
- Testing Guidelines
- Release
- Contributing
- License
Installation
For Harvester UI extension installation instructions, please refer to the page Rancher Integration -> Harvester UI Extension in official Harvester documentation.
Development Setup
Ensure Node.js v24 or later is installed for development and debugging.
Standalone Mode
Run the extension standalone with hot reload at https://localhost:8005.
# Install dependencies
yarn install
# Start the development server
RANCHER_ENV=harvester API=https://your-harvester-ip yarn dev
# Example with specific server version
RANCHER_ENV=harvester VUE_APP_SERVER_VERSION=v1.5.0 API=https://192.168.1.123 yarn dev
You may also define environment variables in a .env file:
RANCHER_ENV=harvester
VUE_APP_SERVER_VERSION=v1.5.0
API=https://192.168.1.123
Rancher Integration Mode
To run as a Rancher extension, follow the Rancher UI Extension Guide.
API=https://your-rancher-ip yarn dev
Commit Message Guidelines
This project uses commit-lint with Conventional Commits to ensure consistent and meaningful commit messages.
Commit Message Format
All commit messages must follow the conventional commit format:
<type>[optional scope]: <description>
[optional body]
[optional footer(s)]
Supported Types
- feat: New features
- fix: Bug fixes
- docs: Documentation changes
- style: Code style changes (formatting, missing semicolons, etc.)
- refactor: Code refactoring
- perf: Performance improvements
- test: Adding or updating tests
- build: Build system or external dependencies
- ci: CI/CD changes
- chore: Other changes that don't modify src or test files
- revert: Reverts a previous commit
- wip: Work in progress
- deps: Dependency updates
- security: Security fixes
Examples
# Feature
git commit -m "feat: add new virtual machine creation wizard"
# Bug fix
git commit -m "fix: resolve memory leak in VM console"
# Documentation
git commit -m "docs: update installation instructions"
# Breaking change
git commit -m "feat!: change API endpoint structure
BREAKING CHANGE: The /api/v1/vms endpoint has been replaced with /api/v2/vms"
Git Hooks
The project uses Husky to automatically validate commit messages and run linting before commits:
- pre-commit: Runs ESLint to ensure code quality
- commit-msg: Validates commit message format using commit-lint
These hooks are automatically installed when you run yarn install.
Manual Validation
You can manually validate commit messages:
# Validate the last commit
yarn commitlint
# Validate a specific commit
npx commitlint --from <commit-hash>
# Validate a range of commits
npx commitlint --from <start-hash> --to <end-hash>
Branch Structure
main– Main development branchrelease-harvester-vX.Y– Stable release branches per version seriesvX.Y-head– Testing branches for ongoing changes to extension builds in each release series
Note: The
vX.Y-headbranches are auto-generated and kept in sync with release branches. Use these for testing the latest changes in each version series.
Testing Guidelines
UI Extension Testing
To validate changes in a release series, switch to the appropriate vX.Y-head branch. For main branch testing, use main-head.
- Examples:
- Test
1.0.xseries →v1.0-head - Test
1.5.xseries →v1.5-head
- Test
Steps:
- Navigate to Rancher UI → Local → App → Repositories
- Refresh the Harvester repository using the target
vX.Y-headbranch - Go to the Extensions page and install the desired version
Standalone Mode Testing
To test the standalone UI, configure Harvester to load the UI from an external source.
- Examples of
ui-index:- Main branch →
https://releases.rancher.com/harvester-ui/dashboard/latest/index.html - Release series
1.5.x→https://releases.rancher.com/harvester-ui/dashboard/release-harvester-v1.5/index.html
- Main branch →
Steps:
- Go to Harvester UI → Advanced → Settings → UI
- Set ui-source to
External - Set ui-index to the desired URL
Release
The Harvester UI Extension follows the Harvester release cycle. After RC1 is cut for a new Harvester version, we usually create and work from the corresponding release branch (for example, release-harvester-v1.8). The remaining RC builds and the final official release are published from that branch.
After Harvester releases a new version, update the Harvester entry in rancher/ui-plugin-charts manifest.json. This ensures air-gapped users can pull the new Harvester UI Extension image.
Contributing
If you want to contribute, start by reading this document, then visit our Getting Started guide to learn how to develop and submit changes.
License
Copyright (c) 2014-2026 SUSE, LLC.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.