diff --git a/src/components/Dashboard/NewReport/MetricsTable/index.tsx b/src/components/Dashboard/NewReport/MetricsTable/index.tsx index b3a2ff745..b1e974837 100644 --- a/src/components/Dashboard/NewReport/MetricsTable/index.tsx +++ b/src/components/Dashboard/NewReport/MetricsTable/index.tsx @@ -4,7 +4,6 @@ import { getCoreRowModel, getSortedRowModel, SortingFn, - sortingFns, useReactTable } from "@tanstack/react-table"; @@ -84,7 +83,6 @@ export const MetricsTable = ({ const columns = [ columnHelper.accessor((row) => row.key.service, { header: "Service", - enableSorting: false, cell: (info) => info.getValue() }), columnHelper.accessor((row) => row, { @@ -135,7 +133,7 @@ export const MetricsTable = ({ cell: (info) => { return info.getValue(); }, - sortingFn: sortingFns.alphanumeric, + sortingFn: sortImpactFn, meta: { contentAlign: "center" } @@ -147,7 +145,8 @@ export const MetricsTable = ({ data, columns, getCoreRowModel: getCoreRowModel(), - getSortedRowModel: getSortedRowModel() + getSortedRowModel: getSortedRowModel(), + enableSortingRemoval: false }); return ( @@ -163,8 +162,12 @@ export const MetricsTable = ({ return ( {header.isPlaceholder ? null diff --git a/src/components/Dashboard/NewReport/MetricsTable/styles.ts b/src/components/Dashboard/NewReport/MetricsTable/styles.ts index 3a6d4f7dd..404c95d93 100644 --- a/src/components/Dashboard/NewReport/MetricsTable/styles.ts +++ b/src/components/Dashboard/NewReport/MetricsTable/styles.ts @@ -20,7 +20,7 @@ export const TableHead = styled.thead` `; export const TableHeaderCell = styled.th` - height: 70; + height: 70px; `; export const TableCellContent = styled.div` @@ -49,7 +49,7 @@ export const TableHeaderCellContent = styled(TableCellContent)` font-weight: 400; gap: 4px; color: ${({ theme }) => theme.colors.v3.text.tertiary}; - cursor: pointer; + ${({ onClick }) => (onClick ? "cursor: pointer;" : "")} `; export const TableBodyRow = styled.tr`