mi6 / mi6/ic-ui-kit

[ic-data-table] - issue with row heights when data sorted

Open
#4,384 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
53
Forks
63
Avg merge
2d 4h
Merged PRs (30d)
15

Description

### Summary of the bug
When using a datatable with globalRowHeights and truncation, the row heights change when sorting the table

### 🪜 How to reproduce
Tell us the steps to reproduce the problem:
1. Go to page: https://stackblitz.com/edit/nn9bpjgz-gab6qusc?file=src%2Fapp.jsx,package.json&hideExplorer=1
2. See that all rows are the same height (the configured globalRowheight):

Image

3. click the sort button in the Name column
4. See the error - the rowheights are now uneven:
Image

5. click the sort button again and see that row2 (which previously had a long truncated description), is now still honouring the full globalRowHeight value

Image

### 🧐 Expected behaviour
I am unsure what the actual behaviour should be. I believe the intention is that all rows should be the globalRowHeight as they are when first loaded. Although there is maybe a case to only make the rows fill the space they require eg 1 line & then have the globalRowHeight as a maximum

### 🚨 Urgency (low, medium or high)
Low - at present we can hide this by disabling sorting

Contributor guide

Open the contributing guide

Research direction

Reproduce the issue in the linked StackBlitz example using ic-data-table with globalRowHeights, truncation, and sorting. Start by tracing the table's row-height handling during sort and clarify whether rows should remain uniformly sized or shrink to their content. Done means the chosen behavior remains consistent after repeated sorting.

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
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.