Implementing a table on a custom page using sorting

[m.poliit]

If I go to any entity page in the table when I click on the header the sorting happens as shown in the screenshot.
How to implement similar sorting on custom page using tpl which is stored in client/custom/res/templates/detail/tableDetail.tpl.

<table class="table table-striped table-bordered">
<thead>
<tr>
<td class="text-bold">key</td>
<td class="text-bold">count</td>
<td class="text-bold">price</td>
</tr>
</thead>
<tbody>
{{#each result}}
<tr>
<td>{{key}}</td>
<td>{{count}}</td>
<td>{{price}}</td>
</tr>
{{/each}}
</tbody>
</table>​

[rabii]

Hey,

You will need to add that functionality, here is the source of both files (list view and list template)
record list view

https://github.com/espocrm/espocrm/blob/cb188cc54d40cd228d88ca74f8c0d5c169573204/client/src/views/record/list.js#L4

record list template

https://github.com/espocrm/espocrm/blob/cb188cc54d40cd228d88ca74f8c0d5c169573204/client/res/templates/record/list.tpl#L159

Search for toggleSort

[m.poliit]

Could you explain in more detail how I can use this, what is in the file client/res/templates/record/list.tpl I figured it out there is not complicated. but how do I implement it?

Perhaps there is a detailed manual or video?
I can describe how I achieved my result, and you can tell me what I'm doing wrong, if possible.