From 5876f2cbb35eec062761c5a533fc7b97a1312b30 Mon Sep 17 00:00:00 2001
From: Maina Wycliffe <wmmaina7@gmail.com>
Date: Thu, 23 May 2024 16:49:46 +0300
Subject: [PATCH] fix: use server side sorting for config summary

---
 src/components/Configs/ConfigSummary/ConfigSummaryList.tsx | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/components/Configs/ConfigSummary/ConfigSummaryList.tsx b/src/components/Configs/ConfigSummary/ConfigSummaryList.tsx
index d6935f408a..51f8fe09d2 100644
--- a/src/components/Configs/ConfigSummary/ConfigSummaryList.tsx
+++ b/src/components/Configs/ConfigSummary/ConfigSummaryList.tsx
@@ -2,6 +2,7 @@ import { ConfigSummary } from "@flanksource-ui/api/types/configs";
 import { Badge } from "@flanksource-ui/ui/Badge/Badge";
 import { CountBadge } from "@flanksource-ui/ui/Badge/CountBadge";
 import { DataTable } from "@flanksource-ui/ui/DataTable";
+import useReactTableSortState from "@flanksource-ui/ui/DataTable/Hooks/useReactTableSortState";
 import { CellContext, ColumnDef, Row } from "@tanstack/react-table";
 import { useCallback, useMemo } from "react";
 import { BiLabel } from "react-icons/bi";
@@ -266,6 +267,8 @@ export default function ConfigSummaryList({
     return [...newColumns, ...configSummaryColumns];
   }, [groupBy, groupByTags]);
 
+  const [sortState, updateSortState] = useReactTableSortState();
+
   return (
     <DataTable
       stickyHead
@@ -278,6 +281,9 @@ export default function ConfigSummaryList({
       hiddenColumns={
         groupBy.length > 1 ? groupBy.slice(0, groupBy.length - 1) : undefined
       }
+      enableServerSideSorting
+      onTableSortByChanged={updateSortState}
+      tableSortByState={sortState}
       handleRowClick={handleRowClick}
       tableStyle={{ borderSpacing: "0" }}
       isLoading={isLoading}