agama-project / agama / 31480801684

83%

master: 83%

push

github

refactor(web): rework SplitInfoLayout into SideBySideLayout, fix title/body alignment (#3753)

## TL;DR

Renames `SplitInfoLayout` to `SideBySideLayout` and fixes its markup
(explicit grid areas, RTL-safe alignment, title paired with body) to
replace its previous fragile implementation across all 7 screens it
backs.

## Motivation
`SplitInfoLayout` backs seven screens: login, error, and every
installation status screen. It was put together quickly to get their
two-column look in place, and it's worth revisiting now that there's
room to work on the details, because a few things are worth
fixing/improving now:

- Alignment was applied by matching PatternFly's generated inline
`style` attribute by substring (`[style*="Order-on-md: 3"]`). Any PF
change to that internal value, or any reordering of the props, would
silently break alignment with no type error and no test failure.
- The prop names (`firstRowStart`, `firstRowEnd`, `secondRowStart`,
`secondRowEnd`) describe grid positions in the desktop layout only; the
component's own docs needed a note admitting the names don't match what
happens on small viewports, where everything just stacks.
- `secondRowEnd` had zero real callers and `iconSize` was never
overridden, yet both stayed part of the API, plus a `rowSpan` ternary
that existed only to compensate for `secondRowEnd` always being empty.
- Three separate consumers hardcoded `style={{ minInlineSize: "25dvw"
}}` on their primary button, because the layout didn't size its own
content column.
- On small viewports, the description rendered right-aligned while
everything else centered: a desktop-only alignment utility was leaking
into the mobile layout.
- The divider used `left: 50%`, a physical position that puts it on the
wrong side of the content in an RTL locale.


## Summary
- Renames `SplitInfoLayout` to `SideBySideLayout` (component, props
type, file, CSS class), with a semantic API (`icon`, `title`,
`description`, `children`) replacing grid-coordin... (continued)

4918 of 6850 branches covered (71.8%)

Branch coverage included in aggregate %.

16 of 16 new or added lines in 8 files covered. (100.0%)

25687 of 29979 relevant lines covered (85.68%)

122.25 hits per line