diff --git a/app/pages/project/instances/instance/tabs/StorageTab.tsx b/app/pages/project/instances/instance/tabs/StorageTab.tsx index 8008d5aed..610e0aa70 100644 --- a/app/pages/project/instances/instance/tabs/StorageTab.tsx +++ b/app/pages/project/instances/instance/tabs/StorageTab.tsx @@ -87,7 +87,7 @@ export function Component() { [instanceName, project] ) - const { mutate: detachDisk } = useApiMutation('instanceDiskDetach', { + const { mutateAsync: detachDisk } = useApiMutation('instanceDiskDetach', { onSuccess(disk) { queryClient.invalidateQueries('instanceDiskList') addToast(<>Disk {disk.name} detached) // prettier-ignore @@ -257,9 +257,15 @@ export function Component() { detached ), - onActivate() { - detachDisk({ body: { disk: disk.name }, path: { instance: instance.id } }) - }, + onActivate: () => + confirmAction({ + doAction: () => + detachDisk({ body: { disk: disk.name }, path: { instance: instance.id } }), + errorTitle: 'Could not detach disk', + modalTitle: 'Confirm detach disk', + modalContent:

Are you sure you want to detach {disk.name}?

, // prettier-ignore + actionType: 'danger', + }), }, ], [detachDisk, instanceUpdate, instance, getSnapshotAction, bootDisks, ncpus, memory] diff --git a/test/e2e/instance-disks.e2e.ts b/test/e2e/instance-disks.e2e.ts index b53e872e4..0c6a08010 100644 --- a/test/e2e/instance-disks.e2e.ts +++ b/test/e2e/instance-disks.e2e.ts @@ -138,6 +138,7 @@ test('Detach disk', async ({ page }) => { await expect(successMsg).toBeHidden() await clickRowAction(page, 'disk-2', 'Detach') + await page.getByRole('button', { name: 'Confirm' }).click() await expect(successMsg).toBeVisible() await expect(row).toBeHidden() // disk row goes away }) @@ -202,6 +203,7 @@ test('Change boot disk', async ({ page }) => { // detach disk so there's only one await clickRowAction(page, 'disk-2', 'Detach') + await page.getByRole('button', { name: 'Confirm' }).click() await expect(page.getByText('Instance will boot from disk-1')).toBeVisible() @@ -219,6 +221,8 @@ test('Change boot disk', async ({ page }) => { await expectRowVisible(otherDisksTable, disk1) await clickRowAction(page, 'disk-1', 'Detach') + await page.getByRole('button', { name: 'Confirm' }).click() + await expect(noBootDisk).toBeVisible() await expect(noOtherDisks).toBeVisible()