Skip to content

fix(web): displays "Unknown" for missing hardware values#3294

Merged
dgdavid merged 5 commits intomasterfrom
fix-system-information
Mar 18, 2026
Merged

fix(web): displays "Unknown" for missing hardware values#3294
dgdavid merged 5 commits intomasterfrom
fix-system-information

Conversation

@dgdavid
Copy link
Copy Markdown
Contributor

@dgdavid dgdavid commented Mar 17, 2026

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.

localhost_8080_ (14)

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.

localhost_8080_ (15)

Additional work

While working on this, the SystemInformationSection component 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

  • Added unit tests.
  • Tested manually too.

dgdavid added 3 commits March 17, 2026 16:31
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.
@dgdavid dgdavid force-pushed the fix-system-information branch from ad44a89 to 74ebaed Compare March 17, 2026 17:07
CardBody,
CardTitle,
DescriptionList,
DescriptionListDescription,
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I believe there is some logic in naming ... but that symmetry is master piece ;-)

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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 😉

Copy link
Copy Markdown
Contributor

@mchf mchf left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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 ;-)

@dgdavid dgdavid merged commit 3188b5d into master Mar 18, 2026
10 checks passed
@dgdavid dgdavid deleted the fix-system-information branch March 18, 2026 11:14
@imobachgs imobachgs mentioned this pull request Apr 14, 2026
imobachgs added a commit that referenced this pull request Apr 14, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants