diff --git a/web/src/modules/playground/Chat.tsx b/web/src/modules/playground/Chat.tsx index 1198ff0..20a0500 100644 --- a/web/src/modules/playground/Chat.tsx +++ b/web/src/modules/playground/Chat.tsx @@ -3,7 +3,7 @@ import { Button, Card, CardContent, CardHeader, CardTitle, Label, PageBanner } f import { Eraser, FlaskConical } from "lucide-react"; import { buildPayload } from "@/modules/playground/api"; import { Composer } from "@/modules/playground/components/Composer"; -import { ModelSelect, useModels } from "@/modules/playground/components/ModelSelect"; +import { ModelSelect, NoModels, useModels } from "@/modules/playground/components/ModelSelect"; import { ParamsPanel } from "@/modules/playground/components/ParamsPanel"; import { Transcript } from "@/modules/playground/components/Transcript"; import { ViewCode } from "@/modules/playground/components/ViewCode"; @@ -55,6 +55,8 @@ export function Chat() { {models.error ? (

{modelsHint(t, models.error)}

+ ) : models.data?.length === 0 ? ( + ) : (

{t("chat.modelsSource")}

)} diff --git a/web/src/modules/playground/Compare.tsx b/web/src/modules/playground/Compare.tsx index 913ffef..25a2530 100644 --- a/web/src/modules/playground/Compare.tsx +++ b/web/src/modules/playground/Compare.tsx @@ -3,7 +3,7 @@ import { Button, Card, Dialog, DialogContent, DialogDescription, DialogHeader, D import { Columns2, Eraser, Plus, SlidersHorizontal, X } from "lucide-react"; import { buildPayload } from "@/modules/playground/api"; import { Composer } from "@/modules/playground/components/Composer"; -import { ModelSelect, useModels } from "@/modules/playground/components/ModelSelect"; +import { ModelSelect, NoModels, useModels } from "@/modules/playground/components/ModelSelect"; import { ParamsPanel } from "@/modules/playground/components/ParamsPanel"; import { Transcript } from "@/modules/playground/components/Transcript"; import { ViewCode } from "@/modules/playground/components/ViewCode"; @@ -103,7 +103,7 @@ export function Compare() { />
- {models.error ?

{modelsHint(t, models.error)}

: null} + {models.error ?

{modelsHint(t, models.error)}

: }
{slots.map((slot, i) => ( diff --git a/web/src/modules/playground/components/ModelSelect.tsx b/web/src/modules/playground/components/ModelSelect.tsx index 63d889b..5e63b63 100644 --- a/web/src/modules/playground/components/ModelSelect.tsx +++ b/web/src/modules/playground/components/ModelSelect.tsx @@ -1,4 +1,5 @@ import { useQuery } from "@tanstack/react-query"; +import { Link } from "react-router"; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@modelsphere/ui"; import { api } from "@/modules/playground/api"; import { useT } from "@/modules/playground/i18n"; @@ -26,3 +27,19 @@ export function ModelSelect({ id, value, onChange, className }: { id?: string; v ); } + +// NoModels says why the list is empty: the gateway answered, but no route on it +// has a model ready to serve yet. A failed request is modelsHint's to explain. +export function NoModels({ className }: { className?: string }) { + const t = useT(); + const models = useModels(); + if (!models.isSuccess || models.data.length > 0) return null; + return ( +

+ {t("modelSelect.noneHint")}{" "} + + {t("modelSelect.deploy")} + +

+ ); +} diff --git a/web/src/modules/playground/locales/en-US.json b/web/src/modules/playground/locales/en-US.json index dd84ee8..9e51956 100644 --- a/web/src/modules/playground/locales/en-US.json +++ b/web/src/modules/playground/locales/en-US.json @@ -53,7 +53,9 @@ }, "modelSelect": { "placeholder": "Select a model", - "none": "No models available" + "none": "No model deployed yet", + "noneHint": "No model on the gateway is ready to call yet. Deploy one under Model Deployment; it shows up here once ready.", + "deploy": "Deploy a model" }, "params": { "system": "System prompt", diff --git a/web/src/modules/playground/locales/zh-CN.json b/web/src/modules/playground/locales/zh-CN.json index 8598392..05486e0 100644 --- a/web/src/modules/playground/locales/zh-CN.json +++ b/web/src/modules/playground/locales/zh-CN.json @@ -46,7 +46,9 @@ }, "modelSelect": { "placeholder": "选择模型", - "none": "无可用模型" + "none": "还未部署模型", + "noneHint": "网关上还没有可调用的模型。先到模型部署里部署一个,就绪后会出现在这里。", + "deploy": "去部署" }, "params": { "system": "系统提示词",