From 8cbf7c80976b7e8fab7d99dfd7a669483ee3cae9 Mon Sep 17 00:00:00 2001
From: Weves <chrisweaver101@gmail.com>
Date: Tue, 7 May 2024 17:09:09 -0700
Subject: [PATCH] Custom LLM provider fix

---
 .../llm/ConfiguredLLMProviderDisplay.tsx      | 33 ++++++++++++++-----
 .../app/admin/models/llm/LLMConfiguration.tsx |  5 +--
 2 files changed, 25 insertions(+), 13 deletions(-)

diff --git a/web/src/app/admin/models/llm/ConfiguredLLMProviderDisplay.tsx b/web/src/app/admin/models/llm/ConfiguredLLMProviderDisplay.tsx
index ec58db7f3..3c28f25cd 100644
--- a/web/src/app/admin/models/llm/ConfiguredLLMProviderDisplay.tsx
+++ b/web/src/app/admin/models/llm/ConfiguredLLMProviderDisplay.tsx
@@ -15,7 +15,7 @@ function LLMProviderUpdateModal({
   shouldMarkAsDefault,
   setPopup,
 }: {
-  llmProviderDescriptor: WellKnownLLMProviderDescriptor | null;
+  llmProviderDescriptor: WellKnownLLMProviderDescriptor | null | undefined;
   onClose: () => void;
   existingLlmProvider?: FullLLMProvider;
   shouldMarkAsDefault?: boolean;
@@ -55,7 +55,7 @@ function LLMProviderDisplay({
   existingLlmProvider,
   shouldMarkAsDefault,
 }: {
-  llmProviderDescriptor: WellKnownLLMProviderDescriptor | null;
+  llmProviderDescriptor: WellKnownLLMProviderDescriptor | null | undefined;
   existingLlmProvider: FullLLMProvider;
   shouldMarkAsDefault?: boolean;
 }) {
@@ -143,8 +143,10 @@ function LLMProviderDisplay({
 
 export function ConfiguredLLMProviderDisplay({
   existingLlmProviders,
+  llmProviderDescriptors,
 }: {
   existingLlmProviders: FullLLMProvider[];
+  llmProviderDescriptors: WellKnownLLMProviderDescriptor[];
 }) {
   existingLlmProviders = existingLlmProviders.sort((a, b) => {
     if (a.is_default_provider && !b.is_default_provider) {
@@ -158,13 +160,26 @@ export function ConfiguredLLMProviderDisplay({
 
   return (
     <div className="gap-y-4 flex flex-col">
-      {existingLlmProviders.map((provider) => (
-        <LLMProviderDisplay
-          key={provider.id}
-          llmProviderDescriptor={null}
-          existingLlmProvider={provider}
-        />
-      ))}
+      {existingLlmProviders.map((provider) => {
+        const defaultProviderDesciptor = llmProviderDescriptors.find(
+          (llmProviderDescriptors) =>
+            llmProviderDescriptors.name === provider.provider
+        );
+        console.log(provider.model_names.length);
+
+        return (
+          <LLMProviderDisplay
+            key={provider.id}
+            // if the user has specified custom model names,
+            // then the provider is custom - don't use the default
+            // provider descriptor
+            llmProviderDescriptor={
+              provider.model_names.length > 0 ? null : defaultProviderDesciptor
+            }
+            existingLlmProvider={provider}
+          />
+        );
+      })}
     </div>
   );
 }
diff --git a/web/src/app/admin/models/llm/LLMConfiguration.tsx b/web/src/app/admin/models/llm/LLMConfiguration.tsx
index 47a17262e..d23e8a4e3 100644
--- a/web/src/app/admin/models/llm/LLMConfiguration.tsx
+++ b/web/src/app/admin/models/llm/LLMConfiguration.tsx
@@ -157,6 +157,7 @@ export function LLMConfiguration() {
           </Text>
           <ConfiguredLLMProviderDisplay
             existingLlmProviders={existingLlmProviders}
+            llmProviderDescriptors={llmProviderDescriptors}
           />
         </>
       ) : (
@@ -173,10 +174,6 @@ export function LLMConfiguration() {
 
       <div className="gap-y-4 flex flex-col">
         {llmProviderDescriptors.map((llmProviderDescriptor) => {
-          const existingLlmProvider = existingLlmProviders.find(
-            (llmProvider) => llmProvider.name === llmProviderDescriptor.name
-          );
-
           return (
             <DefaultLLMProviderDisplay
               key={llmProviderDescriptor.name}