diff --git a/client/src/components/Chat/Menus/Endpoints/components/EndpointItem.tsx b/client/src/components/Chat/Menus/Endpoints/components/EndpointItem.tsx index c21c3a8e4e..1679d0285a 100644 --- a/client/src/components/Chat/Menus/Endpoints/components/EndpointItem.tsx +++ b/client/src/components/Chat/Menus/Endpoints/components/EndpointItem.tsx @@ -14,6 +14,7 @@ import { cn } from '~/utils'; interface EndpointItemProps { endpoint: Endpoint; + endpointIndex: number; } const SettingsButton = ({ @@ -54,7 +55,7 @@ const SettingsButton = ({ ); }; -export function EndpointItem({ endpoint }: EndpointItemProps) { +export function EndpointItem({ endpoint, endpointIndex }: EndpointItemProps) { const localize = useLocalize(); const { agentsMap, @@ -153,8 +154,21 @@ export function EndpointItem({ endpoint }: EndpointItemProps) { ))} {/* Render endpoint models */} {filteredModels - ? renderEndpointModels(endpoint, endpoint.models || [], selectedModel, filteredModels) - : endpoint.models && renderEndpointModels(endpoint, endpoint.models, selectedModel)} + ? renderEndpointModels( + endpoint, + endpoint.models || [], + selectedModel, + filteredModels, + endpointIndex, + ) + : endpoint.models && + renderEndpointModels( + endpoint, + endpoint.models, + selectedModel, + undefined, + endpointIndex, + )} )} @@ -198,7 +212,11 @@ export function EndpointItem({ endpoint }: EndpointItemProps) { } export function renderEndpoints(mappedEndpoints: Endpoint[]) { - return mappedEndpoints.map((endpoint) => ( - + return mappedEndpoints.map((endpoint, index) => ( + )); } diff --git a/client/src/components/Chat/Menus/Endpoints/components/EndpointModelItem.tsx b/client/src/components/Chat/Menus/Endpoints/components/EndpointModelItem.tsx index aab5b5889f..cb9d24eb61 100644 --- a/client/src/components/Chat/Menus/Endpoints/components/EndpointModelItem.tsx +++ b/client/src/components/Chat/Menus/Endpoints/components/EndpointModelItem.tsx @@ -109,7 +109,6 @@ export function EndpointModelItem({ modelId, endpoint, isSelected }: EndpointMod return ( handleSelectModel(endpoint, modelId ?? '')} className="group flex w-full cursor-pointer items-center justify-between rounded-lg px-2 text-sm" > @@ -161,14 +160,16 @@ export function renderEndpointModels( models: Array<{ name: string; isGlobal?: boolean }>, selectedModel: string | null, filteredModels?: string[], + endpointIndex?: number, ) { const modelsToRender = filteredModels || models.map((model) => model.name); + const indexSuffix = endpointIndex != null ? `-${endpointIndex}` : ''; return modelsToRender.map( - (modelId) => + (modelId, modelIndex) => endpoint && (