feat(settings): DirectML GPU acceleration package card (P2)

Mirrors the NPU package card, shown only when hardware_status marks DirectML
applicable; downloads model+runtime via download_directml_package and reloads
hardware to flip to Ready.
This commit is contained in:
iamdoubz committed 2026-07-06 07:21:51 -05:00
1 parent 1b743dad67
commit 1b74e0b320
1 file changed
+48
+48
View File
@@ -269,6 +269,25 @@
}
}
// ---- DirectML package download (P2) ----
// ponytail: the await resolves when model+runtime are both staged, so the
// busy flag is the whole progress story here — no % listener like NPU has.
let dmlBusy = $state(false);
let dmlMsg = $state<string | null>(null);
async function downloadDirectmlPackage() {
dmlBusy = true;
dmlMsg = "Downloading…";
try {
await api.downloadDirectmlPackage();
await settings.loadHardware();
dmlMsg = "DirectML package ready.";
} catch (e) {
dmlMsg = `Failed: ${errorMessage(e)}`;
} finally {
dmlBusy = false;
}
}
onMount(() => {
settings.load();
calendar.load();
@@ -486,6 +505,35 @@
{#if npuMsg}<p class="muted npu-status">{npuMsg}</p>{/if}
</div>
{/if}
{#if settings.hardware.directml?.applicable}
{@const dml = settings.hardware.directml}
{@const dmlReady = dml.runtimeReady && dml.modelInstalled}
<!-- ponytail: reuses the .npu-package layout styles (shared accel card). -->
<div class="npu-package">
<div class="row">
<Cpu size={14} aria-hidden="true" />
<strong>GPU acceleration (DirectML)</strong>
{#if dmlReady}
<span class="badge ok"><Check size={12} aria-hidden="true" /> Ready</span>
{:else if dmlBusy}
<span class="badge busy">Downloading…</span>
{:else}
<span class="badge">Package needed</span>
{/if}
</div>
{#if !dmlReady}
<p class="muted">
Your GPU can be accelerated without Vulkan via DirectML — a one-time package
(Whisper ONNX model{dml.runtimeReady ? "" : " + DirectML runtime"}).
</p>
<button onclick={downloadDirectmlPackage} disabled={dmlBusy}>
{dmlBusy ? "Downloading…" : "Download DirectML package"}
</button>
{/if}
{#if dmlMsg}<p class="muted npu-status">{dmlMsg}</p>{/if}
</div>
{/if}
{:else}
<p class="muted">Hardware detection unavailable.</p>
{/if}