[FR] click header to sort: add a "Restore default" state

[ildar170975]

https://github.com/custom-cards/flex-table-card/pull/107 introduced a "click header to sort" feature. Currently a clicked header has 2 states:

1. Sorted upwards.
2. Sorted downwards.

This is great - but consider to add the THIRD state: "Restore default":

• 1st click - "upwards";
• 2nd click - "downwards";
• 3rd click - "restore default" (now arrow indicator is displayed).

Use cases:

• a table may have a sort by a hidden column;
• a table may have 2(or more)-criteria sort.

Currently to restore a default sort I have to refresh a page.

Many UI grid controls have these 3 states. Would be great to have it here too.

[EdLeckert]

I was thinking the same thing as I was working on this feature, except that I had not worked with any controls like this that I can recall and wasn't sure how to go about it.

It seems the tri-state sort feature can be a bit controversial, as some think it is unintuitive. However, I think the UI in the Wikipedia approach is reasonable and would be easy to comprehend.

[ildar170975]

There are 2 ways of restoring a default sorting: -- "tri-state headers" - the 3rd click resets the table to a default sorting (could be another column, could be >1-criteria); -- a separate control "reset to default".

The 1st way MAY BE called as "unintuitive" - but at least it is a compact way. The 2nd way needs changes in a design - have no idea where this control may be nicely placed.

BTW, the HA Frontend already has a tri-state feature - but it seems to be not working properly.

As for Wikipedia: I like these: but do not like this: Imho this is more clear:

[daringer]

I would also vote for the variant without arrows as the "third-state" - this makes the initial state consistent/identical with the 3rd state.