Get rid of @oxide/table alias and barrel file (#1981)

* remove Table

* get rid of app/table/react-table. my bad

* get rid of the rest of it

app/components/ExternalIps.tsx

@@ -7,9 +7,9 @@
  */
 
 import { useApiQuery } from '@oxide/api'
-import { EmptyCell, SkeletonCell } from '@oxide/table'
 import { intersperse } from '@oxide/util'
 
+import { EmptyCell, SkeletonCell } from '~/table/cells/EmptyCell'
 import { CopyToClipboard } from '~/ui/lib/CopyToClipboard'
 
 type InstanceSelector = { project: string; instance: string }

app/components/MoreActionsMenu.tsx

@@ -5,9 +5,10 @@
  *
  * Copyright Oxide Computer Company
  */
-import type { MenuAction } from '@oxide/table'
 import { DropdownMenu, More12Icon, Tooltip, Wrap } from '@oxide/ui'
 
+import type { MenuAction } from '~/table/columns/action-col'
+
 interface MoreActionsMenuProps {
   /** The accessible name for the menu button */
   label: string

app/pages/ProjectsPage.tsx

@@ -15,7 +15,6 @@ import {
   usePrefetchedApiQuery,
   type Project,
 } from '@oxide/api'
-import { DateCell, linkCell, useQueryTable, type MenuAction } from '@oxide/table'
 import {
   buttonStyle,
   EmptyMessage,
@@ -25,6 +24,10 @@ import {
   TableActions,
 } from '@oxide/ui'
 
+import { DateCell } from '~/table/cells/DateCell'
+import { linkCell } from '~/table/cells/LinkCell'
+import type { MenuAction } from '~/table/columns/action-col'
+import { useQueryTable } from '~/table/QueryTable'
 import { confirmDelete } from 'app/stores/confirm-delete'
 import { pb } from 'app/util/path-builder'
 

app/pages/SiloAccessPage.tsx

@@ -5,6 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
+import { createColumnHelper, getCoreRowModel, useReactTable } from '@tanstack/react-table'
 import { useMemo, useState } from 'react'
 
 import {
@@ -19,7 +20,6 @@ import {
   type IdentityType,
   type RoleKey,
 } from '@oxide/api'
-import { createColumnHelper, getActionsCol, Table, useReactTable } from '@oxide/table'
 import {
   Access24Icon,
   Button,
@@ -31,6 +31,8 @@ import {
 } from '@oxide/ui'
 import { groupBy, isTruthy } from '@oxide/util'
 
+import { getActionsCol } from '~/table/columns/action-col'
+import { Table } from '~/table/Table'
 import { AccessNameCell } from 'app/components/AccessNameCell'
 import { HL } from 'app/components/HL'
 import { RoleBadgeCell } from 'app/components/RoleBadgeCell'
@@ -147,7 +149,11 @@ export function SiloAccessPage() {
     [siloPolicy, updatePolicy]
   )
 
-  const tableInstance = useReactTable({ columns, data: rows })
+  const tableInstance = useReactTable({
+    columns,
+    data: rows,
+    getCoreRowModel: getCoreRowModel(),
+  })
 
   return (
     <>

app/pages/project/access/ProjectAccessPage.tsx

@@ -7,6 +7,7 @@
  */
 import '@tanstack/react-table'
 
+import { createColumnHelper, getCoreRowModel, useReactTable } from '@tanstack/react-table'
 import { useMemo, useState } from 'react'
 import type { LoaderFunctionArgs } from 'react-router-dom'
 
@@ -22,7 +23,6 @@ import {
   type IdentityType,
   type RoleKey,
 } from '@oxide/api'
-import { createColumnHelper, getActionsCol, Table, useReactTable } from '@oxide/table'
 import {
   Access24Icon,
   Button,
@@ -34,6 +34,8 @@ import {
 } from '@oxide/ui'
 import { groupBy, isTruthy } from '@oxide/util'
 
+import { getActionsCol } from '~/table/columns/action-col'
+import { Table } from '~/table/Table'
 import { AccessNameCell } from 'app/components/AccessNameCell'
 import { HL } from 'app/components/HL'
 import { RoleBadgeCell } from 'app/components/RoleBadgeCell'
@@ -174,7 +176,11 @@ export function ProjectAccessPage() {
     [projectPolicy, project, updatePolicy]
   )
 
-  const tableInstance = useReactTable({ columns, data: rows })
+  const tableInstance = useReactTable({
+    columns,
+    data: rows,
+    getCoreRowModel: getCoreRowModel(),
+  })
 
   return (
     <>

app/pages/project/disks/DisksPage.tsx

@@ -15,13 +15,6 @@ import {
   useApiQueryClient,
   type Disk,
 } from '@oxide/api'
-import {
-  DateCell,
-  InstanceLinkCell,
-  SizeCell,
-  useQueryTable,
-  type MenuAction,
-} from '@oxide/table'
 import {
   buttonStyle,
   EmptyMessage,
@@ -31,6 +24,11 @@ import {
   TableActions,
 } from '@oxide/ui'
 
+import { DateCell } from '~/table/cells/DateCell'
+import { InstanceLinkCell } from '~/table/cells/InstanceLinkCell'
+import { SizeCell } from '~/table/cells/SizeCell'
+import type { MenuAction } from '~/table/columns/action-col'
+import { useQueryTable } from '~/table/QueryTable'
 import { DiskStatusBadge } from 'app/components/StatusBadge'
 import { getProjectSelector, useProjectSelector, useToast } from 'app/hooks'
 import { confirmDelete } from 'app/stores/confirm-delete'

app/pages/project/floating-ips/FloatingIpsPage.tsx

@@ -17,7 +17,6 @@ import {
   type FloatingIp,
   type Instance,
 } from '@oxide/api'
-import { InstanceLinkCell, useQueryTable, type MenuAction } from '@oxide/table'
 import {
   buttonStyle,
   EmptyMessage,
@@ -31,6 +30,9 @@ import {
   TableActions,
 } from '@oxide/ui'
 
+import { InstanceLinkCell } from '~/table/cells/InstanceLinkCell'
+import type { MenuAction } from '~/table/columns/action-col'
+import { useQueryTable } from '~/table/QueryTable'
 import { HL } from 'app/components/HL'
 import { getProjectSelector, useProjectSelector } from 'app/hooks'
 import { confirmAction } from 'app/stores/confirm-action'

app/pages/project/images/ImagesPage.tsx

@@ -9,7 +9,6 @@ import { useState } from 'react'
 import { Link, Outlet, type LoaderFunctionArgs } from 'react-router-dom'
 
 import { apiQueryClient, useApiMutation, useApiQueryClient, type Image } from '@oxide/api'
-import { DateCell, linkCell, SizeCell, useQueryTable, type MenuAction } from '@oxide/table'
 import {
   buttonStyle,
   EmptyMessage,
@@ -21,6 +20,11 @@ import {
   TableActions,
 } from '@oxide/ui'
 
+import { DateCell } from '~/table/cells/DateCell'
+import { linkCell } from '~/table/cells/LinkCell'
+import { SizeCell } from '~/table/cells/SizeCell'
+import type { MenuAction } from '~/table/columns/action-col'
+import { useQueryTable } from '~/table/QueryTable'
 import { getProjectSelector, useProjectSelector, useToast } from 'app/hooks'
 import { confirmDelete } from 'app/stores/confirm-delete'
 import { pb } from 'app/util/path-builder'

app/pages/project/instances/InstancesPage.tsx

@@ -9,13 +9,6 @@ import { useMemo } from 'react'
 import { Link, useNavigate, type LoaderFunctionArgs } from 'react-router-dom'
 
 import { apiQueryClient, useApiQueryClient, usePrefetchedApiQuery } from '@oxide/api'
-import {
-  DateCell,
-  InstanceResourceCell,
-  InstanceStatusCell,
-  linkCell,
-  useQueryTable,
-} from '@oxide/table'
 import {
   Button,
   buttonStyle,
@@ -27,6 +20,11 @@ import {
   TableActions,
 } from '@oxide/ui'
 
+import { DateCell } from '~/table/cells/DateCell'
+import { InstanceResourceCell } from '~/table/cells/InstanceResourceCell'
+import { InstanceStatusCell } from '~/table/cells/InstanceStatusCell'
+import { linkCell } from '~/table/cells/LinkCell'
+import { useQueryTable } from '~/table/QueryTable'
 import { getProjectSelector, useProjectSelector, useQuickActions } from 'app/hooks'
 import { pb } from 'app/util/path-builder'
 

app/pages/project/instances/actions.tsx

@@ -9,8 +9,8 @@ import { useCallback } from 'react'
 import { useNavigate } from 'react-router-dom'
 
 import { instanceCan, useApiMutation, type Instance } from '@oxide/api'
-import type { MakeActions } from '@oxide/table'
 
+import type { MakeActions } from '~/table/columns/action-col'
 import { confirmDelete } from 'app/stores/confirm-delete'
 import { addToast } from 'app/stores/toast'
 import { pb } from 'app/util/path-builder'

app/pages/project/instances/instance/InstancePage.tsx

@@ -17,7 +17,6 @@ import {
   usePrefetchedApiQuery,
   type InstanceNetworkInterface,
 } from '@oxide/api'
-import { EmptyCell } from '@oxide/table'
 import {
   Instances24Icon,
   PageHeader,
@@ -26,6 +25,7 @@ import {
   Truncate,
 } from '@oxide/ui'
 
+import { EmptyCell } from '~/table/cells/EmptyCell'
 import { ExternalIps } from 'app/components/ExternalIps'
 import { MoreActionsMenu } from 'app/components/MoreActionsMenu'
 import { RouteTabs, Tab } from 'app/components/RouteTabs'

app/pages/project/instances/instance/tabs/NetworkingTab.tsx

@@ -17,9 +17,12 @@ import {
   usePrefetchedApiQuery,
   type InstanceNetworkInterface,
 } from '@oxide/api'
-import { LinkCell, SkeletonCell, useQueryTable, type MenuAction } from '@oxide/table'
 import { Badge, Button, EmptyMessage, Networking24Icon, Success12Icon } from '@oxide/ui'
 
+import { SkeletonCell } from '~/table/cells/EmptyCell'
+import { LinkCell } from '~/table/cells/LinkCell'
+import type { MenuAction } from '~/table/columns/action-col'
+import { useQueryTable } from '~/table/QueryTable'
 import CreateNetworkInterfaceForm from 'app/forms/network-interface-create'
 import EditNetworkInterfaceForm from 'app/forms/network-interface-edit'
 import {

app/pages/project/instances/instance/tabs/StorageTab.tsx

@@ -18,9 +18,12 @@ import {
   usePrefetchedApiQuery,
   type Disk,
 } from '@oxide/api'
-import { DateCell, SizeCell, useQueryTable, type MenuAction } from '@oxide/table'
 import { Button, EmptyMessage, Storage24Icon } from '@oxide/ui'
 
+import { DateCell } from '~/table/cells/DateCell'
+import { SizeCell } from '~/table/cells/SizeCell'
+import type { MenuAction } from '~/table/columns/action-col'
+import { useQueryTable } from '~/table/QueryTable'
 import { DiskStatusBadge } from 'app/components/StatusBadge'
 import AttachDiskSideModalForm from 'app/forms/disk-attach'
 import { CreateDiskSideModalForm } from 'app/forms/disk-create'

app/pages/project/snapshots/SnapshotsPage.tsx

@@ -14,13 +14,6 @@ import {
   useApiQueryErrorsAllowed,
   type Snapshot,
 } from '@oxide/api'
-import {
-  DateCell,
-  SizeCell,
-  SkeletonCell,
-  useQueryTable,
-  type MenuAction,
-} from '@oxide/table'
 import {
   Badge,
   buttonStyle,
@@ -31,6 +24,11 @@ import {
   TableActions,
 } from '@oxide/ui'
 
+import { DateCell } from '~/table/cells/DateCell'
+import { SkeletonCell } from '~/table/cells/EmptyCell'
+import { SizeCell } from '~/table/cells/SizeCell'
+import type { MenuAction } from '~/table/columns/action-col'
+import { useQueryTable } from '~/table/QueryTable'
 import { SnapshotStatusBadge } from 'app/components/StatusBadge'
 import { getProjectSelector, useProjectSelector } from 'app/hooks'
 import { confirmDelete } from 'app/stores/confirm-delete'

app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx

@@ -5,6 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
+import { createColumnHelper, getCoreRowModel, useReactTable } from '@tanstack/react-table'
 import { useMemo, useState } from 'react'
 
 import {
@@ -13,20 +14,16 @@ import {
   usePrefetchedApiQuery,
   type VpcFirewallRule,
 } from '@oxide/api'
-import {
-  ButtonCell,
-  createColumnHelper,
-  DateCell,
-  EnabledCell,
-  FirewallFilterCell,
-  getActionsCol,
-  Table,
-  TypeValueListCell,
-  useReactTable,
-} from '@oxide/table'
 import { Button, EmptyMessage, TableEmptyBox } from '@oxide/ui'
 import { sortBy, titleCase } from '@oxide/util'
 
+import { DateCell } from '~/table/cells/DateCell'
+import { EnabledCell } from '~/table/cells/EnabledCell'
+import { FirewallFilterCell } from '~/table/cells/FirewallFilterCell'
+import { ButtonCell } from '~/table/cells/LinkCell'
+import { TypeValueListCell } from '~/table/cells/TypeValueListCell'
+import { getActionsCol } from '~/table/columns/action-col'
+import { Table } from '~/table/Table'
 import { CreateFirewallRuleForm } from 'app/forms/firewall-rules-create'
 import { EditFirewallRuleForm } from 'app/forms/firewall-rules-edit'
 import { useVpcSelector } from 'app/hooks'
@@ -116,7 +113,7 @@ export const VpcFirewallRulesTab = () => {
     ]
   }, [setEditing, rules, updateRules, vpcSelector])
 
-  const table = useReactTable({ columns, data: rules })
+  const table = useReactTable({ columns, data: rules, getCoreRowModel: getCoreRowModel() })
 
   const emptyState = (
     <TableEmptyBox>

app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx

@@ -8,9 +8,12 @@
 import { useState } from 'react'
 
 import { useApiMutation, useApiQueryClient, type VpcSubnet } from '@oxide/api'
-import { DateCell, TwoLineCell, useQueryTable, type MenuAction } from '@oxide/table'
 import { Button, EmptyMessage } from '@oxide/ui'
 
+import { DateCell } from '~/table/cells/DateCell'
+import { TwoLineCell } from '~/table/cells/TwoLineCell'
+import type { MenuAction } from '~/table/columns/action-col'
+import { useQueryTable } from '~/table/QueryTable'
 import { CreateSubnetForm } from 'app/forms/subnet-create'
 import { EditSubnetForm } from 'app/forms/subnet-edit'
 import { useVpcSelector } from 'app/hooks'

app/pages/project/vpcs/VpcsPage.tsx

@@ -15,7 +15,6 @@ import {
   usePrefetchedApiQuery,
   type Vpc,
 } from '@oxide/api'
-import { DateCell, linkCell, useQueryTable, type MenuAction } from '@oxide/table'
 import {
   buttonStyle,
   EmptyMessage,
@@ -25,6 +24,10 @@ import {
   TableActions,
 } from '@oxide/ui'
 
+import { DateCell } from '~/table/cells/DateCell'
+import { linkCell } from '~/table/cells/LinkCell'
+import type { MenuAction } from '~/table/columns/action-col'
+import { useQueryTable } from '~/table/QueryTable'
 import { getProjectSelector, useProjectSelector, useQuickActions } from 'app/hooks'
 import { confirmDelete } from 'app/stores/confirm-delete'
 import { pb } from 'app/util/path-builder'

app/pages/settings/ProfilePage.tsx

@@ -5,12 +5,14 @@
  *
  * Copyright Oxide Computer Company
  */
+import { createColumnHelper, getCoreRowModel, useReactTable } from '@tanstack/react-table'
+
 import type { Group } from '@oxide/api'
-import { createColumnHelper, Table, useReactTable } from '@oxide/table'
 import { Settings24Icon } from '@oxide/ui'
 
 import { TextField } from '~/components/form/fields/TextField'
 import { FullPageForm } from '~/components/form/FullPageForm'
+import { Table } from '~/table/Table'
 import { useForm } from 'app/hooks'
 import { useCurrentUser } from 'app/layouts/AuthenticatedLayout'
 
@@ -24,7 +26,11 @@ const columns = [
 export function ProfilePage() {
   const { me, myGroups } = useCurrentUser()
 
-  const groupsTable = useReactTable({ columns, data: myGroups.items })
+  const groupsTable = useReactTable({
+    columns,
+    data: myGroups.items,
+    getCoreRowModel: getCoreRowModel(),
+  })
 
   const form = useForm({
     defaultValues: {