chore: merge upstream/main into admin-frontend-domain preserving custom domain and branding features

src/routes/nat.tsx

@@ -12,8 +12,9 @@ import {
     TableHeader,
     TableRow,
 } from "@/components/ui/table"
+import { selectableTableFeatures } from "@/lib/table"
 import { ModelNAT } from "@/types"
-import { ColumnDef, flexRender, getCoreRowModel, useReactTable } from "@tanstack/react-table"
+import { ColumnDef, flexRender, useTable } from "@tanstack/react-table"
 import { useEffect, useMemo } from "react"
 import { useTranslation } from "react-i18next"
 import { toast } from "sonner"
@@ -33,7 +34,7 @@ export default function NATPage() {
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [error])
 
-    const columns: ColumnDef<ModelNAT>[] = [
+    const columns: ColumnDef<typeof selectableTableFeatures, ModelNAT>[] = [
         {
             id: "select",
             header: ({ table }) => (
@@ -53,7 +54,6 @@ export default function NATPage() {
                     aria-label="Select row"
                 />
             ),
-            enableSorting: false,
             enableHiding: false,
         },
         {
@@ -119,10 +119,10 @@ export default function NATPage() {
         return data ?? []
     }, [data])
 
-    const table = useReactTable({
+    const table = useTable({
+        features: selectableTableFeatures,
         data: dataCache,
         columns,
-        getCoreRowModel: getCoreRowModel(),
     })
 
     const selectedRows = table.getSelectedRowModel().rows