diff --git a/app/components/ExternalIps.tsx b/app/components/ExternalIps.tsx index f8edac7a2e..879211dc4f 100644 --- a/app/components/ExternalIps.tsx +++ b/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 } diff --git a/app/components/MoreActionsMenu.tsx b/app/components/MoreActionsMenu.tsx index ead6626050..f398bff4ac 100644 --- a/app/components/MoreActionsMenu.tsx +++ b/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 diff --git a/app/pages/ProjectsPage.tsx b/app/pages/ProjectsPage.tsx index 0900dedef9..54f6f5aa7f 100644 --- a/app/pages/ProjectsPage.tsx +++ b/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' diff --git a/app/pages/SiloAccessPage.tsx b/app/pages/SiloAccessPage.tsx index 67ea8aaa31..35cf3bbd2e 100644 --- a/app/pages/SiloAccessPage.tsx +++ b/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 ( <> diff --git a/app/pages/project/access/ProjectAccessPage.tsx b/app/pages/project/access/ProjectAccessPage.tsx index 8c8a0f303c..0796445438 100644 --- a/app/pages/project/access/ProjectAccessPage.tsx +++ b/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 ( <> diff --git a/app/pages/project/disks/DisksPage.tsx b/app/pages/project/disks/DisksPage.tsx index 5c6fc1ae07..99c7fb6730 100644 --- a/app/pages/project/disks/DisksPage.tsx +++ b/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' diff --git a/app/pages/project/floating-ips/FloatingIpsPage.tsx b/app/pages/project/floating-ips/FloatingIpsPage.tsx index cad32e09cb..da7c339954 100644 --- a/app/pages/project/floating-ips/FloatingIpsPage.tsx +++ b/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' diff --git a/app/pages/project/images/ImagesPage.tsx b/app/pages/project/images/ImagesPage.tsx index c216a8e5d5..4dffc45043 100644 --- a/app/pages/project/images/ImagesPage.tsx +++ b/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' diff --git a/app/pages/project/instances/InstancesPage.tsx b/app/pages/project/instances/InstancesPage.tsx index f3885972dc..4345ed5071 100644 --- a/app/pages/project/instances/InstancesPage.tsx +++ b/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' diff --git a/app/pages/project/instances/actions.tsx b/app/pages/project/instances/actions.tsx index a98eb43244..6f8b8cb09e 100644 --- a/app/pages/project/instances/actions.tsx +++ b/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' diff --git a/app/pages/project/instances/instance/InstancePage.tsx b/app/pages/project/instances/instance/InstancePage.tsx index 0debbf1b2f..c50090f083 100644 --- a/app/pages/project/instances/instance/InstancePage.tsx +++ b/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' diff --git a/app/pages/project/instances/instance/tabs/NetworkingTab.tsx b/app/pages/project/instances/instance/tabs/NetworkingTab.tsx index ccd1fd08b8..9f2d047220 100644 --- a/app/pages/project/instances/instance/tabs/NetworkingTab.tsx +++ b/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 { diff --git a/app/pages/project/instances/instance/tabs/StorageTab.tsx b/app/pages/project/instances/instance/tabs/StorageTab.tsx index 6f877b52b3..7d6ff7e400 100644 --- a/app/pages/project/instances/instance/tabs/StorageTab.tsx +++ b/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' diff --git a/app/pages/project/snapshots/SnapshotsPage.tsx b/app/pages/project/snapshots/SnapshotsPage.tsx index 65495faddb..44fe9bf146 100644 --- a/app/pages/project/snapshots/SnapshotsPage.tsx +++ b/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' diff --git a/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx b/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx index c955905662..518c141373 100644 --- a/app/pages/project/vpcs/VpcPage/tabs/VpcFirewallRulesTab.tsx +++ b/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 = ( diff --git a/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx b/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx index fb2dc5e89d..69be51b230 100644 --- a/app/pages/project/vpcs/VpcPage/tabs/VpcSubnetsTab.tsx +++ b/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' diff --git a/app/pages/project/vpcs/VpcsPage.tsx b/app/pages/project/vpcs/VpcsPage.tsx index 286faa08f3..bbe54ed44f 100644 --- a/app/pages/project/vpcs/VpcsPage.tsx +++ b/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' diff --git a/app/pages/settings/ProfilePage.tsx b/app/pages/settings/ProfilePage.tsx index 4b4b9c2897..3a85d8cfcf 100644 --- a/app/pages/settings/ProfilePage.tsx +++ b/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: { diff --git a/app/pages/settings/SSHKeysPage.tsx b/app/pages/settings/SSHKeysPage.tsx index 4c2fc255ca..bf4582ecab 100644 --- a/app/pages/settings/SSHKeysPage.tsx +++ b/app/pages/settings/SSHKeysPage.tsx @@ -8,7 +8,6 @@ import { Link, Outlet, useNavigate } from 'react-router-dom' import { apiQueryClient, useApiMutation, useApiQueryClient, type SshKey } from '@oxide/api' -import { DateCell, useQueryTable, type MenuAction } from '@oxide/table' import { buttonStyle, EmptyMessage, @@ -19,6 +18,9 @@ import { TableActions, } from '@oxide/ui' +import { DateCell } from '~/table/cells/DateCell' +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' diff --git a/app/pages/system/SiloImagesPage.tsx b/app/pages/system/SiloImagesPage.tsx index 451863cb8a..71107c7458 100644 --- a/app/pages/system/SiloImagesPage.tsx +++ b/app/pages/system/SiloImagesPage.tsx @@ -16,7 +16,6 @@ import { useApiQueryClient, type Image, } from '@oxide/api' -import { DateCell, linkCell, SizeCell, useQueryTable, type MenuAction } from '@oxide/table' import { Button, EmptyMessage, @@ -30,6 +29,11 @@ import { import { toListboxItem } from '~/components/form/fields/ImageSelectField' import { ListboxField } from '~/components/form/fields/ListboxField' +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 { useForm, useToast } from 'app/hooks' import { confirmDelete } from 'app/stores/confirm-delete' import { addToast } from 'app/stores/toast' diff --git a/app/pages/system/inventory/DisksTab.tsx b/app/pages/system/inventory/DisksTab.tsx index 113702302d..013796420b 100644 --- a/app/pages/system/inventory/DisksTab.tsx +++ b/app/pages/system/inventory/DisksTab.tsx @@ -6,9 +6,11 @@ * Copyright Oxide Computer Company */ import { apiQueryClient } from '@oxide/api' -import { LabelCell, useQueryTable } from '@oxide/table' import { EmptyMessage, Racks24Icon } from '@oxide/ui' +import { LabelCell } from '~/table/cells/LabelCell' +import { useQueryTable } from '~/table/QueryTable' + const EmptyState = () => { return ( { return ( { diff --git a/app/pages/system/inventory/sled/SledInstancesTab.tsx b/app/pages/system/inventory/sled/SledInstancesTab.tsx index 946d1bfb6f..cee093ed48 100644 --- a/app/pages/system/inventory/sled/SledInstancesTab.tsx +++ b/app/pages/system/inventory/sled/SledInstancesTab.tsx @@ -8,15 +8,13 @@ import type { LoaderFunctionArgs } from 'react-router-dom' import { apiQueryClient } from '@oxide/api' -import { - DateCell, - InstanceResourceCell, - useQueryTable, - type MenuAction, -} from '@oxide/table' import { EmptyMessage, Instances24Icon } from '@oxide/ui' import { pick } from '@oxide/util' +import { DateCell } from '~/table/cells/DateCell' +import { InstanceResourceCell } from '~/table/cells/InstanceResourceCell' +import type { MenuAction } from '~/table/columns/action-col' +import { useQueryTable } from '~/table/QueryTable' import { InstanceStatusBadge } from 'app/components/StatusBadge' import { requireSledParams, useSledParams } from 'app/hooks' diff --git a/app/pages/system/networking/IpPoolPage.tsx b/app/pages/system/networking/IpPoolPage.tsx index bd97068993..a99b89c4f2 100644 --- a/app/pages/system/networking/IpPoolPage.tsx +++ b/app/pages/system/networking/IpPoolPage.tsx @@ -18,13 +18,6 @@ import { type IpPoolRange, type IpPoolSiloLink, } from '@oxide/api' -import { - DateCell, - LinkCell, - SkeletonCell, - useQueryTable, - type MenuAction, -} from '@oxide/table' import { Badge, Button, @@ -40,6 +33,11 @@ import { } from '@oxide/ui' import { ListboxField } from '~/components/form/fields/ListboxField' +import { DateCell } from '~/table/cells/DateCell' +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 { ExternalLink } from 'app/components/ExternalLink' import { HL } from 'app/components/HL' import { QueryParamTabs } from 'app/components/QueryParamTabs' diff --git a/app/pages/system/networking/IpPoolsTab.tsx b/app/pages/system/networking/IpPoolsTab.tsx index d15c5e491e..4bf8d2c611 100644 --- a/app/pages/system/networking/IpPoolsTab.tsx +++ b/app/pages/system/networking/IpPoolsTab.tsx @@ -15,9 +15,12 @@ import { usePrefetchedApiQuery, type IpPool, } from '@oxide/api' -import { DateCell, linkCell, useQueryTable, type MenuAction } from '@oxide/table' import { buttonStyle, EmptyMessage, Networking24Icon } 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 { useQuickActions } from 'app/hooks' import { confirmDelete } from 'app/stores/confirm-delete' import { pb } from 'app/util/path-builder' diff --git a/app/pages/system/silos/SiloIdpsTab.tsx b/app/pages/system/silos/SiloIdpsTab.tsx index fac3fa0658..a2d2cfd1f4 100644 --- a/app/pages/system/silos/SiloIdpsTab.tsx +++ b/app/pages/system/silos/SiloIdpsTab.tsx @@ -7,9 +7,13 @@ */ import { Link, Outlet } from 'react-router-dom' -import { DateCell, DefaultCell, linkCell, TruncateCell, useQueryTable } from '@oxide/table' import { Badge, buttonStyle, Cloud24Icon, EmptyMessage } from '@oxide/ui' +import { DateCell } from '~/table/cells/DateCell' +import { DefaultCell } from '~/table/cells/DefaultCell' +import { linkCell } from '~/table/cells/LinkCell' +import { TruncateCell } from '~/table/cells/TruncateCell' +import { useQueryTable } from '~/table/QueryTable' import { useSiloSelector } from 'app/hooks' import { pb } from 'app/util/path-builder' diff --git a/app/pages/system/silos/SiloIpPoolsTab.tsx b/app/pages/system/silos/SiloIpPoolsTab.tsx index 368274c186..c86828f6e2 100644 --- a/app/pages/system/silos/SiloIpPoolsTab.tsx +++ b/app/pages/system/silos/SiloIpPoolsTab.tsx @@ -9,7 +9,6 @@ import { useMemo, useState } from 'react' import { useApiMutation, useApiQuery, useApiQueryClient, type SiloIpPool } from '@oxide/api' -import { linkCell, useQueryTable, type MenuAction } from '@oxide/table' import { Badge, Button, @@ -21,6 +20,9 @@ import { } from '@oxide/ui' import { ListboxField } from '~/components/form/fields/ListboxField' +import { linkCell } from '~/table/cells/LinkCell' +import type { MenuAction } from '~/table/columns/action-col' +import { useQueryTable } from '~/table/QueryTable' import { ExternalLink } from 'app/components/ExternalLink' import { HL } from 'app/components/HL' import { useForm, useSiloSelector } from 'app/hooks' diff --git a/app/pages/system/silos/SilosPage.tsx b/app/pages/system/silos/SilosPage.tsx index 68b07e4528..a4cfcc35d2 100644 --- a/app/pages/system/silos/SilosPage.tsx +++ b/app/pages/system/silos/SilosPage.tsx @@ -15,13 +15,6 @@ import { usePrefetchedApiQuery, type Silo, } from '@oxide/api' -import { - BooleanCell, - DateCell, - linkCell, - useQueryTable, - type MenuAction, -} from '@oxide/table' import { Badge, buttonStyle, @@ -32,6 +25,11 @@ import { TableActions, } from '@oxide/ui' +import { BooleanCell } from '~/table/cells/BooleanCell' +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 { useQuickActions } from 'app/hooks/use-quick-actions' import { confirmDelete } from 'app/stores/confirm-delete' import { pb } from 'app/util/path-builder' diff --git a/app/table/QueryTable.tsx b/app/table/QueryTable.tsx index f53effeb36..e45934fff3 100644 --- a/app/table/QueryTable.tsx +++ b/app/table/QueryTable.tsx @@ -37,8 +37,9 @@ import { invariant, isOneOf } from '@oxide/util' import { Pagination } from '~/components/Pagination' import { usePagination } from '~/hooks/use-pagination' -import { DefaultCell } from './cells' -import { getActionsCol, getMultiSelectCol, getSelectCol, type MakeActions } from './columns' +import { DefaultCell } from './cells/DefaultCell' +import { getActionsCol, type MakeActions } from './columns/action-col' +import { getMultiSelectCol, getSelectCol } from './columns/select-col' import { Table } from './Table' interface UseQueryTableResult> { diff --git a/app/table/cells/index.ts b/app/table/cells/index.ts deleted file mode 100644 index 1034543f0a..0000000000 --- a/app/table/cells/index.ts +++ /dev/null @@ -1,25 +0,0 @@ -/* - * This Source Code Form is subject to the terms of the Mozilla Public - * License, v. 2.0. If a copy of the MPL was not distributed with this - * file, you can obtain one at https://mozilla.org/MPL/2.0/. - * - * Copyright Oxide Computer Company - */ - -export * from './BooleanCell' -export * from './Cell' -export * from './DateCell' -export * from './DefaultCell' -export * from './EnabledCell' -export * from './EmptyCell' -export * from './FirewallFilterCell' -export * from './InstanceLinkCell' -export * from './InstanceResourceCell' -export * from './InstanceStatusCell' -export * from './LabelCell' -export * from './LinkCell' -export * from './SizeCell' -export * from './TruncateCell' -export * from './TwoLineCell' -export * from './TypeValueCell' -export * from './TypeValueListCell' diff --git a/app/table/columns/index.ts b/app/table/columns/index.ts deleted file mode 100644 index b704f0ba0c..0000000000 --- a/app/table/columns/index.ts +++ /dev/null @@ -1,10 +0,0 @@ -/* - * This Source Code Form is subject to the terms of the Mozilla Public - * License, v. 2.0. If a copy of the MPL was not distributed with this - * file, you can obtain one at https://mozilla.org/MPL/2.0/. - * - * Copyright Oxide Computer Company - */ - -export * from './action-col' -export * from './select-col' diff --git a/app/table/index.ts b/app/table/index.ts deleted file mode 100644 index e54759a085..0000000000 --- a/app/table/index.ts +++ /dev/null @@ -1,13 +0,0 @@ -/* - * This Source Code Form is subject to the terms of the Mozilla Public - * License, v. 2.0. If a copy of the MPL was not distributed with this - * file, you can obtain one at https://mozilla.org/MPL/2.0/. - * - * Copyright Oxide Computer Company - */ - -export * from './cells' -export * from './columns' -export * from './QueryTable' -export * from './react-table' -export * from './Table' diff --git a/app/table/react-table.ts b/app/table/react-table.ts deleted file mode 100644 index 4cafd21b9d..0000000000 --- a/app/table/react-table.ts +++ /dev/null @@ -1,31 +0,0 @@ -/* - * This Source Code Form is subject to the terms of the Mozilla Public - * License, v. 2.0. If a copy of the MPL was not distributed with this - * file, you can obtain one at https://mozilla.org/MPL/2.0/. - * - * Copyright Oxide Computer Company - */ -import { - createColumnHelper, - getCoreRowModel, - useReactTable as useReactTableOrig, - type CellContext, - type RowData, - type TableOptions, -} from '@tanstack/react-table' - -/** - * Exactly the same as the default `useReactTable` except it handles - * `getCoreRowModel` for you. - */ -export const useReactTable = ( - options: Omit, 'getCoreRowModel'> -) => useReactTableOrig({ ...options, getCoreRowModel: getCoreRowModel() }) - -// The goal here is to re-export everything we need from RT in app/ so we can -// import from here only. If you find yourself importing from RT directly, add -// that export here. - -export { createColumnHelper } - -export type { CellContext } diff --git a/tsconfig.json b/tsconfig.json index 68a55889a6..30224f226d 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -18,8 +18,7 @@ "@oxide/api": ["app/api/index.ts"], "@oxide/api-mocks": ["mock-api/index.ts"], "@oxide/ui": ["app/ui/index.ts"], - "@oxide/util": ["app/util/index.ts"], - "@oxide/table": ["app/table/index.ts"] + "@oxide/util": ["app/util/index.ts"] }, "resolveJsonModule": true, "rootDir": ".",