diff --git a/frontend/src/core/models/hooks.ts b/frontend/src/core/models/hooks.ts index f0fa7536..e6ec7f2e 100644 --- a/frontend/src/core/models/hooks.ts +++ b/frontend/src/core/models/hooks.ts @@ -5,8 +5,10 @@ import { toast } from "sonner"; import { loadModels } from "./api"; import type { Model } from "./types"; +const MODELS_UPDATING_TOAST_ID = "models-server-updating"; + export function useModels({ enabled = true }: { enabled?: boolean } = {}) { - const { data, isLoading, error } = useQuery({ + const { data, isLoading, error, failureReason } = useQuery({ queryKey: ["models"], queryFn: () => loadModels(), enabled, @@ -15,16 +17,30 @@ export function useModels({ enabled = true }: { enabled?: boolean } = {}) { if (queryError.message.startsWith("HTTP error: 4")) { return false; } + if (queryError.message.startsWith("Server error: 5")) { + return true; + } return failureCount < 1; }, + retryDelay: 3000, }); useEffect(() => { - // React Query v5 removed per-query onError callbacks from useQuery options. - if (error?.message.includes("Server error: 5")) { - toast.error("系统正在更新-5,请稍候……"); + const serverError = [failureReason, error].find((candidate) => + candidate?.message.includes("Server error: 5"), + ); + + if (serverError) { + toast.loading("系统正在更新,请稍候……", { + id: MODELS_UPDATING_TOAST_ID, + }); + return; } + toast.dismiss(MODELS_UPDATING_TOAST_ID); + }, [error, failureReason]); + + useEffect(() => { if (error?.message.includes("HTTP error: 4")) { toast.error("模型接口不可用,请检查后端路由或服务状态。"); }