primefaces / primefaces/primereact
DataTable: Expandable Rows cannot close after expand and sort
Nobody has claimed this yet.
- Dominant language
- CSS
- Stars
- 8.3k
- Forks
- 1.2k
- PR merge metrics
- No merged PRs in 30d
Description
Describe the bug
Adding sortable to a <Column ../> in a Expandable Rows leads into rows not being able to collapse after being sorted.
I've attached a video, and this stackblitz was made with 10.3.2.
With a link to a direct fork from the https://primereact.org/datatable/#rowgroup_expandable page
-- and then adding sortable to the Colums, as well as a link to the stackblitz I've been re-producing it on.
It does not appear to be working in newer versions either. Seemingly happens on all browsers I've tested.
Questions have been asked on Discord, as well as the discussions page, with no concrete answer.
Reproducer
https://stackblitz.com/edit/aa28rc-b6pkmp?file=src%2FApp.jsx
PrimeReact version
10.3.2
React version
18.x
Language
TypeScript
Build / Runtime
Next.js
Browser(s)
No response
Steps to reproduce the behavior
- Expand a name
- Sort a category (Company?)
- Try to close the category again
- Witness it not closing
https://github.com/primefaces/primereact/assets/17611705/bc1bbb9d-c154-4942-b7c6-a35f85d6c7ef
Expected behavior
Rows being able to collapse after being sorted.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked StackBlitz reproducer at src/App.jsx and compare it with the DataTable expandable-rows example at primereact.org/datatable/#rowgroup_expandable. Reproduce the sequence of expanding a row, sorting a column, and collapsing it. Done means the expanded row can still be collapsed after sorting, including in the reported React and PrimeReact versions.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- next.js, react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100