DataTable: sortFunction retains stale data

[VsevolodGolovanov]

I'm submitting a ... (check one with "x")

[x] bug report
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://forum.primefaces.org/viewforum.php?f=57

Codesandbox Case (Bug Reports)
https://codesandbox.io/s/primereact-datatable-sortfunction-retains-stale-data-updated-u5esv

Current behavior
A custom sortFunction is not passed in data, so you have to keep track of it yourself. But even though my sortFunction gets recreated with new data, the sortFunction instance that ends up being used is old and remembers stale data.

Expected behavior
The recreated up-to-date sortFunction instance is used for sorting.

Minimal reproduction of the problem with instructions
Open linked codesandbox.
Click the "New data" button.
Observe the table showing updated data.
Now click the table header to enable sorting.
Click the "New data" button.
Observe the table showing stale data.

In the sandbox console you can see that createSortFunc was called with up-to-date data, yet the sortFunction that got invoked after that rememberd stale data.

Please tell us about your environment:

• React version:

17.0.2

• PrimeReact version:

6.5.1

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

[VsevolodGolovanov]

This is a repeat of #1705 with an updated codesandbox. Don't know why you'd want duplicates, but here it is.

[mertsincan]

Hi,

I think this is related to demo. In the last phase, the value is [7, 8, 9] in DataTable component. But, it is [4,5,6] in your createSortFunc and old value remains in callback. Please try;
https://codesandbox.io/s/primereact-datatable-sortfunction-retains-stale-data-updated-forked-5yw5y?file=/src/index.js

Best Regards,

[VsevolodGolovanov]

@mertsincan
As the screenshot in description shows, sort function is recreated with actual data (7,8,9). But the table uses older function with 4,5,6.
You're just working around this issue by passing a function instead of the value.

Also as I stated in #1705:

IMHO sortFunction should be passed data by the DataTable. This will also allow for filtering the data before sorting.

Maybe even change it to be a predicate. So that the sortFunction wouldn't be able to replace data at all.

[VsevolodGolovanov]

You're just working around this issue by passing a function instead of the value.

And you can't even do that with a functional component, since you don't have this.state.data to reference - you just have data and your getData function would see the same outdated value that it closed over on a previous render.

Functional version of my reproducer: https://codesandbox.io/s/primereact-datatable-sortfunction-retains-stale-data-updated-2-ykv5w
Functional getData failure proof: https://codesandbox.io/s/primereact-datatable-sortfunction-retains-stale-data-updated-2-getdata-tte7x

[melloware]

This is fixed in 8.2.0