@localstack/appinspector-ui 1.0.70 → 1.0.71

package/dist/index.js

@@ -373,7 +373,7 @@ import { useCallback as useCallback9, useState as useState14 } from "react";
 import { Alert, Box as Box4, Button as Button2 } from "@mui/material";
 
 // src/components/spans-list/spans-data-grid.tsx
-import { DeleteForeverOutlined, PauseOutlined, PlayArrowOutlined, SwapVertOutlined } from "@mui/icons-material";
+import { DeleteForeverOutlined, PauseOutlined, PlayArrowOutlined } from "@mui/icons-material";
 import {
   Box as Box3,
   Button,
@@ -387,6 +387,7 @@ import {
   TableContainer,
   TableHead,
   TableRow,
+  TableSortLabel,
   Tooltip as Tooltip2,
   Typography as Typography2,
   useTheme as useTheme2
@@ -12646,7 +12647,17 @@ var SpansDataGrid = ({
     }),
     columnHelper.accessor("startTime", {
       cell: (props) => /* @__PURE__ */ jsx124(ResponsiveTimestampCell, { date: props.getValue() }),
-      header: "Time",
+      header: () => /* @__PURE__ */ jsx124(
+        TableSortLabel,
+        {
+          active: true,
+          direction: order2 === "newest_first" ? "asc" : "desc",
+          onClick: () => {
+            onOrderChange(order2 === "newest_first" ? "oldest_first" : "newest_first");
+          },
+          children: "Time"
+        }
+      ),
       id: "startTime",
       size: 120
     }),
@@ -12703,7 +12714,7 @@ var SpansDataGrid = ({
       // The actions column doesn't need more space
       size: 96
     })
-  ], [onSpanClick]);
+  ], [onSpanClick, onOrderChange, order2]);
   const table = useReactTable({
     columns,
     data: spans ?? [],
@@ -12730,23 +12741,6 @@ var SpansDataGrid = ({
           label: ""
         }
       ),
-      /* @__PURE__ */ jsx124(
-        FormControlLabel,
-        {
-          control: /* @__PURE__ */ jsx124(
-            Button,
-            {
-              onClick: () => {
-                onOrderChange(order2 === "newest_first" ? "oldest_first" : "newest_first");
-              },
-              startIcon: /* @__PURE__ */ jsx124(SwapVertOutlined, {}),
-              variant: "text",
-              children: order2 === "newest_first" ? "Newest First" : "Oldest First"
-            }
-          ),
-          label: ""
-        }
-      ),
       /* @__PURE__ */ jsx124(
         FormControlLabel,
         {