feat(deploy): 接入全自动生产发布校验

2026-07-06 14:45:44 +08:00
parent 8d61bb7c13
commit dc780e4c7d
24 changed files with 662 additions and 3 deletions
--- a/apps/web/components/RuntimeVersionBanner.tsx
+++ b/apps/web/components/RuntimeVersionBanner.tsx
@@ -0,0 +1,76 @@
+'use client';
+
+import { useEffect, useMemo, useState } from 'react';
+import { RefreshCw, X } from 'lucide-react';
+import { api } from '@/lib/api';
+import {
+  getClientRuntimeVersion,
+  shouldPromptForNewRuntimeVersion,
+  type ServerRuntimeVersion,
+} from '@/lib/runtime-version';
+
+const VERSION_POLL_MS = 60_000;
+
+export function RuntimeVersionBanner() {
+  const clientVersion = useMemo(() => getClientRuntimeVersion(), []);
+  const [serverVersion, setServerVersion] = useState<ServerRuntimeVersion | null>(null);
+  const [dismissedVersion, setDismissedVersion] = useState('');
+
+  useEffect(() => {
+    let cancelled = false;
+    let timer: ReturnType<typeof setInterval> | undefined;
+
+    const load = async () => {
+      try {
+        const next = await api.get<ServerRuntimeVersion>('/health/version');
+        if (!cancelled) setServerVersion(next);
+      } catch {
+        if (!cancelled) setServerVersion(null);
+      }
+    };
+
+    void load();
+    timer = setInterval(() => void load(), VERSION_POLL_MS);
+
+    return () => {
+      cancelled = true;
+      if (timer) clearInterval(timer);
+    };
+  }, []);
+
+  const shouldShow =
+    serverVersion &&
+    serverVersion.version !== dismissedVersion &&
+    shouldPromptForNewRuntimeVersion(clientVersion.version, serverVersion.version);
+
+  if (!shouldShow || !serverVersion) return null;
+
+  return (
+    <div className="fixed bottom-4 right-4 z-[70] w-[320px] rounded-lg border border-blue-200 bg-blue-50 px-4 py-3 text-blue-900 shadow-lg">
+      <div className="flex items-start gap-3">
+        <RefreshCw className="mt-0.5 h-4 w-4 shrink-0" />
+        <div className="min-w-0 flex-1">
+          <p className="text-[13px] font-semibold">发现新版本</p>
+          <p className="mt-1 text-[12px] leading-5 text-blue-700">
+            服务器已更新到 {serverVersion.version.slice(0, 7)}，刷新后可使用最新前端。
+          </p>
+          <button
+            type="button"
+            onClick={() => window.location.reload()}
+            className="mt-2 h-7 rounded-md bg-blue-600 px-3 text-[12px] font-medium text-white hover:bg-blue-700"
+          >
+            刷新页面
+          </button>
+        </div>
+        <button
+          type="button"
+          onClick={() => setDismissedVersion(serverVersion.version)}
+          className="rounded-md p-1 text-blue-500 hover:bg-blue-100 hover:text-blue-700"
+          aria-label="关闭新版本提示"
+        >
+          <X className="h-3.5 w-3.5" />
+        </button>
+      </div>
+    </div>
+  );
+}