feat: enhance model abilities display in DynamicFormItem and ModelsDialog components with icons for vision and function call

This commit is contained in:
Junyan Qin
2025-12-26 20:57:12 +08:00
parent 57fcec011d
commit 1d4c5bbdf1
2 changed files with 16 additions and 8 deletions

View File

@@ -43,7 +43,7 @@ import {
DialogFooter,
} from '@/components/ui/dialog';
import { Checkbox } from '@/components/ui/checkbox';
import { Plus, X } from 'lucide-react';
import { Plus, X, Eye, Wrench } from 'lucide-react';
export default function DynamicFormItemComponent({
config,
@@ -277,9 +277,15 @@ export default function DynamicFormItemComponent({
<SelectLabel>{providerName}</SelectLabel>
{models.map((model) => (
<SelectItem key={model.uuid} value={model.uuid}>
{model.name}
{model.abilities?.includes('vision') && ' 👁'}
{model.abilities?.includes('func_call') && ' 🔧'}
<span className="inline-flex items-center gap-1">
{model.name}
{model.abilities?.includes('vision') && (
<Eye className="h-3 w-3 text-muted-foreground" />
)}
{model.abilities?.includes('func_call') && (
<Wrench className="h-3 w-3 text-muted-foreground" />
)}
</span>
</SelectItem>
))}
</SelectGroup>

View File

@@ -11,6 +11,8 @@ import {
Settings,
Sparkles,
LogIn,
Eye,
Wrench,
} from 'lucide-react';
import { httpClient } from '@/app/infra/http/HttpClient';
import {
@@ -400,13 +402,13 @@ export default function ModelsDialog({
{t('models.chat')}
</Badge>
{model.abilities?.includes('vision') && (
<Badge variant="outline" className="text-xs">
👁
<Badge variant="outline" className="text-xs gap-1">
<Eye className="h-3 w-3" />
</Badge>
)}
{model.abilities?.includes('func_call') && (
<Badge variant="outline" className="text-xs">
🔧
<Badge variant="outline" className="text-xs gap-1">
<Wrench className="h-3 w-3" />
</Badge>
)}
</div>