put in missing quick actions on VPC child tabs

Author: david-crespo

app/pages/project/vpcs/VpcFirewallRulesTab.tsx

@@ -22,6 +22,7 @@ import {
 import { ListPlusCell } from '~/components/ListPlusCell'
 import { ProtocolBadge } from '~/components/ProtocolBadge'
 import { getVpcSelector, useVpcSelector } from '~/hooks/use-params'
+import { useQuickActions } from '~/hooks/use-quick-actions'
 import { confirmDelete } from '~/stores/confirm-delete'
 import { EnabledCell } from '~/table/cells/EnabledCell'
 import { LinkCell } from '~/table/cells/LinkCell'
@@ -169,6 +170,22 @@ export default function VpcFirewallRulesTab() {
 
   const table = useReactTable({ columns, data: rules, getCoreRowModel: getCoreRowModel() })
 
+  useQuickActions(
+    () => [
+      {
+        value: 'New firewall rule',
+        navGroup: 'Actions',
+        action: pb.vpcFirewallRulesNew(vpcSelector),
+      },
+      ...rules.map((r) => ({
+        value: r.name,
+        navGroup: 'Edit firewall rule',
+        action: pb.vpcFirewallRuleEdit({ ...vpcSelector, rule: r.name }),
+      })),
+    ],
+    [vpcSelector, rules]
+  )
+
   const emptyState = (
     <TableEmptyBox>
       <EmptyMessage

app/pages/project/vpcs/VpcRoutersTab.tsx

@@ -14,6 +14,7 @@ import { api, getListQFn, q, queryClient, useApiMutation, type VpcRouter } from
 import { HL } from '~/components/HL'
 import { routeFormMessage } from '~/forms/vpc-router-route-common'
 import { getVpcSelector, useVpcSelector } from '~/hooks/use-params'
+import { useQuickActions } from '~/hooks/use-quick-actions'
 import { confirmDelete } from '~/stores/confirm-delete'
 import { addToast } from '~/stores/toast'
 import { makeLinkCell } from '~/table/cells/LinkCell'
@@ -103,12 +104,28 @@ export default function VpcRoutersTab() {
   )
 
   const columns = useColsWithActions(staticColumns, makeActions)
-  const { table } = useQueryTable({
+  const { table, query } = useQueryTable({
     query: vpcRouterList({ project, vpc }),
     columns,
     emptyState,
   })
 
+  useQuickActions(
+    () => [
+      {
+        value: 'New router',
+        navGroup: 'Actions',
+        action: pb.vpcRoutersNew({ project, vpc }),
+      },
+      ...(query.data?.items || []).map((r) => ({
+        value: r.name,
+        navGroup: 'Edit router',
+        action: pb.vpcRouterEdit({ project, vpc, router: r.name }),
+      })),
+    ],
+    [project, vpc, query.data]
+  )
+
   return (
     <>
       <div className="mb-3 flex justify-end space-x-2">

app/pages/project/vpcs/VpcSubnetsTab.tsx

@@ -12,6 +12,7 @@ import { Outlet, type LoaderFunctionArgs } from 'react-router'
 import { api, getListQFn, queryClient, useApiMutation, type VpcSubnet } from '@oxide/api'
 
 import { getVpcSelector, useVpcSelector } from '~/hooks/use-params'
+import { useQuickActions } from '~/hooks/use-quick-actions'
 import { confirmDelete } from '~/stores/confirm-delete'
 import { addToast } from '~/stores/toast'
 import { makeLinkCell } from '~/table/cells/LinkCell'
@@ -96,13 +97,29 @@ export default function VpcSubnetsTab() {
     />
   )
 
-  const { table } = useQueryTable({
+  const { table, query } = useQueryTable({
     query: subnetList(vpcSelector),
     columns,
     emptyState,
     rowHeight: 'large',
   })
 
+  useQuickActions(
+    () => [
+      {
+        value: 'New VPC subnet',
+        navGroup: 'Actions',
+        action: pb.vpcSubnetsNew(vpcSelector),
+      },
+      ...(query.data?.items || []).map((s) => ({
+        value: s.name,
+        navGroup: 'Edit VPC subnet',
+        action: pb.vpcSubnetsEdit({ ...vpcSelector, subnet: s.name }),
+      })),
+    ],
+    [vpcSelector, query.data]
+  )
+
   return (
     <>
       <div className="mb-3 flex justify-end space-x-2">