fix(ui): fix add slack/langfuse logging on ui

litellm/proxy/_new_secret_config.yaml

@@ -1,57 +1,60 @@
-model_list:
-- model_name: gpt-3.5-turbo
-  litellm_params:
-    model: gpt-3.5-turbo
-- model_name: fake-openai-endpoint
-  litellm_params:
-    model: openai/my-fake-model
-    api_key: my-fake-key
-    api_base: https://openai-function-calling-workers.tasslexyz.workers.dev/
-    stream_timeout: 0.001
-- model_name: fake-openai-endpoint
-  litellm_params:
-    model: openai/my-fake-model-2
-    api_key: my-fake-key
-    api_base: https://openai-function-calling-workers.tasslexyz.workers.dev/
-    stream_timeout: 0.001
-- litellm_params:
-      model: azure/chatgpt-v-2
-      api_base: os.environ/AZURE_API_BASE
-      api_key: os.environ/AZURE_API_KEY
-      api_version: "2023-07-01-preview"
-      stream_timeout: 0.001
-  model_name: azure-gpt-3.5
-- model_name: text-embedding-ada-002
-  litellm_params:
-    model: text-embedding-ada-002
-    api_key: os.environ/OPENAI_API_KEY
-- model_name: gpt-instruct
-  litellm_params:
-    model: text-completion-openai/gpt-3.5-turbo-instruct
-    # api_key: my-fake-key
-    # api_base: https://exampleopenaiendpoint-production.up.railway.app/
-
-router_settings:
-  # routing_strategy: usage-based-routing-v2 
-  # redis_url: "os.environ/REDIS_URL"
-  redis_host: os.environ/REDIS_HOST
-  redis_port: os.environ/REDIS_PORT
-  redis_password: os.environ/REDIS_PASSWORD
-  enable_pre_call_checks: True
-
-litellm_settings:
-  num_retries: 3 # retry call 3 times on each model_name
-  allowed_fails: 3 # cooldown model if it fails > 1 call in a minute.
-  success_callback: ["prometheus", "langsmith"]
-  failure_callback: ["prometheus"]
-  service_callback: ["prometheus_system"]
-  # cache: True
-  # cache_params:
-  #   type: "redis"
-
-
+environment_variables:
+  LANGFUSE_PUBLIC_KEY: Q6K8MQN6L7sPYSJiFKM9eNrETOx6V/FxVPup4FqdKsZK1hyR4gyanlQ2KHLg5D5afng99uIt0JCEQ2jiKF9UxFvtnb4BbJ4qpeceH+iK8v/bdg==
+  LANGFUSE_SECRET_KEY: 5xQ7KMa6YMLsm+H/Pf1VmlqWq1NON5IoCxABhkUBeSck7ftsj2CmpkL2ZwrxwrktgiTUBH+3gJYBX+XBk7lqOOUpvmiLjol/E5lCqq0M1CqLWA==
+  SLACK_WEBHOOK_URL: RJjhS0Hhz0/s07sCIf1OTXmTGodpK9L2K9p953Z+fOX0l2SkPFT6mB9+yIrLufmlwEaku5NNEBKy//+AG01yOd+7wV1GhK65vfj3B/gTN8t5cuVnR4vFxKY5Rx4eSGLtzyAs+aIBTp4GoNXDIjroCqfCjPkItEZWCg==
 general_settings:
-  alerting: ["slack"]
+  alerting:
+  - slack
+  alerting_threshold: 300
+  database_connection_pool_limit: 100
+  database_connection_timeout: 60
   disable_master_key_return: true
-  alerting_threshold: 300 # sends alerts if requests hang for 5min+ and responses take 5min+
-  proxy_batch_write_at: 60 # Frequency of batch writing logs to server (in seconds)
+  health_check_interval: 300
+  proxy_batch_write_at: 60
+  ui_access_mode: all
+litellm_settings:
+  allowed_fails: 3
+  failure_callback:
+  - prometheus
+  num_retries: 3
+  service_callback:
+  - prometheus_system
+  success_callback:
+  - langfuse
+  - prometheus
+  - langsmith
+model_list:
+- litellm_params:
+    model: gpt-3.5-turbo
+  model_name: gpt-3.5-turbo
+- litellm_params:
+    api_base: https://openai-function-calling-workers.tasslexyz.workers.dev/
+    api_key: my-fake-key
+    model: openai/my-fake-model
+    stream_timeout: 0.001
+  model_name: fake-openai-endpoint
+- litellm_params:
+    api_base: https://openai-function-calling-workers.tasslexyz.workers.dev/
+    api_key: my-fake-key
+    model: openai/my-fake-model-2
+    stream_timeout: 0.001
+  model_name: fake-openai-endpoint
+- litellm_params:
+    api_base: os.environ/AZURE_API_BASE
+    api_key: os.environ/AZURE_API_KEY
+    api_version: 2023-07-01-preview
+    model: azure/chatgpt-v-2
+    stream_timeout: 0.001
+  model_name: azure-gpt-3.5
+- litellm_params:
+    api_key: os.environ/OPENAI_API_KEY
+    model: text-embedding-ada-002
+  model_name: text-embedding-ada-002
+- litellm_params:
+    model: text-completion-openai/gpt-3.5-turbo-instruct
+  model_name: gpt-instruct
+router_settings:
+  enable_pre_call_checks: true
+  redis_host: os.environ/REDIS_HOST
+  redis_password: os.environ/REDIS_PASSWORD
+  redis_port: os.environ/REDIS_PORT

ui/litellm-dashboard/src/components/settings.tsx

@@ -27,6 +27,18 @@ interface SettingsPageProps {
   userID: string | null;
 }
 
+interface AlertingVariables {
+  SLACK_WEBHOOK_URL: string | null,
+  LANGFUSE_PUBLIC_KEY: string | null, 
+  LANGFUSE_SECRET_KEY: string | null, 
+  LANGFUSE_HOST: string | null
+}
+
+interface AlertingObject {
+  name: string, 
+  variables: AlertingVariables
+}
+
 const Settings: React.FC<SettingsPageProps> = ({
   accessToken,
   userRole,
@@ -114,10 +126,19 @@ const Settings: React.FC<SettingsPageProps> = ({
           }
         };
         setCallbacksCall(accessToken, payload);
-
+        let newCallback: AlertingObject = {
+          "name": values.callback,
+          "variables": {
+            "SLACK_WEBHOOK_URL": null,
+            "LANGFUSE_HOST": null, 
+            "LANGFUSE_PUBLIC_KEY": values.langfusePublicKey, 
+            "LANGFUSE_SECRET_KEY": values.langfusePrivateKey
+          }
+        }
         // add langfuse to callbacks
-        setCallbacks(callbacks ? [...callbacks, values.callback] : [values.callback]);
+        setCallbacks(callbacks ? [...callbacks, newCallback] : [newCallback]);
       } else if (values.callback === 'slack') {
+        console.log(`values.slackWebhookUrl: ${values.slackWebhookUrl}`)
         payload = {
           general_settings: {
             alerting: ["slack"],
@@ -130,7 +151,18 @@ const Settings: React.FC<SettingsPageProps> = ({
         setCallbacksCall(accessToken, payload);
 
         // add slack to callbacks
-        setCallbacks(callbacks ? [...callbacks, values.callback] : [values.callback]);
+        console.log(`values.callback: ${values.callback}`)
+
+        let newCallback: AlertingObject = {
+          "name": values.callback,
+          "variables": {
+            "SLACK_WEBHOOK_URL": values.slackWebhookUrl,
+            "LANGFUSE_HOST": null, 
+            "LANGFUSE_PUBLIC_KEY": null, 
+            "LANGFUSE_SECRET_KEY": null
+          }
+        }
+        setCallbacks(callbacks ? [...callbacks, newCallback] : [newCallback]);
       } else {
         payload = {
           error: 'Invalid callback value'
@@ -150,6 +182,7 @@ const Settings: React.FC<SettingsPageProps> = ({
     return null;
   }
 
+  console.log(`callbacks: ${callbacks}`)
   return (
     <div className="w-full mx-4">
       <Grid numItems={1} className="gap-2 p-8 w-full mt-2">
@@ -170,7 +203,7 @@ const Settings: React.FC<SettingsPageProps> = ({
       </TableCell>
       <TableCell>
         <ul>
-        {Object.entries(callback.variables).map(([key, value]) => (
+        {Object.entries(callback.variables ?? {}).filter(([key, value]) => value !== null).map(([key, value]) => (
   <li key={key}>
     <Text className="mt-2">{key}</Text>
     {key === "LANGFUSE_HOST" ? (
@@ -249,7 +282,7 @@ const Settings: React.FC<SettingsPageProps> = ({
                   { required: true, message: "Please enter the public key" },
                 ]}
               >
-                <Input.Password />
+                <TextInput type="password"/>
               </Form.Item>
 
               <Form.Item
@@ -259,7 +292,7 @@ const Settings: React.FC<SettingsPageProps> = ({
                   { required: true, message: "Please enter the private key" },
                 ]}
               >
-                <Input.Password />
+                <TextInput type="password"/>
               </Form.Item>
             </>
           )}
@@ -272,7 +305,7 @@ const Settings: React.FC<SettingsPageProps> = ({
                 { required: true, message: "Please enter the Slack webhook URL" },
               ]}
             >
-              <Input />
+              <TextInput/>
             </Form.Item>
           )}