From 6f8789b9aad0f74b7e8a711b505bf4ba05c10ed7 Mon Sep 17 00:00:00 2001
From: filtered <176114999+webfiltered@users.noreply.github.com>
Date: Wed, 22 Oct 2025 04:30:52 +1100
Subject: [PATCH] Fix asset path resolution in desktop GPU picker (#6178)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary

Fixes regression where desktop UI GPU picker images failed to load due
to incorrect absolute path resolution.

## Changes

- **What**: Converts absolute image paths to relative paths with `./`
prefix in GpuPicker component
- **Breaking**: None

## Review Focus

ESLint rule incorrectly flagged relative paths as errors, leading to use
of absolute paths that don't resolve correctly in desktop app context.

The change is just adding `.` to the start of two lines. ESLint rules
reorganised the rest.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6178-Fix-asset-path-resolution-in-desktop-GPU-picker-2936d73d3650814e9d0df9faf8e28733)
by [Unito](https://www.unito.io)
---
 .../src/components/install/GpuPicker.vue       | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/apps/desktop-ui/src/components/install/GpuPicker.vue b/apps/desktop-ui/src/components/install/GpuPicker.vue
index 0a8cac0a9..98dddb762 100644
--- a/apps/desktop-ui/src/components/install/GpuPicker.vue
+++ b/apps/desktop-ui/src/components/install/GpuPicker.vue
@@ -1,17 +1,17 @@
 <template>
   <div
-    class="grid grid-rows-[1fr_auto_auto_1fr] w-full max-w-3xl mx-auto h-[40rem] select-none"
+    class="mx-auto grid h-[40rem] w-full max-w-3xl grid-rows-[1fr_auto_auto_1fr] select-none"
   >
-    <h2 class="font-inter font-bold text-3xl text-neutral-100 text-center">
+    <h2 class="text-center font-inter text-3xl font-bold text-neutral-100">
       {{ $t('install.gpuPicker.title') }}
     </h2>
 
     <!-- GPU Selection buttons - takes up remaining space and centers content -->
-    <div class="flex-1 flex gap-8 justify-center items-center">
+    <div class="flex flex-1 items-center justify-center gap-8">
       <!-- Apple Metal / NVIDIA -->
       <HardwareOption
         v-if="platform === 'darwin'"
-        :image-path="'/assets/images/apple-mps-logo.png'"
+        :image-path="'./assets/images/apple-mps-logo.png'"
         placeholder-text="Apple Metal"
         subtitle="Apple Metal"
         :value="'mps'"
@@ -21,7 +21,7 @@
       />
       <HardwareOption
         v-else
-        :image-path="'/assets/images/nvidia-logo-square.jpg'"
+        :image-path="'./assets/images/nvidia-logo-square.jpg'"
         placeholder-text="NVIDIA"
         :subtitle="$t('install.gpuPicker.nvidiaSubtitle')"
         :value="'nvidia'"
@@ -47,17 +47,17 @@
       />
     </div>
 
-    <div class="pt-12 px-24 h-16">
+    <div class="h-16 px-24 pt-12">
       <div v-show="showRecommendedBadge" class="flex items-center gap-2">
         <Tag
           :value="$t('install.gpuPicker.recommended')"
-          class="bg-neutral-300 text-neutral-900 rounded-full text-sm font-bold px-2 py-[1px]"
+          class="rounded-full bg-neutral-300 px-2 py-[1px] text-sm font-bold text-neutral-900"
         />
-        <i class="icon-[lucide--badge-check] text-neutral-300 text-lg" />
+        <i class="icon-[lucide--badge-check] text-lg text-neutral-300" />
       </div>
     </div>
 
-    <div class="text-neutral-300 px-24">
+    <div class="px-24 text-neutral-300">
       <p v-show="descriptionText" class="leading-relaxed">
         {{ descriptionText }}
       </p>