Skip to content

Commit faefe27

Browse files
author
OpenCode Agent
committed
fix(frontend): show provider prefix for duplicate models in quick select dropdown
When the same model exists under multiple providers, show the provider name for both entries so users can distinguish them. Detects duplicates by modelID across all favorites and recents.
1 parent 530b442 commit faefe27

1 file changed

Lines changed: 35 additions & 26 deletions

File tree

frontend/src/components/model/ModelQuickSelect.tsx

Lines changed: 35 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -51,31 +51,31 @@ export function ModelQuickSelect({
5151
return provider ? formatProviderName(provider) : providerID
5252
}, [providersData])
5353

54-
const favoriteModelsWithNames = useMemo(() => {
55-
return favoriteModels
56-
.filter(favorite => `${favorite.providerID}/${favorite.modelID}` !== modelString)
57-
.slice(0, 5)
58-
.map(favorite => ({
59-
...favorite,
60-
displayName: getDisplayName(favorite.providerID, favorite.modelID),
61-
providerName: getProviderName(favorite.providerID),
62-
key: `${favorite.providerID}/${favorite.modelID}`,
63-
}))
54+
const favoriteModelsWithNames = useMemo(() => {
55+
return favoriteModels
56+
.filter(favorite => `${favorite.providerID}/${favorite.modelID}` !== modelString)
57+
.slice(0, 5)
58+
.map(favorite => ({
59+
...favorite,
60+
displayName: getDisplayName(favorite.providerID, favorite.modelID),
61+
providerName: getProviderName(favorite.providerID),
62+
key: `${favorite.providerID}/${favorite.modelID}`,
63+
}))
6464
}, [favoriteModels, getDisplayName, getProviderName, modelString])
6565

66-
const recentModelsWithNames = useMemo(() => {
67-
return recentModels
68-
.filter(recent => {
69-
const key = `${recent.providerID}/${recent.modelID}`
70-
return key !== modelString && !favoriteModels.some(favorite => favorite.providerID === recent.providerID && favorite.modelID === recent.modelID)
71-
})
72-
.slice(0, 5)
73-
.map(recent => ({
74-
...recent,
75-
displayName: getDisplayName(recent.providerID, recent.modelID),
76-
providerName: getProviderName(recent.providerID),
77-
key: `${recent.providerID}/${recent.modelID}`,
78-
}))
66+
const recentModelsWithNames = useMemo(() => {
67+
return recentModels
68+
.filter(recent => {
69+
const key = `${recent.providerID}/${recent.modelID}`
70+
return key !== modelString && !favoriteModels.some(favorite => favorite.providerID === recent.providerID && favorite.modelID === recent.modelID)
71+
})
72+
.slice(0, 5)
73+
.map(recent => ({
74+
...recent,
75+
displayName: getDisplayName(recent.providerID, recent.modelID),
76+
providerName: getProviderName(recent.providerID),
77+
key: `${recent.providerID}/${recent.modelID}`,
78+
}))
7979
}, [recentModels, favoriteModels, getDisplayName, getProviderName, modelString])
8080

8181
const duplicateDisplayNames = useMemo(() => {
@@ -87,6 +87,15 @@ export function ModelQuickSelect({
8787
return new Set(Object.entries(counts).filter(([, count]) => count > 1).map(([name]) => name))
8888
}, [favoriteModelsWithNames, recentModelsWithNames])
8989

90+
const duplicateModelIds = useMemo(() => {
91+
const counts = [...favoriteModelsWithNames, ...recentModelsWithNames].reduce<Record<string, number>>((acc, item) => {
92+
acc[item.modelID] = (acc[item.modelID] || 0) + 1
93+
return acc
94+
}, {})
95+
96+
return new Set(Object.entries(counts).filter(([, count]) => count > 1).map(([id]) => id))
97+
}, [favoriteModelsWithNames, recentModelsWithNames])
98+
9099
const handleVariantSelect = (variant: string | undefined) => {
91100
if (variant === undefined) {
92101
clearVariant()
@@ -122,7 +131,7 @@ export function ModelQuickSelect({
122131
<>
123132
<DropdownMenuItem className="flex items-center justify-between font-medium">
124133
<span className="truncate text-orange-500">
125-
{duplicateDisplayNames.has(currentModelDisplayName)
134+
{duplicateModelIds.has(model.modelID) || duplicateDisplayNames.has(currentModelDisplayName)
126135
? `${currentProviderName}/${currentModelDisplayName}`
127136
: currentModelDisplayName}
128137
</span>
@@ -170,7 +179,7 @@ export function ModelQuickSelect({
170179
className="flex items-center justify-between"
171180
>
172181
<span className="truncate">
173-
{duplicateDisplayNames.has(favorite.displayName)
182+
{duplicateModelIds.has(favorite.modelID) || duplicateDisplayNames.has(favorite.displayName)
174183
? `${favorite.providerName}/${favorite.displayName}`
175184
: favorite.displayName}
176185
</span>
@@ -189,7 +198,7 @@ export function ModelQuickSelect({
189198
className="flex items-center justify-between"
190199
>
191200
<span className="truncate">
192-
{duplicateDisplayNames.has(recent.displayName)
201+
{duplicateModelIds.has(recent.modelID) || duplicateDisplayNames.has(recent.displayName)
193202
? `${recent.providerName}/${recent.displayName}`
194203
: recent.displayName}
195204
</span>

0 commit comments

Comments
 (0)