From 66bfffd25e4fae1f05dc06141156c315cc82c0dd Mon Sep 17 00:00:00 2001
From: AnotiaWang <anotia0202@gmail.com>
Date: Sat, 15 Feb 2025 11:05:31 +0800
Subject: [PATCH] feat: automatically check version updates

---
 app.vue                        |  1 +
 components/AutoUpdateToast.vue | 65 ++++++++++++++++++++++++++++++++++
 i18n/en.json                   |  5 +++
 i18n/zh.json                   |  5 +++
 nuxt.config.ts                 | 12 ++++++-
 package.json                   |  1 +
 pnpm-lock.yaml                 |  3 ++
 7 files changed, 91 insertions(+), 1 deletion(-)
 create mode 100644 components/AutoUpdateToast.vue

diff --git a/app.vue b/app.vue
index 149ad4f..c876d7f 100644
--- a/app.vue
+++ b/app.vue
@@ -3,6 +3,7 @@
     <NuxtLayout>
       <NuxtPage />
     </NuxtLayout>
+    <AutoUpdateToast />
   </UApp>
 </template>
 
diff --git a/components/AutoUpdateToast.vue b/components/AutoUpdateToast.vue
new file mode 100644
index 0000000..dab7fdf
--- /dev/null
+++ b/components/AutoUpdateToast.vue
@@ -0,0 +1,65 @@
+<script setup lang="ts">
+  import { useIntervalFn } from '@vueuse/core'
+  // @ts-expect-error
+  import semverGt from 'semver/functions/gt'
+  import type VersionMeta from '~/public/version.json'
+
+  const { t } = useI18n()
+  const toast = useToast()
+  const runtimeConfig = useRuntimeConfig()
+
+  const interval = 5 * 60 * 1000
+  let lastCheck: Date | undefined
+
+  const checkUpdate = async () => {
+    if (lastCheck && new Date().getTime() - lastCheck.getTime() < interval) {
+      return
+    }
+    lastCheck = new Date()
+    try {
+      const response = (await $fetch(
+        'https://deep-research.ataw.top/version.json',
+      )) as typeof VersionMeta
+      if (semverGt(response.version, runtimeConfig.public.version)) {
+        toast.add({
+          title: t('autoUpdate.newVersionTitle', [response.version]),
+          description: t('autoUpdate.newVersionDescription'),
+          color: 'info',
+          duration: 10_000,
+          actions: [
+            {
+              label: t('autoUpdate.refresh'),
+              onClick: () => {
+                window.location.reload()
+              },
+            },
+          ],
+        })
+      }
+    } catch (error) {
+      console.error('检查更新失败:', error)
+    }
+  }
+
+  // 每 3 分钟检查一次更新
+  const { pause, resume } = useIntervalFn(checkUpdate, interval, {
+    immediate: true,
+    immediateCallback: true,
+  })
+
+  // 当页面不可见时暂停检查
+  const visibility = useDocumentVisibility()
+  const focus = useWindowFocus()
+
+  watch(
+    [visibility, focus],
+    ([visible, focused]) => {
+      if (visible === 'visible' && focused) {
+        resume()
+      } else {
+        pause()
+      }
+    },
+    { immediate: true },
+  )
+</script>
diff --git a/i18n/en.json b/i18n/en.json
index ac0d665..8a5a89e 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -85,5 +85,10 @@
   },
   "error": {
     "requestBlockedByCORS": "The current API provider may not allow cross-origin requests. Please try a different service provider or contact the provider for support."
+  },
+  "autoUpdate": {
+    "newVersionTitle": "New version available: {0}",
+    "newVersionDescription": "Please refresh the page to get the latest version.",
+    "refresh": "Refresh"
   }
 }
\ No newline at end of file
diff --git a/i18n/zh.json b/i18n/zh.json
index 5cabde4..097f4c9 100644
--- a/i18n/zh.json
+++ b/i18n/zh.json
@@ -85,5 +85,10 @@
   },
   "error": {
     "requestBlockedByCORS": "当前 API 服务可能不允许接口跨域，请换一个服务试试，或者向服务方反馈。"
+  },
+  "autoUpdate": {
+    "newVersionTitle": "发现新版本：{0}",
+    "newVersionDescription": "请刷新页面以获取最新版本。",
+    "refresh": "刷新"
   }
 }
\ No newline at end of file
diff --git a/nuxt.config.ts b/nuxt.config.ts
index f9d347a..1b5a961 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -1,3 +1,5 @@
+import { version as projVersion } from './public/version.json'
+
 // https://nuxt.com/docs/api/configuration/nuxt-config
 export default defineNuxtConfig({
   modules: [
@@ -8,8 +10,16 @@ export default defineNuxtConfig({
     '@nuxtjs/i18n',
   ],
 
+  runtimeConfig: {
+    public: {
+      version: projVersion,
+    },
+  },
+
   routeRules: {
-    '/version.json': { cors: true },
+    '/version.json': {
+      cors: true,
+    },
   },
 
   i18n: {
diff --git a/package.json b/package.json
index 0a5436a..4edda1b 100644
--- a/package.json
+++ b/package.json
@@ -30,6 +30,7 @@
     "nuxt": "^3.15.4",
     "p-limit": "^6.2.0",
     "pinia": "^3.0.1",
+    "semver": "^7.7.1",
     "tailwindcss": "^4.0.5",
     "vue": "latest",
     "vue-router": "latest",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f8fb315..b7bd628 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -62,6 +62,9 @@ importers:
       pinia:
         specifier: ^3.0.1
         version: 3.0.1(typescript@5.7.3)(vue@3.5.13(typescript@5.7.3))
+      semver:
+        specifier: ^7.7.1
+        version: 7.7.1
       tailwindcss:
         specifier: ^4.0.5
         version: 4.0.6