fix(web): displays "Unknown" for missing hardware values#3294
Merged
fix(web): displays "Unknown" for missing hardware values#3294
Conversation
Use `isEmpty` from radashi to detect undefined or empty values in the system information card and display "Unknown" as a fallback instead of leaving a blank space.
Remove unused Flex wrapper and simplify the Item component by dropping the unused termProps and descriptionProps passthrough props. Also update existing doc and document the known a11y limitation of using DescriptionList with Safari/VoiceOver. A table-component alternative was tested but discarded by now.
ad44a89 to
74ebaed
Compare
mchf
reviewed
Mar 18, 2026
| CardBody, | ||
| CardTitle, | ||
| DescriptionList, | ||
| DescriptionListDescription, |
Contributor
There was a problem hiding this comment.
I believe there is some logic in naming ... but that symmetry is master piece ;-)
Contributor
Author
There was a problem hiding this comment.
Yep, they (PatternFly) have a DescriptionList for wrapping the native HTML dl component and the rest of components for wrapping expected nodes. I guess they are using the base name as prefix for all these components, resulting in that one for the dd 🤷♂️ I would had choice DescriptionListDetails but I guess they have reasons for that naming 😉
mchf
approved these changes
Mar 18, 2026
Contributor
mchf
left a comment
There was a problem hiding this comment.
It LGTM in a sense that according to my poor knowledge of React nothing seems suspicious to me and thanks to tests it seems that it does what is in description ;-)
Merged
imobachgs
added a commit
that referenced
this pull request
Apr 14, 2026
Prepare to release version 20. * #3294 * #3295 * #3296 * #3297 * #3298 * #3299 * #3300 * #3301 * #3302 * #3303 * #3304 * #3305 * #3306 * #3307 * #3308 * #3309 * #3310 * #3311 * #3312 * #3313 * #3315 * #3316 * #3317 * #3318 * #3319 * #3320 * #3322 * #3323 * #3325 * #3326 * #3327 * #3329 * #3330 * #3331 * #3333 * #3334 * #3336 * #3338 * #3339 * #3342 * #3343 * #3349 * #3351 * #3352 * #3353 * #3354 * #3356 * #3357 * #3358 * #3359 * #3360 * #3361 * #3362 * #3363 * #3364 * #3365 * #3366 * #3367 * #3368 * #3371 * #3372 * #3373 * #3375 * #3376 * #3378 * #3379 * #3380 * #3381 * #3382 * #3385 * #3386
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
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.
Problem
When the API does not return some hardware values, the corresponding fields in the system information card display blank, which could mislead users into thinking the UI is broken.
Solution
Display "Unknown" as a fallback for missing or undefined hardware fields, so users can easily understand that Agama could not retrieve the value rather than assuming a UI error.
Additional work
While working on this, the
SystemInformationSectioncomponent was also cleaned up.Also, a table-based alternative was explored to improve screen reader support, but was rejected as it might cause a double label announcement (probably easy to fix) and background styling conflicts with the wrapper component background.
Testing