feat(#5534): composite health and details

[SteKoe]

This pull request introduces a new sample for composite health contributors on the backend and refactors the frontend health panel for improved structure, styling, and accessibility. The main changes are grouped into backend additions for health contributors and frontend UI/UX improvements for health display.

Backend: Composite Health Contributor Sample

• Added new sample health indicators and a composite health contributor (ExternalApiHealthIndicator, MessageBrokerHealthIndicator, and ExternalServicesHealthContributor) to demonstrate grouping multiple health checks under a single /actuator/health/externalServices endpoint. These are registered via a new configuration class (HealthContributorConfig). [1] [2] [3] [4]

Frontend: Health Panel Refactor and Improvements

• Refactored the health panel in details-health.vue to introduce new layout and styling, including clear separation of component and group health checks, improved status color tokens, and a more accessible structure. [1] [2]
• Updated the health-details.vue component to support composite contributors, collapsible sections, and improved detail rendering with new CSS classes for better readability and maintainability. [1] [2]
• Improved computed properties and methods for handling health groups, component entries, and toggling group details, making the codebase more robust and maintainable. [1] [2] [3] [4] [5]
• Minor UI tweaks and bugfixes, such as updating class names for detail values and removing unused or redundant code. [1] [2]

These changes collectively provide a better developer and user experience for monitoring and displaying composite health checks in Spring Boot Admin.

[cdprete]

Nice @SteKoe.
Finally the Instance entry is gone and the status is on the accordion itself.

How does it look when a composite entry gets expanded?

[SteKoe]

Expanded entries look like this:

Completely collapsed health card like this, as already known:

[cdprete]

offline was rendered as gray previously and it's still gray in the other views (e.g.: wallboard, homepage), so I would move this together with the unknown one.

[cdprete]

Expanded entries look like this:

Completely collapsed health card like this, as already known:

Mmm while I understand the reasoning behind that internal indentation I would try to keep the status "bar" aligned with the rest and only indent from the indicator name.
Also, if possible (I can bet it's difficult :D), I would try to keep the status badges aligned.

Regarding Discovery client not initialized, is there no key in the JSON?
I'm just asking because I think that the details there can still be a Map<String, Object>, so I wonder how things would be rendered if there is more than one entry.

Edit: ignore the comment above about the nesting. externalServices shows how they will be already and they look fine.

[SteKoe]

I will dig into it further. This PR is just a first draft of a possible and better solution for displaying health information.

Mmm while I understand the reasoning behind that internal indentation I would try to keep the status "bar" aligned with the rest and only indent from the indicator name.

Yeah, I tried out both variants, too, and for now sticked to this approach. But UI is still in flux. I am not yet happy, either.

Also, if possible (I can bet it's difficult :D), I would try to keep the status badges aligned.

This already took some time, I will have to rethink how the UI may look like.

[cdprete]

Sounds good from my side.
Just make sure to revert or address #5540 (comment) please ;)
From my side, for example, I'm using OFFLINE as status for expected downtime windows, so having that red now would be quite confusing.