Not able to sort the newset records at first

[pullelakalyani]

Hello @imballinst

I've tried to sort the records based on the uploaded date and the newest should come first but it didn't worked as expected. I've tried the following:

<DatatableWrapper body={dataTableBody} headers={dataTableHeader} sortProps={{ initialState: { order: 'asc', prop: 'uploaddate' }, sortValueObj: { date: (date) => parse(${date}, 'MMMM dd, yyyy', new Date()).getTime() } }}

I've tried with both orders "asc" and "desc" but nothing changed. I'm using v3.2.1 Could you please help me on this.

Thank you in advance

[imballinst]

hi @pullelakalyani! A question, shouldn't the key of sortValueObj be uploaddate instead of just date? CMIIW.

If it doesn't work still, could you create a minimal reproduce in a sandbox? I may be help further with that. Thanks!

[pullelakalyani]

Thanks @imballinst for the quick response Yes I've tried with the uploaddate instead of just date but didn't worked Here is the sandbox with minimal code to reproduce that issue https://codesandbox.io/s/funny-bassi-omvq5e?file=/src/App.js

Please have a look and help me out

Thank you in advance. Really appreciate for the quick reply and quick fixes.

[imballinst]

Thanks @pullelakalyani for the sandbox link! I believe I have found the issue. It's because we aren't parsing the date with the correct format. Here is the working example: https://codesandbox.io/s/reverent-faraday-dp2s46?file=/src/App.js.

The key is here:

sortValueObj: {
  upload_timestamp: (date) =>
    parse(
      `${date}`,
      // More info regarding the tokens in the date-fns docs:
      // https://date-fns.org/v2.28.0/docs/format.
      "yyyy-MM-dd HH:mm:ss.SSSSSS",
      new Date()
    ).getTime()
}

Since the date format is like this 2022-04-04 16:16:20.827011, then we need to match the formatting tokens as well. We can read https://date-fns.org/v2.28.0/docs/format or other documentation of the date library that we use. I hope this helps!

[pullelakalyani]

Thankyou so much @imballinst My bad I missed the format thing. But it's ordering from oldest to newest but not newest to oldest on firstload. I've tried the asc and desc for the repo you've shared

[imballinst]

Hmm, wait, this is newest to oldest, no? This is on my first load (using the same sandbox):

[pullelakalyani]

It should be in reverse order 2022-04-05 first then 2022-04-04

[imballinst]

...ah! Yes, my bad. You are right, hmm, perhaps it's a bug. I'll investigate this and I'll get back to this issue if I have fixed it. Thanks for the report!

[pullelakalyani]

Sure Thank you @imballinst Waiting for your response to fix the bugs

[imballinst]

@pullelakalyani I just published 3.3.1-alpha.0 and here is the sandbox: https://codesandbox.io/s/reverent-faraday-dp2s46?file=/src/App.js. Could you confirm if it's working properly now? If yes, I will release 3.3.1 after. Thanks!

[pullelakalyani]

Yes that's working awesome. You can release v3.3.1 Thankyou for the quick fix @imballinst

[imballinst]

@pullelakalyani it should be out now: https://www.npmjs.com/package/react-bs-datatable/v/3.3.1, but it's not indexed yet in the main page (should be fine, I think).

Let me know if you face further issues! I'm closing this issue for now.

[pullelakalyani]

Sure @imballinst , it worked Thank you and really appreciated for the help in such a short span.