From 062daf3093bd69a74eb51c220d1aec206f65229e Mon Sep 17 00:00:00 2001
From: Ez <32764974+cheshireez@users.noreply.github.com>
Date: Sat, 8 Aug 2026 11:33:37 +0800
Subject: [PATCH] fix(web): make logo and icon assets base-path aware

---
 apps/desktop/src/components/editor/EditorSettingsDialog.vue | 6 +++---
 apps/desktop/src/components/icons/AppLogo.vue               | 3 ++-
 apps/desktop/src/lib/__tests__/common/webPath.spec.ts       | 4 ++++
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/apps/desktop/src/components/editor/EditorSettingsDialog.vue b/apps/desktop/src/components/editor/EditorSettingsDialog.vue
index 91859353eb..16a2d38c0a 100644
--- a/apps/desktop/src/components/editor/EditorSettingsDialog.vue
+++ b/apps/desktop/src/components/editor/EditorSettingsDialog.vue
@@ -126,7 +126,7 @@ import { currentLocale, setLocale, type Locale } from "@/i18n";
 import { SETTINGS_SEARCH_DEFINITIONS, TOOLBAR_VISIBILITY_ITEMS, createShortcutSettingsSearchDefinitions, resolveSettingsSearchEntries, searchSettings, toolbarVisibilityItemLabel, type SettingsCategory, type SettingsSearchEntry, type ToolbarVisibilityItem } from "@/lib/settings/settingsSearch";
 import { LOCALE_OPTIONS } from "@/lib/app/localeOptions";
 import { DEFAULT_WEB_DAV_AUTO_UPLOAD_INTERVAL_MINUTES, DEFAULT_WEB_DAV_REMOTE_PATH, normalizedWebDavAutoUploadInterval, writeWebDavAutoUploadFields } from "@/lib/webdav/webdavAutoUploadConfig";
-import { apiUrl } from "@/lib/common/webPath";
+import { apiUrl, webPath } from "@/lib/common/webPath";
 import { DEFAULT_DATA_GRID_FONT_FAMILY, DEFAULT_UI_FONT_FAMILY, normalizeCustomFontFamilyInput, readableFontFamily, SYSTEM_UI_FONT_FAMILY } from "@/lib/app/appFonts";
 import { buildFontFamilyOptions, displayFontFamily, isPresetFontFamily, loadSystemFontNames } from "@/lib/app/fontFamilyOptions";
 import { buildAppSupportInfoRows, formatAppSupportInfoForClipboard, type AppSupportInfoLabels } from "@/lib/app/supportInfo";
@@ -4213,7 +4213,7 @@ onUnmounted(() => {
                 <div class="settings-appearance-choice-grid">
                   <Button type="button" variant="outline" class="settings-choice-card h-auto justify-start border p-3" :class="editIconTheme === 'default' ? 'dbx-choice-selected' : ''" @click="setIconTheme('default')">
                     <div class="flex items-center gap-3 text-left w-full min-w-0">
-                      <img src="/icon-preview-default.png" alt="DBX" class="h-12 w-12 shrink-0" />
+                      <img :src="webPath('/icon-preview-default.png')" alt="DBX" class="h-12 w-12 shrink-0" />
                       <TooltipProvider>
                         <Tooltip>
                           <TooltipTrigger as-child>
@@ -4235,7 +4235,7 @@ onUnmounted(() => {
                   </Button>
                   <Button type="button" variant="outline" class="settings-choice-card h-auto justify-start border p-3" :class="editIconTheme === 'black' ? 'dbx-choice-selected' : ''" @click="setIconTheme('black')">
                     <div class="flex items-center gap-3 text-left w-full min-w-0">
-                      <img src="/icon-preview-black.png" alt="DBX" class="h-12 w-12 shrink-0" />
+                      <img :src="webPath('/icon-preview-black.png')" alt="DBX" class="h-12 w-12 shrink-0" />
                       <TooltipProvider>
                         <Tooltip>
                           <TooltipTrigger as-child>
diff --git a/apps/desktop/src/components/icons/AppLogo.vue b/apps/desktop/src/components/icons/AppLogo.vue
index d25684c0a4..6d8a1d1ee1 100644
--- a/apps/desktop/src/components/icons/AppLogo.vue
+++ b/apps/desktop/src/components/icons/AppLogo.vue
@@ -1,10 +1,11 @@
 <script setup lang="ts">
 import { computed } from "vue";
 import { useSettingsStore } from "@/stores/settingsStore";
+import { webPath } from "@/lib/common/webPath";
 
 const settingsStore = useSettingsStore();
 const isBlackLogo = computed(() => settingsStore.desktopSettings.icon_theme === "black");
-const logoSrc = computed(() => (isBlackLogo.value ? "/logo-black.png" : "/logo.png"));
+const logoSrc = computed(() => webPath(isBlackLogo.value ? "/logo-black.png" : "/logo.png"));
 </script>
 
 <template>
diff --git a/apps/desktop/src/lib/__tests__/common/webPath.spec.ts b/apps/desktop/src/lib/__tests__/common/webPath.spec.ts
index e6ea717a52..bfddfed0bd 100644
--- a/apps/desktop/src/lib/__tests__/common/webPath.spec.ts
+++ b/apps/desktop/src/lib/__tests__/common/webPath.spec.ts
@@ -13,6 +13,10 @@ describe("webPath", () => {
     expect(webPath("/", "/dbx")).toBe("/dbx/");
     expect(webPath("/icons/database/mysql.svg", "/dbx")).toBe("/dbx/icons/database/mysql.svg");
     expect(webPath("/icons/ai/openai.svg", "/dbx")).toBe("/dbx/icons/ai/openai.svg");
+    expect(webPath("/logo.png", "/dbx")).toBe("/dbx/logo.png");
+    expect(webPath("/logo-black.png", "/dbx")).toBe("/dbx/logo-black.png");
+    expect(webPath("/icon-preview-default.png", "/dbx")).toBe("/dbx/icon-preview-default.png");
+    expect(webPath("/icon-preview-black.png", "/dbx")).toBe("/dbx/icon-preview-black.png");
     expect(apiUrl("/auth/check", "/dbx")).toBe("/dbx/api/auth/check");
     expect(apiUrl("/api/auth/check", "/dbx")).toBe("/dbx/api/auth/check");
     expect(apiUrl("api/auth/check", "/dbx")).toBe("/dbx/api/auth/check");