diff --git a/app/vmui/packages/vmui/src/components/Home/Views/TableView.tsx b/app/vmui/packages/vmui/src/components/Home/Views/TableView.tsx
index 8e6ca9b0c6..bf005081ba 100644
--- a/app/vmui/packages/vmui/src/components/Home/Views/TableView.tsx
+++ b/app/vmui/packages/vmui/src/components/Home/Views/TableView.tsx
@@ -1,4 +1,4 @@
-import React, {FC, useMemo} from "preact/compat";
+import React, {FC, useMemo, useState} from "preact/compat";
 import {InstantMetricResult} from "../../../api/types";
 import {InstantDataSeries} from "../../../types";
 import Table from "@mui/material/Table";
@@ -7,6 +7,7 @@ import TableCell from "@mui/material/TableCell";
 import TableContainer from "@mui/material/TableContainer";
 import TableHead from "@mui/material/TableHead";
 import TableRow from "@mui/material/TableRow";
+import TableSortLabel from "@mui/material/TableSortLabel";
 import makeStyles from "@mui/styles/makeStyles";
 import {useSortedCategories} from "../../../hooks/useSortedCategories";
 
@@ -26,12 +27,30 @@ const TableView: FC<GraphViewProps> = ({data}) => {
 
   const sortedColumns = useSortedCategories(data);
 
+  const [orderBy, setOrderBy] = useState("");
+  const [orderDir, setOrderDir] = useState<"asc" | "desc">("asc");
+
   const rows: InstantDataSeries[] = useMemo(() => {
-    return data?.map(d => ({
+    const rows = data?.map(d => ({
       metadata: sortedColumns.map(c => d.metric[c.key] || "-"),
       value: d.value ? d.value[1] : "-"
     }));
-  }, [sortedColumns, data]);
+    const orderByValue = orderBy === "Value";
+    const rowIndex = sortedColumns.findIndex(c => c.key === orderBy);
+    if (!orderByValue && rowIndex === -1) return rows;
+    return rows.sort((a,b) => {
+      const n1 = orderByValue ? Number(a.value) : a.metadata[rowIndex];
+      const n2 = orderByValue ? Number(b.value) : b.metadata[rowIndex];
+      const asc = orderDir === "asc" ? n1 < n2 : n1 > n2;
+      return asc ? -1 : 1;
+    });
+  }, [sortedColumns, data, orderBy, orderDir]);
+
+  const sortHandler = (key: string) => {
+    setOrderDir((prev) => prev === "asc" && orderBy === key ? "desc" : "asc");
+    setOrderBy(key);
+  };
+
 
   return (
     <>
@@ -41,8 +60,25 @@ const TableView: FC<GraphViewProps> = ({data}) => {
             <TableHead>
               <TableRow>
                 {sortedColumns.map((col, index) => (
-                  <TableCell style={{textTransform: "capitalize"}} key={index}>{col.key}</TableCell>))}
-                <TableCell align="right">Value</TableCell>
+                  <TableCell key={index} style={{textTransform: "capitalize"}}>
+                    <TableSortLabel
+                      active={orderBy === col.key}
+                      direction={orderDir}
+                      onClick={() => sortHandler(col.key)}
+                    >
+                      {col.key}
+                    </TableSortLabel>
+                  </TableCell>
+                ))}
+                <TableCell align="right">
+                  <TableSortLabel
+                    active={orderBy === "Value"}
+                    direction={orderDir}
+                    onClick={() => sortHandler("Value")}
+                  >
+                    Value
+                  </TableSortLabel>
+                </TableCell>
               </TableRow>
             </TableHead>
             <TableBody>