From cad68281d447b1395fbbe66fea8ae1a829f73011 Mon Sep 17 00:00:00 2001
From: OpenClaw Assistant <assistant@openclaw.ai>
Date: Sat, 21 Feb 2026 19:25:37 +0000
Subject: [PATCH] feat(ui): update auto router submit handler for complexity
 router

- Handle complexity_router model type in submit handler
- Generate correct litellm_params for complexity router:
  - model: auto_router/complexity_router
  - complexity_router_config: { tiers: { SIMPLE, MEDIUM, COMPLEX, REASONING } }
- Keep existing semantic router handling intact
- Add success notification with router type name
---
 .../handle_add_auto_router_submit.tsx         | 76 +++++++++++++------
 1 file changed, 53 insertions(+), 23 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/add_model/handle_add_auto_router_submit.tsx b/ui/litellm-dashboard/src/components/add_model/handle_add_auto_router_submit.tsx
index f813f2f0b77..60b68fc4c94 100644
--- a/ui/litellm-dashboard/src/components/add_model/handle_add_auto_router_submit.tsx
+++ b/ui/litellm-dashboard/src/components/add_model/handle_add_auto_router_submit.tsx
@@ -5,26 +5,51 @@ export const handleAddAutoRouterSubmit = async (values: any, accessToken: string
   try {
     console.log("=== AUTO ROUTER SUBMIT HANDLER CALLED ===");
     console.log("handling auto router submit for formValues:", values);
-    console.log("Access token:", accessToken ? "Present" : "Missing");
-    console.log("Form:", form ? "Present" : "Missing");
-    console.log("Callback:", callback ? "Present" : "Missing");
+    console.log("Model type:", values.model_type);
 
-    // Create auto router configuration
-    const autoRouterConfig: any = {
-      model_name: values.auto_router_name,
-      litellm_params: {
-        model: `auto_router/${values.auto_router_name}`,
-        auto_router_config: JSON.stringify(values.auto_router_config), // Convert JSON object to string as expected by backend
-        auto_router_default_model: values.auto_router_default_model,
-      },
-      model_info: {},
-    };
+    let autoRouterConfig: any;
 
-    // Add optional embedding model if provided
-    if (values.auto_router_embedding_model && values.auto_router_embedding_model !== "custom") {
-      autoRouterConfig.litellm_params.auto_router_embedding_model = values.auto_router_embedding_model;
-    } else if (values.custom_embedding_model) {
-      autoRouterConfig.litellm_params.auto_router_embedding_model = values.custom_embedding_model;
+    if (values.model_type === "complexity_router") {
+      // Complexity Router configuration
+      console.log("Creating complexity router configuration");
+      
+      autoRouterConfig = {
+        model_name: values.auto_router_name,
+        litellm_params: {
+          // Use special prefix for complexity router
+          model: `auto_router/complexity_router`,
+          // Pass the complexity router config as a JSON object (not stringified)
+          complexity_router_config: values.complexity_router_config,
+          // Default model for fallback (use MEDIUM or first available tier)
+          complexity_router_default_model: values.auto_router_default_model,
+        },
+        model_info: {},
+      };
+
+      console.log("Complexity router config:", values.complexity_router_config);
+      
+    } else {
+      // Semantic Router configuration (existing behavior)
+      console.log("Creating semantic router configuration");
+      
+      autoRouterConfig = {
+        model_name: values.auto_router_name,
+        litellm_params: {
+          model: `auto_router/${values.auto_router_name}`,
+          auto_router_config: JSON.stringify(values.auto_router_config), // Convert JSON object to string as expected by backend
+          auto_router_default_model: values.auto_router_default_model,
+        },
+        model_info: {},
+      };
+
+      // Add optional embedding model if provided
+      if (values.auto_router_embedding_model && values.auto_router_embedding_model !== "custom") {
+        autoRouterConfig.litellm_params.auto_router_embedding_model = values.auto_router_embedding_model;
+      } else if (values.custom_embedding_model) {
+        autoRouterConfig.litellm_params.auto_router_embedding_model = values.custom_embedding_model;
+      }
+
+      console.log("Semantic router config (stringified):", autoRouterConfig.litellm_params.auto_router_config);
     }
 
     // Add team information if provided
@@ -38,18 +63,23 @@ export const handleAddAutoRouterSubmit = async (values: any, accessToken: string
     }
 
     console.log("Auto router configuration to be created:", autoRouterConfig);
-    console.log("Auto router config (stringified):", autoRouterConfig.litellm_params.auto_router_config);
 
     // Create the auto router using the same model creation endpoint
-    console.log("Calling modelCreateCall with:", {
-      accessToken: accessToken ? "Present" : "Missing",
-      config: autoRouterConfig,
-    });
+    console.log("Calling modelCreateCall...");
     const response: any = await modelCreateCall(accessToken, autoRouterConfig as Model);
     console.log(`response for auto router create call:`, response);
 
+    // Show success notification
+    const routerTypeName = values.model_type === "complexity_router" ? "Complexity Router" : "Semantic Router";
+    NotificationManager.fromBackend(`Successfully created ${routerTypeName}: ${values.auto_router_name}`, "success");
+
     // Reset the form
     form.resetFields();
+
+    // Call the callback if provided (e.g., to close modal)
+    if (callback) {
+      callback();
+    }
   } catch (error) {
     console.error("Failed to add auto router:", error);
     NotificationManager.fromBackend("Failed to add auto router: " + error);