search

innovaccer / design-system

Masala Design System (MDS) is an open-source design system built at Innovaccer. Figma file : https://www.figma.com/community/file/974368355920553546/masala-design-system-web-guidelines
https://mds.innovaccer.com
MIT License
84 stars 79 forks source link

Table: Nested rows losing their open state #481

Closed ypahalajani closed 3 years ago

ypahalajani commented 3 years ago

Summary

When there are nested rows in the table and when you scroll through it, the rows that are not in the viewport get unmounted which causes them to lose their local state of whether the nested content was open or close.

Basic example

Let's say I am showing audit information of a feature using the Table component.

I open a nested content of a row at index "x". Now, I want to relate this to some information with the nested content inside another row index that is not yet in the viewport => I'll scroll the table and open this new index let's call it "y".

Since I had scrolled the table such that the row at index "x" is no longer in the viewport, I scroll back up to see that it has already collapsed.

Because of this, I keep opening the rows to view their nested content which I had already opened previously.

satyamyadav commented 3 years ago

@ypahalajani Please share code snippet or props that you used for table, we are not able to re-produce the problem. You can also use this codesandbox to re-produce and share the issue. https://codesandbox.io/s/zealous-dew-70diw?file=/index.js

satyamyadav commented 3 years ago

@aditya-kumawat Can you please confirm if this issue is resolved by some other fixes ?

aditya-kumawat commented 3 years ago

No, this issue is still there. You can replicate this issue by setting up pageSize > (length+buffer), i.e. pageSize > 27 of VirtualScroll in https://github.com/innovaccer/design-system/blob/master/core/components/organisms/grid/GridBody.tsx