Altinn / Altinn/app-frontend-react
Grid column options width is not working as intended in v3
- Dominant language
- TypeScript
- Stars
- 21
- Forks
- 33
- Avg merge
- 6d 23h
- Merged PRs (30d)
- 3
Description
### Description of the bug
It looks like we have a bug in v3 for configuring column widths for the `Grid` component. The width is not set in cases where the header of that column is empty. If there is text in the header, the width is set, but it has no effect for the first column.
Relevant slack discussion: https://altinn.slack.com/archives/C02EJ9HKQA3/p1709196534224289
### Steps To Reproduce
1. in a v3 app, add a grid component
2. create a header and rows, for four columns
3. make the first column only contain text elements, some text should be long in order to illustrate that the configured width is not applied, and the rest of the table cells simple input components
4. configure each `columnOptions` for each header-cell like this
```
"columnOptions": {
"width": "25%
}
```
5. See that the width of the columns are not equal. (Note: all of the columns should not be literally equal, the first and last columns have added some extra width as padding. Subtracting this padding should make all the widths equal.)
### Additional Information
_No response_
Contributor guide
Research direction
Start at the Grid component and search for handling of columnOptions.width, then reproduce the issue in a v3 app using four columns and an empty first-column header. Done means configured widths are applied consistently, including when a header is empty and for the first column, while accounting for edge padding.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100