From b28374867aa3fd3ff546cd7692939e4bfbb3f0af Mon Sep 17 00:00:00 2001
From: onenewcode <lovestudy@qq.com>
Date: Mon, 14 Sep 2026 12:40:29 +0800
Subject: [PATCH] fix(settings): align about-page import/export icon semantics

---
 .../settings/SettingsTransferPanel.vue        |  4 +--
 .../app-tests/settingsTransferPanel.test.ts   | 31 +++++++++++++++++++
 2 files changed, 33 insertions(+), 2 deletions(-)
 create mode 100644 packages/app-tests/settingsTransferPanel.test.ts

diff --git a/apps/desktop/src/components/settings/SettingsTransferPanel.vue b/apps/desktop/src/components/settings/SettingsTransferPanel.vue
index c54be3b1f..b93ece59b 100644
--- a/apps/desktop/src/components/settings/SettingsTransferPanel.vue
+++ b/apps/desktop/src/components/settings/SettingsTransferPanel.vue
@@ -253,12 +253,12 @@ function confirmImport() {
       <div class="settings-about-section-actions flex shrink-0 flex-wrap items-center gap-2">
         <Button type="button" variant="outline" size="sm" class="shrink-0" :disabled="busy" @click="onExportClick">
           <Loader2 v-if="exporting" class="mr-1 h-3.5 w-3.5 animate-spin" />
-          <Download v-else class="mr-1 h-3.5 w-3.5" />
+          <Upload v-else class="mr-1 h-3.5 w-3.5" />
           {{ t("settings.settingsTransferExport") }}
         </Button>
         <Button type="button" variant="outline" size="sm" class="shrink-0" :disabled="busy" @click="onImportClick">
           <Loader2 v-if="importing" class="mr-1 h-3.5 w-3.5 animate-spin" />
-          <Upload v-else class="mr-1 h-3.5 w-3.5" />
+          <Download v-else class="mr-1 h-3.5 w-3.5" />
           {{ t("settings.settingsTransferImport") }}
         </Button>
       </div>
diff --git a/packages/app-tests/settingsTransferPanel.test.ts b/packages/app-tests/settingsTransferPanel.test.ts
new file mode 100644
index 000000000..5077f3957
--- /dev/null
+++ b/packages/app-tests/settingsTransferPanel.test.ts
@@ -0,0 +1,31 @@
+import assert from "node:assert/strict";
+import { readFileSync } from "node:fs";
+import { test } from "vitest";
+import { compileScript, compileTemplate, parse } from "vue/compiler-sfc";
+
+const panelPath = "apps/desktop/src/components/settings/SettingsTransferPanel.vue";
+
+function source(path: string): string {
+  return readFileSync(path, "utf8");
+}
+
+test("settings transfer panel SFC compiles", () => {
+  const { descriptor, errors } = parse(source(panelPath), { filename: panelPath });
+  assert.deepEqual(errors, [], `${panelPath} should parse without SFC errors`);
+  assert.ok(descriptor.scriptSetup, `${panelPath} should have a script setup block`);
+  compileScript(descriptor, { id: panelPath });
+  assert.ok(descriptor.template, `${panelPath} should have a template`);
+  const result = compileTemplate({ id: panelPath, filename: panelPath, source: descriptor.template.content });
+  assert.deepEqual(result.errors, [], `${panelPath} template should compile`);
+});
+
+test("about-page settings transfer buttons follow local-container icon semantics", () => {
+  const panel = source(panelPath);
+
+  // Treat the app as a local container: import brings data in (Download),
+  // export sends data out (Upload). Same contract as SQL library / formatter.
+  assert.match(panel, /@click="onImportClick"[\s\S]{0,200}<Download v-else/);
+  assert.match(panel, /@click="onExportClick"[\s\S]{0,200}<Upload v-else/);
+  assert.doesNotMatch(panel, /@click="onImportClick"[\s\S]{0,200}<Upload v-else/);
+  assert.doesNotMatch(panel, /@click="onExportClick"[\s\S]{0,200}<Download v-else/);
+});