Date sort not working in new table component

[dsmith9]

Using default Date type for the column, displays as MMM d, yyyy. But sorts as text (eg, Feb 8 follows Feb 28). See attached.

[victoria]

Hey @dsmith9! Would you mind sharing a screenshot of your date column settings? Mine seems to be sorting properly by date, but I likely don't have the same exact setup as you do.

[Adrian_C]

I am finding the same issue. If I use the legacy table, the date does sort properly with settings similar to your screenshot.

When I call the same data on a new table and then used the advanced sort, I find it is sorting by text as well.

[dsmith9]

[Roland_Alden]

My problem is similar but not exactly the same. Sorting seems to work but there is a feature which is missing AFAIK.

1. The column is a timestamp. The database query is returning strings like this: 2023-11-01T21:39:13.397Z

2. The mapped value of the column is an expression like this:
   {{item == null ? "never" : moment.utc(item).fromNow(true) + ' ago'}}

So this causes the column to display strings like these:

You can see what the problem is. The sort is being applied to the presentation string in the column, not the underlying data value.

Both can be correct; it depends on the underlying data type and the presentation requirements. I realize one can sort the table in the data layer but to do that I would need an event that tells me when the user clicks on the header and changes the sort direction. And AFAIK there is no such event. Only a tooltip for the column header.

Certainly the simplest solution is to have a setting that controls whether or not the sort is based on the data or the display string. You do this "correctly" and automatically in some cases. For example, if the column type is a progress widget you are not sorting on what it looks like, you are sorting on the numerical "value".

Another way to "fix" this is to have two columns; one hidden H and one visible V. V could have a directive which says "my sort should apply to H". Clicking on the sort button of V would trigger a sort on H. H can be bound to the data. V can use H's data and transform it in whatever weird way it wants. Just a thought.

[victoria]

This is definitely a problem

Depending on your underlying data source, there are a few different workarounds here until we're able to fix the root cause issue.

In this case, mapping through my dates and using moment().format() worked!

Before (improper sorting w/out moment):

After (proper sorting w/ moment)

As another example, if your format is formatted like:
​

[ { "created_at": "2/10/2023, 11:19:11 PM" }, { "created_at": "2/7/2023, 4:13:56 PM" }, { "created_at": "2/1/2023, 9:17:22 AM" } ]

The dateTime column doesn't like/know how to read the dateTime in this way.

Instead, you can try using a unix timestamp instead (which the dateTime column does indeed know how to read) or map through your data with something like:
​

{{ query1.data.map(row => ({...row, created_at: moment(row.created_at).format()})) }}

You can format your date however you'd like inside the format function

Let me know how this works for you!

[victoria]

Update! We pushed a fix here so the new Table's DateTime column should sort as expected. Thank you all for your feedback and patience while we looked into this, and let me know how it's working for you now!

[kbn]

Noting that in another case, where the dates originally looked like the below, community member @shawnhoffman was able to use the following syntax to get dates to sort as expected leveraging moment.js and the toISOString() method: {{ moment(item, 'M-D-YYYY [at] h:mm A').toISOString() }}

Thanks @shawnhoffman !