From e91ab15e27254223402c68722ec673b5b6d19966 Mon Sep 17 00:00:00 2001
From: chennan <chennan@qiniu.com>
Date: Fri, 6 Feb 2026 16:58:09 +0800
Subject: [PATCH 1/5] mobile reminder

---
 spx-gui/src/App.vue                           |  19 ++-
 .../mobile/DesktopRequiredGuide.vue           | 112 ++++++++++++++++++
 .../components/mobile/desktop-required.png    | Bin 0 -> 18328 bytes
 3 files changed, 129 insertions(+), 2 deletions(-)
 create mode 100644 spx-gui/src/components/mobile/DesktopRequiredGuide.vue
 create mode 100644 spx-gui/src/components/mobile/desktop-required.png

diff --git a/spx-gui/src/App.vue b/spx-gui/src/App.vue
index 21f047d20..3c3c61a14 100644
--- a/spx-gui/src/App.vue
+++ b/spx-gui/src/App.vue
@@ -1,6 +1,7 @@
 <template>
   <UIConfigProvider :config="config">
-    <UIMessageProvider>
+    <DesktopRequiredGuide v-if="isMobile" />
+    <UIMessageProvider v-else>
       <UIModalProvider>
         <CopilotRoot>
           <TutorialRoot>
@@ -17,16 +18,30 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue'
+import { computed, ref, onMounted } from 'vue'
 import { UIConfigProvider, UIModalProvider, UIMessageProvider, type Config } from '@/components/ui'
 import AgentCopilotProvider from '@/components/agent-copilot/CopilotProvider.vue'
 import CopilotRoot from '@/components/copilot/CopilotRoot.vue'
 import CopilotUI from '@/components/copilot/CopilotUI.vue'
 import TutorialRoot from '@/components/tutorials/TutorialRoot.vue'
+import DesktopRequiredGuide from '@/components/mobile/DesktopRequiredGuide.vue'
 import { SpotlightUI } from '@/utils/spotlight'
 import { useI18n } from '@/utils/i18n'
 import { useInstallRouteLoading } from '@/utils/route-loading'
 
+const isMobile = ref(false)
+
+onMounted(() => {
+  // TODO: Consider move to utils/ua.ts, and make more robust detection
+  // Detect mobile devices
+  const userAgent = navigator.userAgent
+  const mobileRegex = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i
+  const isTouchDevice = 'ontouchstart' in window || navigator.maxTouchPoints > 0
+  const isSmallScreen = window.matchMedia('(max-width: 768px)').matches
+
+  isMobile.value = mobileRegex.test(userAgent) || (isTouchDevice && isSmallScreen)
+})
+
 const { t } = useI18n()
 
 const config = computed<Config>(() => ({
diff --git a/spx-gui/src/components/mobile/DesktopRequiredGuide.vue b/spx-gui/src/components/mobile/DesktopRequiredGuide.vue
new file mode 100644
index 000000000..58cf883b9
--- /dev/null
+++ b/spx-gui/src/components/mobile/DesktopRequiredGuide.vue
@@ -0,0 +1,112 @@
+<template>
+  <div class="desktop-required-guide">
+    <div v-if="showCopiedMessage" class="copied-message">
+      <UIIcon type="success" />
+      <span>{{ t({ en: 'Copied to clipboard!', zh: '已复制到剪贴板！' }) }}</span>
+    </div>
+    <div class="guide-img">
+      <img :src="imgDesktopRequired" alt="Desktop Required Image" />
+    </div>
+    <div class="guide-text">
+      <h1>{{ t({ en: 'Desktop Required', zh: '访问限制' }) }}</h1>
+      <p>
+        {{
+          t({
+            en: 'This application is not supported on mobile devices. Please access it from a desktop.',
+            zh: '该功能暂不支持移动端，请使用电脑访问'
+          })
+        }}
+      </p>
+    </div>
+    <UIButton
+      v-if="isClipboardSupported"
+      v-radar="{ name: 'Copy Access URL', desc: 'Button to copy the access URL' }"
+      size="large"
+      icon="copy"
+      @click="copyAccessUrl"
+    >
+      {{ t({ en: 'Copy Access URL', zh: '复制访问地址' }) }}
+    </UIButton>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { useI18n } from '@/utils/i18n'
+import imgDesktopRequired from './desktop-required.png'
+import { UIButton, UIIcon } from '@/components/ui'
+
+const { t } = useI18n()
+
+const isClipboardSupported = !!navigator.clipboard
+const showCopiedMessage = ref(false)
+
+function copyAccessUrl() {
+  if (!navigator.clipboard) return
+  const url = window.location.href
+  navigator.clipboard
+    .writeText(url)
+    .then(() => {
+      showCopiedMessage.value = true
+      setTimeout(() => {
+        showCopiedMessage.value = false
+      }, 2000)
+    })
+    .catch((e) => {
+      // TODO: show error message to user ?
+      console.error('Failed to copy URL:', url, e)
+    })
+}
+</script>
+
+<style lang="scss" scoped>
+.desktop-required-guide {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 40px 60px;
+
+  .guide-img {
+    margin-bottom: 48px;
+    img {
+      width: 240px;
+      height: auto;
+    }
+  }
+
+  .guide-text {
+    margin-bottom: 40px;
+    text-align: center;
+
+    h1 {
+      font-size: 20px;
+      font-weight: 600;
+      color: var(--ui-color-grey-1000);
+      margin-bottom: 12px;
+    }
+
+    p {
+      font-size: 14px;
+      line-height: 22px;
+      color: var(--ui-color-grey-900);
+    }
+  }
+
+  .copied-message {
+    position: fixed;
+    top: 40px;
+    z-index: 1000;
+    border-radius: 8px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+    padding: 12px 20px;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font-size: 14px;
+    color: var(--ui-color-grey-900);
+    animation: fade-in-out 2s forwards;
+  }
+}
+</style>
diff --git a/spx-gui/src/components/mobile/desktop-required.png b/spx-gui/src/components/mobile/desktop-required.png
new file mode 100644
index 0000000000000000000000000000000000000000..392530b76f3e1e1e64d29406f874902ebc8ae076
GIT binary patch
literal 18328
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

literal 0
HcmV?d00001


From 36d60a4b36fd21f906da459f21fab5de2a71d970 Mon Sep 17 00:00:00 2001
From: chennan <chennan@qiniu.com>
Date: Wed, 11 Feb 2026 08:25:54 +0800
Subject: [PATCH 2/5] browser version reminder

---
 spx-gui/package-lock.json                     |  92 ++++++++++++++++++
 spx-gui/package.json                          |   1 +
 spx-gui/src/App.vue                           |  22 ++---
 .../components/ua/BrowserVersionReminder.vue  |  88 +++++++++++++++++
 .../MobileReminder.vue}                       |   6 +-
 .../{mobile => ua}/desktop-required.png       | Bin
 spx-gui/src/utils/ua.ts                       |  41 ++++++++
 7 files changed, 232 insertions(+), 18 deletions(-)
 create mode 100644 spx-gui/src/components/ua/BrowserVersionReminder.vue
 rename spx-gui/src/components/{mobile/DesktopRequiredGuide.vue => ua/MobileReminder.vue} (95%)
 rename spx-gui/src/components/{mobile => ua}/desktop-required.png (100%)
 create mode 100644 spx-gui/src/utils/ua.ts

diff --git a/spx-gui/package-lock.json b/spx-gui/package-lock.json
index 1cc7cce1a..8cfc6a27a 100644
--- a/spx-gui/package-lock.json
+++ b/spx-gui/package-lock.json
@@ -58,6 +58,7 @@
         "shiki": "^3.2.2",
         "sortablejs": "^1.15.6",
         "typescript": "^5.9.3",
+        "ua-parser-js": "^2.0.9",
         "vite": "^6.4.1",
         "vite-plugin-ejs": "^1.7.0",
         "vite-plugin-vercel": "^9.0.8",
@@ -5218,6 +5219,26 @@
         "node": ">=6"
       }
     },
+    "node_modules/detect-europe-js": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/detect-europe-js/-/detect-europe-js-0.1.2.tgz",
+      "integrity": "sha512-lgdERlL3u0aUdHocoouzT10d9I89VVhk0qNRmll7mXdGfJT1/wqZ2ZLA4oJAjeACPY5fT1wsbq2AT+GkuInsow==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/faisalman"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/ua-parser-js"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/faisalman"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/detect-libc": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
@@ -7027,6 +7048,26 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/is-standalone-pwa": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/is-standalone-pwa/-/is-standalone-pwa-0.1.1.tgz",
+      "integrity": "sha512-9Cbovsa52vNQCjdXOzeQq5CnCbAcRk05aU62K20WO372NrTv0NxibLFCK6lQ4/iZEFdEA3p3t2VNOn8AJ53F5g==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/faisalman"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/ua-parser-js"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/faisalman"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/is-stream": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-4.0.1.tgz",
@@ -10345,6 +10386,57 @@
         "typescript": ">=4.8.4 <6.0.0"
       }
     },
+    "node_modules/ua-is-frozen": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/ua-is-frozen/-/ua-is-frozen-0.1.2.tgz",
+      "integrity": "sha512-RwKDW2p3iyWn4UbaxpP2+VxwqXh0jpvdxsYpZ5j/MLLiQOfbsV5shpgQiw93+KMYQPcteeMQ289MaAFzs3G9pw==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/faisalman"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/ua-parser-js"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/faisalman"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/ua-parser-js": {
+      "version": "2.0.9",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-2.0.9.tgz",
+      "integrity": "sha512-OsqGhxyo/wGdLSXMSJxuMGN6H4gDnKz6Fb3IBm4bxZFMnyy0sdf6MN96Ie8tC6z/btdO+Bsy8guxlvLdwT076w==",
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/ua-parser-js"
+        },
+        {
+          "type": "paypal",
+          "url": "https://paypal.me/faisalman"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/faisalman"
+        }
+      ],
+      "license": "AGPL-3.0-or-later",
+      "dependencies": {
+        "detect-europe-js": "^0.1.2",
+        "is-standalone-pwa": "^0.1.1",
+        "ua-is-frozen": "^0.1.2"
+      },
+      "bin": {
+        "ua-parser-js": "script/cli.js"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
     "node_modules/undici-types": {
       "version": "6.21.0",
       "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
diff --git a/spx-gui/package.json b/spx-gui/package.json
index 7bb772f6b..badbbb46d 100644
--- a/spx-gui/package.json
+++ b/spx-gui/package.json
@@ -75,6 +75,7 @@
     "vue-konva": "^3.1.0",
     "vue-router": "^4.2.5",
     "vue-tsc": "^3.1.1",
+    "ua-parser-js": "^2.0.9",
     "zod": "^3.23.8",
     "zod-to-json-schema": "^3.24.1"
   },
diff --git a/spx-gui/src/App.vue b/spx-gui/src/App.vue
index 3c3c61a14..fad928040 100644
--- a/spx-gui/src/App.vue
+++ b/spx-gui/src/App.vue
@@ -1,8 +1,9 @@
 <template>
   <UIConfigProvider :config="config">
-    <DesktopRequiredGuide v-if="isMobile" />
+    <MobileReminder v-if="showMobileReminder" />
     <UIMessageProvider v-else>
       <UIModalProvider>
+        <BrowserVersionReminder />
         <CopilotRoot>
           <TutorialRoot>
             <AgentCopilotProvider>
@@ -18,29 +19,20 @@
 </template>
 
 <script setup lang="ts">
-import { computed, ref, onMounted } from 'vue'
+import { computed } from 'vue'
 import { UIConfigProvider, UIModalProvider, UIMessageProvider, type Config } from '@/components/ui'
 import AgentCopilotProvider from '@/components/agent-copilot/CopilotProvider.vue'
 import CopilotRoot from '@/components/copilot/CopilotRoot.vue'
 import CopilotUI from '@/components/copilot/CopilotUI.vue'
 import TutorialRoot from '@/components/tutorials/TutorialRoot.vue'
-import DesktopRequiredGuide from '@/components/mobile/DesktopRequiredGuide.vue'
+import MobileReminder from '@/components/ua/MobileReminder.vue'
+import BrowserVersionReminder from '@/components/ua/BrowserVersionReminder.vue'
 import { SpotlightUI } from '@/utils/spotlight'
 import { useI18n } from '@/utils/i18n'
 import { useInstallRouteLoading } from '@/utils/route-loading'
+import { isMobile } from '@/utils/ua'
 
-const isMobile = ref(false)
-
-onMounted(() => {
-  // TODO: Consider move to utils/ua.ts, and make more robust detection
-  // Detect mobile devices
-  const userAgent = navigator.userAgent
-  const mobileRegex = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i
-  const isTouchDevice = 'ontouchstart' in window || navigator.maxTouchPoints > 0
-  const isSmallScreen = window.matchMedia('(max-width: 768px)').matches
-
-  isMobile.value = mobileRegex.test(userAgent) || (isTouchDevice && isSmallScreen)
-})
+const showMobileReminder = isMobile()
 
 const { t } = useI18n()
 
diff --git a/spx-gui/src/components/ua/BrowserVersionReminder.vue b/spx-gui/src/components/ua/BrowserVersionReminder.vue
new file mode 100644
index 000000000..5842ec6a3
--- /dev/null
+++ b/spx-gui/src/components/ua/BrowserVersionReminder.vue
@@ -0,0 +1,88 @@
+<template>
+  <UIDialog
+    type="warning"
+    size="small"
+    :visible="visible"
+    :title="$t({ en: 'Browser Version Unsupported', zh: '浏览器版本不支持' })"
+  >
+    <div>{{ $t(content) }}</div>
+    <footer class="footer">
+      <UIButton
+        v-radar="{
+          name: 'Do not show again button',
+          desc: 'Click to close browser version reminder modal and suppress it show again.'
+        }"
+        color="boring"
+        @click="handleDoNotShowAgain"
+      >
+        {{ $t({ en: 'Do not show again', zh: '不再提示' }) }}
+      </UIButton>
+      <UIButton
+        v-radar="{ name: 'Confirm button', desc: 'Click to close browser version reminder modal' }"
+        color="primary"
+        @click="handleConfirm"
+      >
+        {{ $t({ en: 'Got it', zh: '我知道了' }) }}
+      </UIButton>
+    </footer>
+  </UIDialog>
+</template>
+
+<script setup lang="ts">
+import { onMounted, ref } from 'vue'
+import { checkBrowserVersion } from '@/utils/ua.ts'
+import { type LocaleMessage } from '@/utils/i18n'
+import UIDialog from '@/components/ui/dialog/UIDialog.vue'
+import UIButton from '../ui/UIButton.vue'
+
+const defaultTip: LocaleMessage = {
+  en: 'Your browser version may not support all features. Please update your browser for the best experience.',
+  zh: '您的浏览器版本可能无法支持全部功能，建议更新浏览器以获得最佳体验。'
+}
+
+const visible = ref(false)
+const content = ref(defaultTip)
+
+const localStorageKey = 'spx-gui-browser-version-reminder-ignored'
+
+function handleDoNotShowAgain() {
+  visible.value = false
+  localStorage.setItem(localStorageKey, 'true')
+}
+
+function handleConfirm() {
+  visible.value = false
+}
+
+onMounted(() => {
+  const isIgnored = localStorage.getItem(localStorageKey)
+  if (isIgnored === 'true') return
+
+  const checkResult = checkBrowserVersion()
+  if (checkResult.ok) return
+
+  if (checkResult.browserName == null) {
+    const { recommendedBrowser, recommendedVersion } = checkResult
+    content.value = {
+      en: `Your browser may not support all features. For the best experience, please use ${recommendedBrowser} (version ${recommendedVersion} or later).`,
+      zh: `您的浏览器可能无法支持全部功能，建议使用 ${recommendedBrowser}（${recommendedVersion} 或更高版本）以获得最佳体验。`
+    }
+  } else {
+    const { recommendedVersion } = checkResult
+    content.value = {
+      en: `Your browser version may not support all features. Please update to version ${recommendedVersion} or later for the best experience.`,
+      zh: `您的浏览器版本可能无法支持全部功能，建议更新到 ${recommendedVersion} 或更高版本以获得最佳体验。`
+    }
+  }
+  visible.value = true
+})
+</script>
+
+<style scoped lang="scss">
+.footer {
+  display: flex;
+  justify-content: flex-end;
+  gap: 12px;
+  margin-top: 24px;
+}
+</style>
diff --git a/spx-gui/src/components/mobile/DesktopRequiredGuide.vue b/spx-gui/src/components/ua/MobileReminder.vue
similarity index 95%
rename from spx-gui/src/components/mobile/DesktopRequiredGuide.vue
rename to spx-gui/src/components/ua/MobileReminder.vue
index 58cf883b9..37c08509e 100644
--- a/spx-gui/src/components/mobile/DesktopRequiredGuide.vue
+++ b/spx-gui/src/components/ua/MobileReminder.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="desktop-required-guide">
+  <div class="mobile-reminder">
     <div v-if="showCopiedMessage" class="copied-message">
       <UIIcon type="success" />
       <span>{{ t({ en: 'Copied to clipboard!', zh: '已复制到剪贴板！' }) }}</span>
@@ -13,7 +13,7 @@
         {{
           t({
             en: 'This application is not supported on mobile devices. Please access it from a desktop.',
-            zh: '该功能暂不支持移动端，请使用电脑访问'
+            zh: '该应用暂不支持移动端，请使用电脑访问'
           })
         }}
       </p>
@@ -60,7 +60,7 @@ function copyAccessUrl() {
 </script>
 
 <style lang="scss" scoped>
-.desktop-required-guide {
+.mobile-reminder {
   min-height: 100vh;
   display: flex;
   flex-direction: column;
diff --git a/spx-gui/src/components/mobile/desktop-required.png b/spx-gui/src/components/ua/desktop-required.png
similarity index 100%
rename from spx-gui/src/components/mobile/desktop-required.png
rename to spx-gui/src/components/ua/desktop-required.png
diff --git a/spx-gui/src/utils/ua.ts b/spx-gui/src/utils/ua.ts
new file mode 100644
index 000000000..45d780e53
--- /dev/null
+++ b/spx-gui/src/utils/ua.ts
@@ -0,0 +1,41 @@
+import { UAParser } from 'ua-parser-js'
+import { BrowserName } from 'ua-parser-js/enums'
+
+const ua = UAParser(navigator.userAgent)
+
+export default ua
+
+export function isMobile() {
+  return ua.device.type === 'mobile' || ua.device.type === 'tablet'
+}
+
+// Minimum recommended browser versions, consistent with `browserslist` in package.json
+const recommendedBrowserVersions: Record<string, number> = {
+  [BrowserName.CHROME]: 111,
+  [BrowserName.EDGE]: 111,
+  [BrowserName.FIREFOX]: 113,
+  [BrowserName.SAFARI]: 16.4
+}
+
+export type BrowserCheckResult =
+  | { ok: true }
+  | { ok: false; browserName: string; recommendedVersion: number }
+  | { ok: false; browserName: null; recommendedBrowser: string; recommendedVersion: number }
+
+export function checkBrowserVersion(): BrowserCheckResult {
+  const browserName = ua.browser.name
+  if (!browserName || !(browserName in recommendedBrowserVersions)) {
+    return {
+      ok: false,
+      browserName: null,
+      recommendedBrowser: BrowserName.CHROME,
+      recommendedVersion: recommendedBrowserVersions[BrowserName.CHROME]
+    }
+  }
+  const recommendedVersion = recommendedBrowserVersions[browserName]
+  const browserVersion = parseFloat(ua.browser.version || '0')
+  if (browserVersion >= recommendedVersion) {
+    return { ok: true }
+  }
+  return { ok: false, browserName, recommendedVersion }
+}

From 3791a401171c3a099f7550d2a42bea0ed3d8745e Mon Sep 17 00:00:00 2001
From: chennan <chennan@qiniu.com>
Date: Wed, 11 Feb 2026 11:48:45 +0800
Subject: [PATCH 3/5] use ua-parser-js 1.x

---
 spx-gui/package-lock.json                     | 82 +++----------------
 spx-gui/package.json                          |  3 +-
 spx-gui/src/App.vue                           |  6 +-
 .../components/ua/BrowserVersionReminder.vue  |  6 +-
 spx-gui/src/components/ua/MobileReminder.vue  | 47 ++---------
 spx-gui/src/utils/ua.ts                       | 14 +++-
 6 files changed, 39 insertions(+), 119 deletions(-)

diff --git a/spx-gui/package-lock.json b/spx-gui/package-lock.json
index 8cfc6a27a..4aef4f8a7 100644
--- a/spx-gui/package-lock.json
+++ b/spx-gui/package-lock.json
@@ -22,6 +22,7 @@
         "@types/file-saver": "^2.0.7",
         "@types/node": "^24.10.1",
         "@types/sortablejs": "^1.15.8",
+        "@types/ua-parser-js": "^0.7.36",
         "@vitejs/plugin-vue": "^6.0.2",
         "@vue/eslint-config-prettier": "^10.2.0",
         "@vue/eslint-config-typescript": "^14.6.0",
@@ -58,7 +59,7 @@
         "shiki": "^3.2.2",
         "sortablejs": "^1.15.6",
         "typescript": "^5.9.3",
-        "ua-parser-js": "^2.0.9",
+        "ua-parser-js": "^1.0.41",
         "vite": "^6.4.1",
         "vite-plugin-ejs": "^1.7.0",
         "vite-plugin-vercel": "^9.0.8",
@@ -3326,6 +3327,12 @@
       "integrity": "sha512-b79830lW+RZfwaztgs1aVPgbasJ8e7AXtZYHTELNXZPsERt4ymJdjV4OccDbHQAvHrCcFpbF78jkm0R6h/pZVg==",
       "license": "MIT"
     },
+    "node_modules/@types/ua-parser-js": {
+      "version": "0.7.39",
+      "resolved": "https://registry.npmjs.org/@types/ua-parser-js/-/ua-parser-js-0.7.39.tgz",
+      "integrity": "sha512-P/oDfpofrdtF5xw433SPALpdSchtJmY7nsJItf8h3KXqOslkbySh8zq4dSWXH2oTjRvJ5PczVEoCZPow6GicLg==",
+      "license": "MIT"
+    },
     "node_modules/@types/unist": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.3.tgz",
@@ -5219,26 +5226,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/detect-europe-js": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/detect-europe-js/-/detect-europe-js-0.1.2.tgz",
-      "integrity": "sha512-lgdERlL3u0aUdHocoouzT10d9I89VVhk0qNRmll7mXdGfJT1/wqZ2ZLA4oJAjeACPY5fT1wsbq2AT+GkuInsow==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/faisalman"
-        },
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/ua-parser-js"
-        },
-        {
-          "type": "paypal",
-          "url": "https://paypal.me/faisalman"
-        }
-      ],
-      "license": "MIT"
-    },
     "node_modules/detect-libc": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
@@ -7048,26 +7035,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/is-standalone-pwa": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/is-standalone-pwa/-/is-standalone-pwa-0.1.1.tgz",
-      "integrity": "sha512-9Cbovsa52vNQCjdXOzeQq5CnCbAcRk05aU62K20WO372NrTv0NxibLFCK6lQ4/iZEFdEA3p3t2VNOn8AJ53F5g==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/faisalman"
-        },
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/ua-parser-js"
-        },
-        {
-          "type": "paypal",
-          "url": "https://paypal.me/faisalman"
-        }
-      ],
-      "license": "MIT"
-    },
     "node_modules/is-stream": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-4.0.1.tgz",
@@ -10386,30 +10353,10 @@
         "typescript": ">=4.8.4 <6.0.0"
       }
     },
-    "node_modules/ua-is-frozen": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/ua-is-frozen/-/ua-is-frozen-0.1.2.tgz",
-      "integrity": "sha512-RwKDW2p3iyWn4UbaxpP2+VxwqXh0jpvdxsYpZ5j/MLLiQOfbsV5shpgQiw93+KMYQPcteeMQ289MaAFzs3G9pw==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/faisalman"
-        },
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/ua-parser-js"
-        },
-        {
-          "type": "paypal",
-          "url": "https://paypal.me/faisalman"
-        }
-      ],
-      "license": "MIT"
-    },
     "node_modules/ua-parser-js": {
-      "version": "2.0.9",
-      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-2.0.9.tgz",
-      "integrity": "sha512-OsqGhxyo/wGdLSXMSJxuMGN6H4gDnKz6Fb3IBm4bxZFMnyy0sdf6MN96Ie8tC6z/btdO+Bsy8guxlvLdwT076w==",
+      "version": "1.0.41",
+      "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-1.0.41.tgz",
+      "integrity": "sha512-LbBDqdIC5s8iROCUjMbW1f5dJQTEFB1+KO9ogbvlb3nm9n4YHa5p4KTvFPWvh2Hs8gZMBuiB1/8+pdfe/tDPug==",
       "funding": [
         {
           "type": "opencollective",
@@ -10424,12 +10371,7 @@
           "url": "https://github.com/sponsors/faisalman"
         }
       ],
-      "license": "AGPL-3.0-or-later",
-      "dependencies": {
-        "detect-europe-js": "^0.1.2",
-        "is-standalone-pwa": "^0.1.1",
-        "ua-is-frozen": "^0.1.2"
-      },
+      "license": "MIT",
       "bin": {
         "ua-parser-js": "script/cli.js"
       },
diff --git a/spx-gui/package.json b/spx-gui/package.json
index badbbb46d..e7f3d8c4f 100644
--- a/spx-gui/package.json
+++ b/spx-gui/package.json
@@ -29,6 +29,7 @@
     "@types/file-saver": "^2.0.7",
     "@types/node": "^24.10.1",
     "@types/sortablejs": "^1.15.8",
+    "@types/ua-parser-js": "^0.7.36",
     "@vitejs/plugin-vue": "^6.0.2",
     "@vue/eslint-config-prettier": "^10.2.0",
     "@vue/eslint-config-typescript": "^14.6.0",
@@ -75,7 +76,7 @@
     "vue-konva": "^3.1.0",
     "vue-router": "^4.2.5",
     "vue-tsc": "^3.1.1",
-    "ua-parser-js": "^2.0.9",
+    "ua-parser-js": "^1.0.41",
     "zod": "^3.23.8",
     "zod-to-json-schema": "^3.24.1"
   },
diff --git a/spx-gui/src/App.vue b/spx-gui/src/App.vue
index fad928040..067e428b8 100644
--- a/spx-gui/src/App.vue
+++ b/spx-gui/src/App.vue
@@ -1,8 +1,8 @@
 <template>
   <UIConfigProvider :config="config">
-    <MobileReminder v-if="showMobileReminder" />
-    <UIMessageProvider v-else>
-      <UIModalProvider>
+    <UIMessageProvider>
+      <MobileReminder v-if="showMobileReminder" />
+      <UIModalProvider v-else>
         <BrowserVersionReminder />
         <CopilotRoot>
           <TutorialRoot>
diff --git a/spx-gui/src/components/ua/BrowserVersionReminder.vue b/spx-gui/src/components/ua/BrowserVersionReminder.vue
index 5842ec6a3..84bd68335 100644
--- a/spx-gui/src/components/ua/BrowserVersionReminder.vue
+++ b/spx-gui/src/components/ua/BrowserVersionReminder.vue
@@ -2,8 +2,10 @@
   <UIDialog
     type="warning"
     size="small"
-    :visible="visible"
     :title="$t({ en: 'Browser Version Unsupported', zh: '浏览器版本不支持' })"
+    :visible="visible"
+    :mask-closable="true"
+    @update:visible="visible = $event"
   >
     <div>{{ $t(content) }}</div>
     <footer class="footer">
@@ -30,7 +32,7 @@
 
 <script setup lang="ts">
 import { onMounted, ref } from 'vue'
-import { checkBrowserVersion } from '@/utils/ua.ts'
+import { checkBrowserVersion } from '@/utils/ua'
 import { type LocaleMessage } from '@/utils/i18n'
 import UIDialog from '@/components/ui/dialog/UIDialog.vue'
 import UIButton from '../ui/UIButton.vue'
diff --git a/spx-gui/src/components/ua/MobileReminder.vue b/spx-gui/src/components/ua/MobileReminder.vue
index 37c08509e..6ac6c9c1a 100644
--- a/spx-gui/src/components/ua/MobileReminder.vue
+++ b/spx-gui/src/components/ua/MobileReminder.vue
@@ -1,9 +1,5 @@
 <template>
   <div class="mobile-reminder">
-    <div v-if="showCopiedMessage" class="copied-message">
-      <UIIcon type="success" />
-      <span>{{ t({ en: 'Copied to clipboard!', zh: '已复制到剪贴板！' }) }}</span>
-    </div>
     <div class="guide-img">
       <img :src="imgDesktopRequired" alt="Desktop Required Image" />
     </div>
@@ -23,7 +19,7 @@
       v-radar="{ name: 'Copy Access URL', desc: 'Button to copy the access URL' }"
       size="large"
       icon="copy"
-      @click="copyAccessUrl"
+      @click="handleCopy"
     >
       {{ t({ en: 'Copy Access URL', zh: '复制访问地址' }) }}
     </UIButton>
@@ -31,32 +27,20 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
 import { useI18n } from '@/utils/i18n'
 import imgDesktopRequired from './desktop-required.png'
-import { UIButton, UIIcon } from '@/components/ui'
+import { UIButton } from '@/components/ui'
+import { useMessageHandle } from '@/utils/exception'
 
 const { t } = useI18n()
 
 const isClipboardSupported = !!navigator.clipboard
-const showCopiedMessage = ref(false)
 
-function copyAccessUrl() {
-  if (!navigator.clipboard) return
-  const url = window.location.href
-  navigator.clipboard
-    .writeText(url)
-    .then(() => {
-      showCopiedMessage.value = true
-      setTimeout(() => {
-        showCopiedMessage.value = false
-      }, 2000)
-    })
-    .catch((e) => {
-      // TODO: show error message to user ?
-      console.error('Failed to copy URL:', url, e)
-    })
-}
+const handleCopy = useMessageHandle(
+  () => navigator.clipboard.writeText(window.location.href),
+  { en: 'Failed to copy URL to clipboard', zh: '复制到剪贴板失败' },
+  { en: 'Copied to clipboard', zh: '已复制到剪贴板' }
+).fn
 </script>
 
 <style lang="scss" scoped>
@@ -93,20 +77,5 @@ function copyAccessUrl() {
       color: var(--ui-color-grey-900);
     }
   }
-
-  .copied-message {
-    position: fixed;
-    top: 40px;
-    z-index: 1000;
-    border-radius: 8px;
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
-    padding: 12px 20px;
-    display: flex;
-    align-items: center;
-    gap: 8px;
-    font-size: 14px;
-    color: var(--ui-color-grey-900);
-    animation: fade-in-out 2s forwards;
-  }
 }
 </style>
diff --git a/spx-gui/src/utils/ua.ts b/spx-gui/src/utils/ua.ts
index 45d780e53..25c09d70f 100644
--- a/spx-gui/src/utils/ua.ts
+++ b/spx-gui/src/utils/ua.ts
@@ -1,7 +1,6 @@
-import { UAParser } from 'ua-parser-js'
-import { BrowserName } from 'ua-parser-js/enums'
+import uaParser from 'ua-parser-js'
 
-const ua = UAParser(navigator.userAgent)
+const ua = uaParser(navigator.userAgent)
 
 export default ua
 
@@ -9,7 +8,14 @@ export function isMobile() {
   return ua.device.type === 'mobile' || ua.device.type === 'tablet'
 }
 
-// Minimum recommended browser versions, consistent with `browserslist` in package.json
+export const BrowserName = {
+  CHROME: 'Chrome',
+  EDGE: 'Edge',
+  FIREFOX: 'Firefox',
+  SAFARI: 'Safari'
+} as const
+
+// Minimum recommended browser versions, derived from `browserslist` in package.json
 const recommendedBrowserVersions: Record<string, number> = {
   [BrowserName.CHROME]: 111,
   [BrowserName.EDGE]: 111,

From db40be7f2f143051dd45578fff82184b34225938 Mon Sep 17 00:00:00 2001
From: chennan <chennan@qiniu.com>
Date: Wed, 11 Feb 2026 14:32:40 +0800
Subject: [PATCH 4/5] fix version compare

---
 spx-gui/src/App.vue                           |  7 +--
 .../components/ua/BrowserVersionReminder.vue  | 19 ++++++--
 spx-gui/src/utils/ua.test.ts                  | 48 +++++++++++++++++++
 spx-gui/src/utils/ua.ts                       | 48 +++++++++++++++----
 4 files changed, 105 insertions(+), 17 deletions(-)
 create mode 100644 spx-gui/src/utils/ua.test.ts

diff --git a/spx-gui/src/App.vue b/spx-gui/src/App.vue
index 067e428b8..40bcdf9e0 100644
--- a/spx-gui/src/App.vue
+++ b/spx-gui/src/App.vue
@@ -19,19 +19,20 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue'
+import { computed, defineAsyncComponent } from 'vue'
 import { UIConfigProvider, UIModalProvider, UIMessageProvider, type Config } from '@/components/ui'
 import AgentCopilotProvider from '@/components/agent-copilot/CopilotProvider.vue'
 import CopilotRoot from '@/components/copilot/CopilotRoot.vue'
 import CopilotUI from '@/components/copilot/CopilotUI.vue'
 import TutorialRoot from '@/components/tutorials/TutorialRoot.vue'
-import MobileReminder from '@/components/ua/MobileReminder.vue'
-import BrowserVersionReminder from '@/components/ua/BrowserVersionReminder.vue'
 import { SpotlightUI } from '@/utils/spotlight'
 import { useI18n } from '@/utils/i18n'
 import { useInstallRouteLoading } from '@/utils/route-loading'
 import { isMobile } from '@/utils/ua'
 
+const MobileReminder = defineAsyncComponent(() => import('@/components/ua/MobileReminder.vue'))
+const BrowserVersionReminder = defineAsyncComponent(() => import('@/components/ua/BrowserVersionReminder.vue'))
+
 const showMobileReminder = isMobile()
 
 const { t } = useI18n()
diff --git a/spx-gui/src/components/ua/BrowserVersionReminder.vue b/spx-gui/src/components/ua/BrowserVersionReminder.vue
index 84bd68335..e18c6a681 100644
--- a/spx-gui/src/components/ua/BrowserVersionReminder.vue
+++ b/spx-gui/src/components/ua/BrowserVersionReminder.vue
@@ -37,19 +37,23 @@ import { type LocaleMessage } from '@/utils/i18n'
 import UIDialog from '@/components/ui/dialog/UIDialog.vue'
 import UIButton from '../ui/UIButton.vue'
 
-const defaultTip: LocaleMessage = {
+const fallbackMessage: LocaleMessage = {
   en: 'Your browser version may not support all features. Please update your browser for the best experience.',
   zh: '您的浏览器版本可能无法支持全部功能，建议更新浏览器以获得最佳体验。'
 }
 
 const visible = ref(false)
-const content = ref(defaultTip)
+const content = ref(fallbackMessage)
 
 const localStorageKey = 'spx-gui-browser-version-reminder-ignored'
 
 function handleDoNotShowAgain() {
   visible.value = false
-  localStorage.setItem(localStorageKey, 'true')
+  try {
+    localStorage.setItem(localStorageKey, 'true')
+  } catch (e) {
+    console.warn('Failed to save preference:', e)
+  }
 }
 
 function handleConfirm() {
@@ -57,8 +61,13 @@ function handleConfirm() {
 }
 
 onMounted(() => {
-  const isIgnored = localStorage.getItem(localStorageKey)
-  if (isIgnored === 'true') return
+  let isIgnored = false
+  try {
+    isIgnored = localStorage.getItem(localStorageKey) === 'true'
+  } catch (e) {
+    console.warn('Failed to read localStorage:', e)
+  }
+  if (isIgnored) return
 
   const checkResult = checkBrowserVersion()
   if (checkResult.ok) return
diff --git a/spx-gui/src/utils/ua.test.ts b/spx-gui/src/utils/ua.test.ts
new file mode 100644
index 000000000..c1c4bb4ea
--- /dev/null
+++ b/spx-gui/src/utils/ua.test.ts
@@ -0,0 +1,48 @@
+import { describe, it, expect } from 'vitest'
+import { compareVersions } from './ua'
+
+describe('compareVersions', () => {
+  it('should compare major versions correctly', () => {
+    expect(compareVersions('2.0', '1.0')).toBeGreaterThan(0)
+    expect(compareVersions('1.0', '2.0')).toBeLessThan(0)
+    expect(compareVersions('111', '110')).toBeGreaterThan(0)
+    expect(compareVersions('110', '111')).toBeLessThan(0)
+  })
+
+  it('should compare minor versions correctly', () => {
+    expect(compareVersions('1.10', '1.4')).toBeGreaterThan(0)
+    expect(compareVersions('1.4', '1.10')).toBeLessThan(0)
+    expect(compareVersions('16.10', '16.4')).toBeGreaterThan(0)
+    expect(compareVersions('16.4', '16.10')).toBeLessThan(0)
+  })
+
+  it('should return 0 for equal versions', () => {
+    expect(compareVersions('1.0', '1.0')).toBe(0)
+    expect(compareVersions('1.10', '1.10')).toBe(0)
+    expect(compareVersions('111', '111')).toBe(0)
+    expect(compareVersions('16.4', '16.4')).toBe(0)
+  })
+
+  it('should handle versions without minor part', () => {
+    expect(compareVersions('111', '111.0')).toBe(0)
+    expect(compareVersions('111.0', '111')).toBe(0)
+    expect(compareVersions('112', '111')).toBeGreaterThan(0)
+    expect(compareVersions('111', '112')).toBeLessThan(0)
+  })
+
+  it('should handle real-world browser versions', () => {
+    expect(compareVersions('111.0', '111')).toBe(0)
+    expect(compareVersions('111.0.5563.146', '111')).toBe(0)
+    expect(compareVersions('113.0', '113')).toBe(0)
+    expect(compareVersions('16.4', '16.4')).toBe(0)
+    expect(compareVersions('120.0', '111')).toBeGreaterThan(0)
+    expect(compareVersions('110.0', '111')).toBeLessThan(0)
+  })
+
+  it('should handle edge cases', () => {
+    expect(compareVersions('0', '0')).toBe(0)
+    expect(compareVersions('0.0', '0.0')).toBe(0)
+    expect(compareVersions('1', '0')).toBeGreaterThan(0)
+    expect(compareVersions('0', '1')).toBeLessThan(0)
+  })
+})
\ No newline at end of file
diff --git a/spx-gui/src/utils/ua.ts b/spx-gui/src/utils/ua.ts
index 25c09d70f..0fa5d547d 100644
--- a/spx-gui/src/utils/ua.ts
+++ b/spx-gui/src/utils/ua.ts
@@ -16,18 +16,26 @@ export const BrowserName = {
 } as const
 
 // Minimum recommended browser versions, derived from `browserslist` in package.json
-const recommendedBrowserVersions: Record<string, number> = {
-  [BrowserName.CHROME]: 111,
-  [BrowserName.EDGE]: 111,
-  [BrowserName.FIREFOX]: 113,
-  [BrowserName.SAFARI]: 16.4
+const recommendedBrowserVersions: Record<string, string> = {
+  [BrowserName.CHROME]: '111',
+  [BrowserName.EDGE]: '111',
+  [BrowserName.FIREFOX]: '113',
+  [BrowserName.SAFARI]: '16.4'
 }
 
 export type BrowserCheckResult =
   | { ok: true }
-  | { ok: false; browserName: string; recommendedVersion: number }
-  | { ok: false; browserName: null; recommendedBrowser: string; recommendedVersion: number }
+  | { ok: false; browserName: string; recommendedVersion: string }
+  | { ok: false; browserName: null; recommendedBrowser: string; recommendedVersion: string }
 
+/**
+ * Checks if the current browser meets minimum version requirements.
+ *
+ * @returns An object indicating the check result:
+ *   - `{ ok: true }` if the browser version meets requirements
+ *   - `{ ok: false, browserName, recommendedVersion }` if a known browser is outdated
+ *   - `{ ok: false, browserName: null, recommendedBrowser, recommendedVersion }` if the browser is unknown/unsupported
+ */
 export function checkBrowserVersion(): BrowserCheckResult {
   const browserName = ua.browser.name
   if (!browserName || !(browserName in recommendedBrowserVersions)) {
@@ -39,9 +47,31 @@ export function checkBrowserVersion(): BrowserCheckResult {
     }
   }
   const recommendedVersion = recommendedBrowserVersions[browserName]
-  const browserVersion = parseFloat(ua.browser.version || '0')
-  if (browserVersion >= recommendedVersion) {
+  const browserVersion = ua.browser.version || '0'
+  if (compareVersions(browserVersion, recommendedVersion) >= 0) {
     return { ok: true }
   }
   return { ok: false, browserName, recommendedVersion }
 }
+
+/**
+ * Compares two version strings (e.g., "16.10" vs "16.4").
+ *
+ * @param version - The version string to compare (e.g., browser version)
+ * @param target - The target version string to compare against (e.g., recommended version)
+ * @returns A positive number if `version` is greater than `target`, negative if less, or 0 if equal
+ */
+export function compareVersions(version: string, target: string): number {
+  const parts = version.split('.').map((part) => parseInt(part, 10) || 0)
+  const major = parts[0] || 0
+  const minor = parts[1] || 0
+
+  const targetParts = target.split('.').map((part) => parseInt(part, 10) || 0)
+  const targetMajor = targetParts[0] || 0
+  const targetMinor = targetParts[1] || 0
+
+  if (major !== targetMajor) {
+    return major - targetMajor
+  }
+  return minor - targetMinor
+}

From 386cacaca452c2b9fbad2cdd48c94a3517ce5a61 Mon Sep 17 00:00:00 2001
From: chennan <chennan@qiniu.com>
Date: Wed, 11 Feb 2026 14:53:20 +0800
Subject: [PATCH 5/5] fix format

---
 spx-gui/src/utils/ua.test.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/spx-gui/src/utils/ua.test.ts b/spx-gui/src/utils/ua.test.ts
index c1c4bb4ea..f09e21f83 100644
--- a/spx-gui/src/utils/ua.test.ts
+++ b/spx-gui/src/utils/ua.test.ts
@@ -45,4 +45,4 @@ describe('compareVersions', () => {
     expect(compareVersions('1', '0')).toBeGreaterThan(0)
     expect(compareVersions('0', '1')).toBeLessThan(0)
   })
-})
\ No newline at end of file
+})