From 408130619bfccae868f1d89340272f37a622f925 Mon Sep 17 00:00:00 2001
From: Ishaan Jaff <ishaanjaffer0324@gmail.com>
Date: Mon, 27 May 2024 09:01:47 -0700
Subject: [PATCH] ui - show supported openai params

---
 .../src/components/model_hub.tsx              | 23 +++++++++++++++++--
 1 file changed, 21 insertions(+), 2 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/model_hub.tsx b/ui/litellm-dashboard/src/components/model_hub.tsx
index 63431d13b3..2bec7d0138 100644
--- a/ui/litellm-dashboard/src/components/model_hub.tsx
+++ b/ui/litellm-dashboard/src/components/model_hub.tsx
@@ -32,6 +32,7 @@ interface ModelInfo {
     supports_vision: boolean;
     max_input_tokens?: number;
     max_output_tokens?: number;
+    supported_openai_params?: string[];
 
     // Add other properties if needed
 
@@ -193,6 +194,7 @@ const ModelHub: React.FC<ModelHubProps> = ({
               <Text>Supports Vision: {model?.supports_vision == true ? "Yes" : "No"}</Text>
               <Text>Max Input Tokens: {model?.max_input_tokens ? model?.max_input_tokens : "N/A"}</Text>
               <Text>Max Output Tokens: {model?.max_output_tokens ? model?.max_output_tokens : "N/A"}</Text>
+              
 
               </div>
 
@@ -218,7 +220,7 @@ const ModelHub: React.FC<ModelHubProps> = ({
 
       <Modal
 
-        title="Model Usage"
+        title={selectedModel && selectedModel.model_group ? selectedModel.model_group : "Unknown Model"}
         width={800}
 
         visible={isModalVisible}
@@ -234,11 +236,12 @@ const ModelHub: React.FC<ModelHubProps> = ({
 
           <div>
 
-            <p><strong>Model Name:</strong> {selectedModel.model_group}</p>
+            <p className='mb-4'><strong>Model Information & Usage:</strong> {selectedModel.model_group}</p>
            
             <TabGroup>
                   <TabList>
                     <Tab>OpenAI Python SDK</Tab>
+                    <Tab>Supported OpenAI Params</Tab>
                     <Tab>LlamaIndex</Tab>
                     <Tab>Langchain Py</Tab>
                   </TabList>
@@ -265,6 +268,22 @@ response = client.chat.completions.create(
 print(response)
             `}
                       </SyntaxHighlighter>
+                    </TabPanel>
+                    <TabPanel>
+
+                      
+                        {
+                          selectedModel?.supported_openai_params?.map((param) => (
+                            
+                             <pre>
+                              {param}
+                             </pre>
+                            
+                              
+                          ))
+                        }
+                         
+
                     </TabPanel>
                     <TabPanel>
                       <SyntaxHighlighter language="python">