From 9357b5d8f54a7ddd05d337cd2fea9506e4e0567b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Podsiad=C5=82y?=
 <67391475+sdlyy@users.noreply.github.com>
Date: Tue, 5 Nov 2024 12:23:47 +0100
Subject: [PATCH] Improve slashable stake sorting (#5721)

---
 .../summary/_components/table/columns.tsx     | 26 +++++++++++++++++--
 1 file changed, 24 insertions(+), 2 deletions(-)

diff --git a/packages/frontend/src/app/(side-nav)/data-availability/summary/_components/table/columns.tsx b/packages/frontend/src/app/(side-nav)/data-availability/summary/_components/table/columns.tsx
index 68e498f8817..f5c11afae4b 100644
--- a/packages/frontend/src/app/(side-nav)/data-availability/summary/_components/table/columns.tsx
+++ b/packages/frontend/src/app/(side-nav)/data-availability/summary/_components/table/columns.tsx
@@ -1,4 +1,4 @@
-import { createColumnHelper } from '@tanstack/react-table'
+import { type Row, createColumnHelper } from '@tanstack/react-table'
 import { NaBadge } from '~/components/badge/na-badge'
 import { GrissiniCell } from '~/components/rosette/grissini/grissini-cell'
 import { TwoRowCell } from '~/components/table/cells/two-row-cell'
@@ -79,7 +79,6 @@ const tvsColumn = columnHelper.accessor('tvs', {
       </div>
     )
   },
-  enableSorting: false,
   meta: {
     tooltip:
       'Total value secured (TVS) is the total value locked of all projects using this layer.',
@@ -105,6 +104,7 @@ const slashableStakeColumn = columnHelper.accessor('economicSecurity', {
       </div>
     )
   },
+  sortingFn: sortSlashableStake,
   meta: {
     align: 'right',
     tooltip:
@@ -229,3 +229,25 @@ export const publicSystemsColumns = [
   bridgeColumn,
   bridgeGroup,
 ]
+
+function sortSlashableStake(
+  rowA: Row<DaSummaryEntry>,
+  rowB: Row<DaSummaryEntry>,
+) {
+  const rowAValue = slashableStakeToValue(rowA.original)
+  const rowBValue = slashableStakeToValue(rowB.original)
+
+  return rowBValue - rowAValue
+}
+
+function slashableStakeToValue(entry: DaSummaryEntry) {
+  if (entry.risks.economicSecurity.type === 'Unknown') {
+    return 0
+  }
+
+  if (!entry.economicSecurity || entry.economicSecurity.status !== 'Synced') {
+    return 0
+  }
+
+  return entry.economicSecurity.economicSecurity
+}