chore: add missing delete action (#1317)

The disk image details page didn't have any actions, which is different from
every other details page. This adds actions, but only Delete since the other
actions are essentially just links to tabs here.

Fixes #1299.

Signed-off-by: Tim deBoer <[email protected]>

Author: deboer-tim

packages/frontend/src/lib/disk-image/DiskImageActions.svelte

@@ -33,10 +33,12 @@ onMount(async () => {
 });
 </script>
 
-<!-- Only show the Terminal button if object.arch actually exists or else we will not be able to pass in the architecture information to the build correctly.
-Only show if on macOS as well as that is the only option we support at the moment -->
-{#if object.arch && !isWindows}
-  <ListItemButtonIcon title="Launch VM" onClick={gotoVM} detailed={detailed} icon={faTerminal} />
+{#if !detailed}
+  <!-- Only show the Terminal button if object.arch actually exists or else we will not be able to pass in the architecture information to the build correctly.
+  Only show if on macOS as well as that is the only option we support at the moment -->
+  {#if object.arch && !isWindows}
+    <ListItemButtonIcon title="Launch VM" onClick={gotoVM} detailed={detailed} icon={faTerminal} />
+  {/if}
+  <ListItemButtonIcon title="Build Logs" onClick={gotoLogs} detailed={detailed} icon={faFileAlt} />
 {/if}
-<ListItemButtonIcon title="Build Logs" onClick={gotoLogs} detailed={detailed} icon={faFileAlt} />
 <ListItemButtonIcon title="Delete Build" onClick={deleteBuild} detailed={detailed} icon={faTrash} />

packages/frontend/src/lib/disk-image/DiskImageDetails.svelte

@@ -13,6 +13,7 @@ import { goToDiskImages } from '../navigation';
 import DiskImageDetailsVirtualMachine from './DiskImageDetailsVirtualMachine.svelte';
 import type { Unsubscriber } from 'svelte/store';
 import { bootcClient } from '/@/api/client';
+import DiskImageActions from './DiskImageActions.svelte';
 
 interface Props {
   id: string;
@@ -61,6 +62,11 @@ onDestroy(() => {
   onclose={goToDiskImages}
   onbreadcrumbClick={goToDiskImages}>
   <DiskImageIcon slot="icon" size="30px" />
+  <svelte:fragment slot="actions">
+    {#if diskImage}
+      <DiskImageActions object={diskImage} detailed={true} />
+    {/if}
+  </svelte:fragment>
   <svelte:fragment slot="tabs">
     <Tab title="Summary" selected={isTabSelected($router.path, 'summary')} url={getTabUrl($router.path, 'summary')} />
     <Tab title="Build Log" selected={isTabSelected($router.path, 'build')} url={getTabUrl($router.path, 'build')} />