diff --git a/app/components/form/fields/DisksTableField.tsx b/app/components/form/fields/DisksTableField.tsx index b08bc1794f..e5af57ff36 100644 --- a/app/components/form/fields/DisksTableField.tsx +++ b/app/components/form/fields/DisksTableField.tsx @@ -13,7 +13,6 @@ import type { DiskCreate } from '@oxide/api' import { AttachDiskModalForm } from '~/forms/disk-attach' import { CreateDiskSideModalForm } from '~/forms/disk-create' import type { InstanceCreateInput } from '~/forms/instance-create' -import { EmptyCell } from '~/table/cells/EmptyCell' import { sizeCellInner } from '~/table/columns/common' import { Badge } from '~/ui/lib/Badge' import { Button } from '~/ui/lib/Button' @@ -22,7 +21,7 @@ import { Truncate } from '~/ui/lib/Truncate' export type DiskTableItem = | (DiskCreate & { type: 'create' }) - | { name: string; type: 'attach' } + | { name: string; type: 'attach'; size: number } /** * Designed less for reuse, more to encapsulate logic that would otherwise @@ -61,8 +60,7 @@ export function DisksTableField({ }, { header: 'Size', - cell: (item) => - item.type === 'attach' ? : sizeCellInner(item.size), + cell: (item) => sizeCellInner(item.size), }, ]} rowKey={(item) => item.name} @@ -99,8 +97,8 @@ export function DisksTableField({ {showDiskAttach && ( setShowDiskAttach(false)} - onSubmit={(values) => { - onChange([...items, { type: 'attach', ...values }]) + onSubmit={({ name, size }: { name: string; size: number }) => { + onChange([...items, { type: 'attach', name, size } satisfies DiskTableItem]) setShowDiskAttach(false) }} diskNamesToExclude={items.filter((i) => i.type === 'attach').map((i) => i.name)} diff --git a/app/forms/disk-attach.tsx b/app/forms/disk-attach.tsx index f3f07d841a..b35f42735e 100644 --- a/app/forms/disk-attach.tsx +++ b/app/forms/disk-attach.tsx @@ -20,7 +20,7 @@ const defaultValues = { name: '' } type AttachDiskProps = { /** If defined, this overrides the usual mutation */ - onSubmit: (diskAttach: { name: string }) => void + onSubmit: (diskAttach: { name: string; size: number }) => void onDismiss: () => void diskNamesToExclude?: string[] loading?: boolean @@ -64,7 +64,13 @@ export function AttachDiskModalForm({ submitError={submitError} loading={loading} title="Attach disk" - onSubmit={onSubmit} + onSubmit={({ name }) => { + // because the ComboboxField is required and does not allow arbitrary + // values (values not in the list of disks), we can only get here if the + // disk is defined and in the list + const disk = data!.items.find((d) => d.name === name)! + onSubmit({ name, size: disk.size }) + }} > { await selectOption(page, 'Disk name', 'disk-3') await page.getByRole('button', { name: 'Attach disk' }).click() - await expectRowVisible(disksTable, { Name: 'disk-3', Type: 'attach', Size: '—' }) + await expectRowVisible(disksTable, { Name: 'disk-3', Type: 'attach', Size: '6 GiB' }) // Create the instance await page.getByRole('button', { name: 'Create instance' }).click()