fix(room): show model name instead of UID in settings panel
- Load model list on settings panel mount so names are always available. - SelectValue now displays the selected model's name by looking up availableModels, falling back to UID if name not found. - Existing AI configs list also shows model name instead of raw UID.
This commit is contained in:
parent
5ff45770ec
commit
6431709669
@ -1,5 +1,5 @@
|
|||||||
import { memo, useState, useEffect, useCallback } from 'react';
|
import { memo, useState, useEffect, useCallback } from 'react';
|
||||||
import type { RoomResponse } from '@/client';
|
import type { ModelResponse, RoomResponse } from '@/client';
|
||||||
import { aiList, aiUpsert, aiDelete, modelList } from '@/client';
|
import { aiList, aiUpsert, aiDelete, modelList } from '@/client';
|
||||||
import { Button } from '@/components/ui/button';
|
import { Button } from '@/components/ui/button';
|
||||||
import { Input } from '@/components/ui/input';
|
import { Input } from '@/components/ui/input';
|
||||||
@ -79,6 +79,7 @@ export const RoomSettingsPanel = memo(function RoomSettingsPanel({
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
loadAiConfigs();
|
loadAiConfigs();
|
||||||
|
loadModels();
|
||||||
}, [loadAiConfigs]);
|
}, [loadAiConfigs]);
|
||||||
|
|
||||||
// Load available models
|
// Load available models
|
||||||
@ -215,8 +216,8 @@ export const RoomSettingsPanel = memo(function RoomSettingsPanel({
|
|||||||
>
|
>
|
||||||
<div className="flex items-center gap-2 min-w-0">
|
<div className="flex items-center gap-2 min-w-0">
|
||||||
<Bot className="h-4 w-4 text-muted-foreground shrink-0" />
|
<Bot className="h-4 w-4 text-muted-foreground shrink-0" />
|
||||||
<span className="text-sm truncate font-mono text-foreground">
|
<span className="text-sm truncate text-foreground">
|
||||||
{config.model}
|
{availableModels.find((m) => m.id === config.model)?.name ?? config.model}
|
||||||
</span>
|
</span>
|
||||||
{config.stream && (
|
{config.stream && (
|
||||||
<span className="rounded bg-green-500/10 px-1 py-0.5 text-[10px] text-green-600 dark:text-green-400 shrink-0">
|
<span className="rounded bg-green-500/10 px-1 py-0.5 text-[10px] text-green-600 dark:text-green-400 shrink-0">
|
||||||
@ -266,7 +267,11 @@ export const RoomSettingsPanel = memo(function RoomSettingsPanel({
|
|||||||
) : (
|
) : (
|
||||||
<Select value={selectedModelId} onValueChange={(v) => { if (v !== null) setSelectedModelId(v); }}>
|
<Select value={selectedModelId} onValueChange={(v) => { if (v !== null) setSelectedModelId(v); }}>
|
||||||
<SelectTrigger className="w-full">
|
<SelectTrigger className="w-full">
|
||||||
<SelectValue placeholder="Select a model..." />
|
<SelectValue placeholder="Select a model...">
|
||||||
|
{selectedModelId
|
||||||
|
? availableModels.find((m) => m.id === selectedModelId)?.name ?? selectedModelId
|
||||||
|
: null}
|
||||||
|
</SelectValue>
|
||||||
</SelectTrigger>
|
</SelectTrigger>
|
||||||
<SelectContent>
|
<SelectContent>
|
||||||
{availableModels.map((model) => (
|
{availableModels.map((model) => (
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user