feat: 复活插件统计

Author: SengokuCola

dashboard/src/components/plugin-stats.tsx

@@ -18,7 +18,7 @@ import {
 import { Textarea } from '@/components/ui/textarea'
 import { useToast } from '@/hooks/use-toast'
 import {
-  getPluginStatsByIds,
+  getPluginStats,
   likePlugin,
   dislikePlugin,
   ratePlugin,
@@ -27,11 +27,10 @@ import {
 
 interface PluginStatsProps {
   pluginId: string
-  pluginIds?: string[]
   compact?: boolean // 紧凑模式（只显示数字）
 }
 
-export function PluginStats({ pluginId, pluginIds, compact = false }: PluginStatsProps) {
+export function PluginStats({ pluginId, compact = false }: PluginStatsProps) {
   const [stats, setStats] = useState<PluginStatsData | null>(null)
   const [loading, setLoading] = useState(true)
   const [userRating, setUserRating] = useState(0)
@@ -42,7 +41,7 @@ export function PluginStats({ pluginId, pluginIds, compact = false }: PluginStat
   // 加载统计数据
   const loadStats = async () => {
     setLoading(true)
-    const data = await getPluginStatsByIds(pluginIds?.length ? pluginIds : [pluginId])
+    const data = await getPluginStats(pluginId)
     if (data) {
       setStats(data)
     }

dashboard/src/components/route-pending-fallback.tsx

@@ -1,8 +1,20 @@
+import { useEffect, useState } from 'react'
+
 export function RoutePendingFallback() {
+  const [dotCount, setDotCount] = useState(6)
+
+  useEffect(() => {
+    const timer = window.setInterval(() => {
+      setDotCount((current) => (current >= 6 ? 2 : current + 1))
+    }, 450)
+
+    return () => window.clearInterval(timer)
+  }, [])
+
   return (
     <div className="flex h-full items-center justify-center bg-background/80">
-      <div className="rounded-xl border bg-card px-4 py-3 text-sm text-muted-foreground shadow-sm">
-        正在切换页面...
+      <div className="min-w-[10rem] rounded-xl border bg-card px-5 py-3.5 text-base font-medium text-muted-foreground shadow-sm">
+        Thinking{'.'.repeat(dotCount)}
       </div>
     </div>
   )

dashboard/src/lib/plugin-api/marketplace.ts

@@ -13,6 +13,16 @@ const PLUGIN_REPO_OWNER = 'Mai-with-u'
 const PLUGIN_REPO_NAME = 'plugin-repo'
 const PLUGIN_REPO_BRANCH = 'main'
 const PLUGIN_DETAILS_FILE = 'plugin_details.json'
+const PLUGIN_LIST_CACHE_TTL = 5 * 60 * 1000
+const PLUGIN_LIST_STORAGE_KEY = 'maibot-plugin-market-list-cache'
+
+let pluginListCache: { timestamp: number; result: ApiResponse<PluginInfo[]> } | null = null
+let pluginListRequest: Promise<ApiResponse<PluginInfo[]>> | null = null
+
+interface PluginListStorageCache {
+  timestamp: number
+  data: PluginInfo[]
+}
 
 /**
  * 插件列表 API 响应类型（只包含我们需要的字段）
@@ -78,10 +88,69 @@ function normalizePluginManifest(manifest: PluginApiResponse['manifest']): Plugi
   }
 }
 
+function readPluginListStorageCache(): PluginListStorageCache | null {
+  if (typeof localStorage === 'undefined') {
+    return null
+  }
+
+  try {
+    const rawCache = localStorage.getItem(PLUGIN_LIST_STORAGE_KEY)
+    if (!rawCache) {
+      return null
+    }
+
+    const cache = JSON.parse(rawCache) as Partial<PluginListStorageCache>
+    if (!cache.timestamp || !Array.isArray(cache.data)) {
+      return null
+    }
+
+    return {
+      timestamp: Number(cache.timestamp),
+      data: cache.data,
+    }
+  } catch (error) {
+    console.warn('读取插件市场缓存失败:', error)
+    return null
+  }
+}
+
+function writePluginListStorageCache(data: PluginInfo[]): void {
+  if (typeof localStorage === 'undefined') {
+    return
+  }
+
+  try {
+    localStorage.setItem(
+      PLUGIN_LIST_STORAGE_KEY,
+      JSON.stringify({
+        timestamp: Date.now(),
+        data,
+      })
+    )
+  } catch (error) {
+    console.warn('写入插件市场缓存失败:', error)
+  }
+}
+
+export function getCachedPluginList(): PluginInfo[] | null {
+  if (pluginListCache?.result.success) {
+    return pluginListCache.result.data
+  }
+
+  const storedCache = readPluginListStorageCache()
+  if (!storedCache) {
+    return null
+  }
+
+  const result: ApiResponse<PluginInfo[]> = { success: true, data: storedCache.data }
+  pluginListCache = { timestamp: storedCache.timestamp, result }
+  return storedCache.data
+}
+
 /**
  * 从远程获取插件列表(通过后端代理避免 CORS)
  */
-export async function fetchPluginList(): Promise<ApiResponse<PluginInfo[]>> {
+async function fetchPluginListUncached(): Promise<ApiResponse<PluginInfo[]>> {
   const response = await fetchWithAuth('/api/webui/plugins/fetch-raw', {
     method: 'POST',
     body: JSON.stringify({
@@ -133,7 +202,7 @@ export async function fetchPluginList(): Promise<ApiResponse<PluginInfo[]>> {
       return {
         id: pluginId,
         marketplace_id: marketplaceId,
-        stats_ids: uniqueNonEmptyValues([marketplaceId, manifestId, pluginId]),
+        stats_ids: uniqueNonEmptyValues([manifestId]),
         manifest: normalizePluginManifest({ ...item.manifest, id: pluginId }),
         downloads: 0,
         rating: 0,
@@ -151,6 +220,41 @@ export async function fetchPluginList(): Promise<ApiResponse<PluginInfo[]>> {
   }
 }
 
+export async function fetchPluginList(options: { forceRefresh?: boolean } = {}): Promise<ApiResponse<PluginInfo[]>> {
+  if (
+    !options.forceRefresh
+    && pluginListCache
+    && Date.now() - pluginListCache.timestamp < PLUGIN_LIST_CACHE_TTL
+  ) {
+    return pluginListCache.result
+  }
+
+  if (!options.forceRefresh && !pluginListCache) {
+    const storedCache = readPluginListStorageCache()
+    if (storedCache && Date.now() - storedCache.timestamp < PLUGIN_LIST_CACHE_TTL) {
+      const result: ApiResponse<PluginInfo[]> = { success: true, data: storedCache.data }
+      pluginListCache = { timestamp: storedCache.timestamp, result }
+      return result
+    }
+  }
+
+  if (!pluginListRequest || options.forceRefresh) {
+    pluginListRequest = fetchPluginListUncached()
+      .then((result) => {
+        if (result.success) {
+          pluginListCache = { timestamp: Date.now(), result }
+          writePluginListStorageCache(result.data)
+        }
+        return result
+      })
+      .finally(() => {
+        pluginListRequest = null
+      })
+  }
+
+  return pluginListRequest
+}
+
 /**
  * 检查本机 Git 安装状态
  */