From 91eee78a8cb57d64113d1a8141cb9a02407cf060 Mon Sep 17 00:00:00 2001
From: Ishaan Jaff <ishaanjaffer0324@gmail.com>
Date: Thu, 24 Jul 2025 20:19:22 -0700
Subject: [PATCH] Revert "EditAutoRouterTabProps"

This reverts commit 2835d3a3743e6411b9914a0b01381050e2273ad7.
---
 .../edit_model/edit_auto_router_tab.tsx       | 293 ------------------
 1 file changed, 293 deletions(-)
 delete mode 100644 ui/litellm-dashboard/src/components/edit_model/edit_auto_router_tab.tsx

diff --git a/ui/litellm-dashboard/src/components/edit_model/edit_auto_router_tab.tsx b/ui/litellm-dashboard/src/components/edit_model/edit_auto_router_tab.tsx
deleted file mode 100644
index 3d33472bc6..0000000000
--- a/ui/litellm-dashboard/src/components/edit_model/edit_auto_router_tab.tsx
+++ /dev/null
@@ -1,293 +0,0 @@
-import React, { useState, useEffect } from "react";
-import { Card, Form, Button, Tooltip, Typography, Select as AntdSelect, message } from "antd";
-import type { FormInstance } from "antd";
-import { Text, TextInput } from "@tremor/react";
-import { modelAvailableCall } from "../networking";
-import { all_admin_roles } from "@/utils/roles";
-import { fetchAvailableModels, ModelGroup } from "../chat_ui/llm_calls/fetch_models";
-import RouterConfigBuilder from "../add_model/router_config_builder";
-
-const { Title } = Typography;
-
-interface EditAutoRouterTabProps {
-  form: FormInstance;
-  localModelData: any;
-  accessToken: string;
-  userRole: string;
-  isEditing: boolean;
-  setIsDirty: (dirty: boolean) => void;
-}
-
-const EditAutoRouterTab: React.FC<EditAutoRouterTabProps> = ({
-  form,
-  localModelData,
-  accessToken,
-  userRole,
-  isEditing,
-  setIsDirty,
-}) => {
-  const [modelAccessGroups, setModelAccessGroups] = useState<string[]>([]);
-  const [modelInfo, setModelInfo] = useState<ModelGroup[]>([]);
-  const [showCustomDefaultModel, setShowCustomDefaultModel] = useState<boolean>(false);
-  const [showCustomEmbeddingModel, setShowCustomEmbeddingModel] = useState<boolean>(false);
-  const [routerConfig, setRouterConfig] = useState<any>(null);
-
-  const isAdmin = all_admin_roles.includes(userRole);
-
-  useEffect(() => {
-    const fetchModelAccessGroups = async () => {
-      const response = await modelAvailableCall(accessToken, "", "", false, null, true, true);
-      setModelAccessGroups(response["data"].map((model: any) => model["id"]));
-    };
-    fetchModelAccessGroups();
-  }, [accessToken]);
-
-  useEffect(() => {
-    const loadModels = async () => {
-      try {
-        const uniqueModels = await fetchAvailableModels(accessToken);
-        console.log("Fetched models for auto router edit:", uniqueModels);
-        setModelInfo(uniqueModels);
-      } catch (error) {
-        console.error("Error fetching model info for auto router edit:", error);
-      }
-    };
-    loadModels();
-  }, [accessToken]);
-
-  // Initialize form values and router config when localModelData changes
-  useEffect(() => {
-    if (localModelData) {
-      const autoRouterConfig = localModelData.litellm_params?.auto_router_config;
-      let parsedConfig = null;
-      
-      if (autoRouterConfig) {
-        try {
-          // Parse the JSON string to object
-          parsedConfig = typeof autoRouterConfig === 'string' 
-            ? JSON.parse(autoRouterConfig) 
-            : autoRouterConfig;
-          setRouterConfig(parsedConfig);
-        } catch (error) {
-          console.error("Error parsing auto router config:", error);
-        }
-      }
-
-      // Check if using custom models
-      const defaultModel = localModelData.litellm_params?.auto_router_default_model;
-      const embeddingModel = localModelData.litellm_params?.auto_router_embedding_model;
-      
-      setShowCustomDefaultModel(defaultModel && !modelInfo.some(m => m.model_group === defaultModel));
-      setShowCustomEmbeddingModel(embeddingModel && !modelInfo.some(m => m.model_group === embeddingModel));
-    }
-  }, [localModelData, modelInfo]);
-
-  const handleRouterConfigChange = (config: any) => {
-    setRouterConfig(config);
-    form.setFieldValue('auto_router_config', config);
-    setIsDirty(true);
-  };
-
-  return (
-    <div className="space-y-6">
-      <div>
-        <Title level={3}>Auto Router Configuration</Title>
-        <Text className="text-gray-600">
-          Configure the auto routing logic that automatically selects the best model based on user input patterns and semantic matching.
-        </Text>
-      </div>
-
-      <div className="space-y-4">
-        {/* Auto Router Name */}
-        <div>
-          <Text className="font-medium">Auto Router Name</Text>
-          {isEditing ? (
-            <Form.Item name="auto_router_name" className="mb-0">
-              <TextInput 
-                placeholder="e.g., auto_router_1, smart_routing"
-                onChange={() => setIsDirty(true)}
-              />
-            </Form.Item>
-          ) : (
-            <div className="mt-1 p-2 bg-gray-50 rounded">
-              {localModelData.model_name || "Not Set"}
-            </div>
-          )}
-        </div>
-
-        {/* Router Configuration Builder */}
-        {isEditing ? (
-          <div className="w-full">
-            <RouterConfigBuilder
-              modelInfo={modelInfo}
-              value={routerConfig}
-              onChange={handleRouterConfigChange}
-            />
-          </div>
-        ) : (
-          <div>
-            <Text className="font-medium">Router Configuration</Text>
-            <div className="mt-1 p-2 bg-gray-50 rounded">
-              {routerConfig ? (
-                <div className="space-y-2">
-                  <Text className="text-sm font-medium">Routes: {routerConfig.routes?.length || 0}</Text>
-                  {routerConfig.routes?.map((route: any, index: number) => (
-                    <div key={index} className="text-sm bg-white p-2 rounded border">
-                      <div><strong>Model:</strong> {route.name}</div>
-                      <div><strong>Description:</strong> {route.description}</div>
-                      <div><strong>Utterances:</strong> {route.utterances?.length || 0} examples</div>
-                      <div><strong>Score Threshold:</strong> {route.score_threshold}</div>
-                    </div>
-                  ))}
-                </div>
-              ) : (
-                "No router configuration"
-              )}
-            </div>
-          </div>
-        )}
-
-        {/* Default Model */}
-        <div>
-          <Text className="font-medium">Default Model</Text>
-          {isEditing ? (
-            <>
-              <Form.Item name="auto_router_default_model" className="mb-0">
-                <AntdSelect
-                  placeholder="Select a default model"
-                  onChange={(value) => {
-                    setShowCustomDefaultModel(value === 'custom');
-                    setIsDirty(true);
-                  }}
-                  options={[
-                    ...Array.from(new Set(modelInfo.map(option => option.model_group)))
-                      .map((model_group) => ({
-                        value: model_group,
-                        label: model_group,
-                      })),
-                    { value: 'custom', label: 'Enter custom model name' }
-                  ]}
-                  style={{ width: "100%" }}
-                  showSearch={true}
-                />
-              </Form.Item>
-              {showCustomDefaultModel && (
-                <Form.Item name="custom_default_model" className="mb-0 mt-2">
-                  <TextInput 
-                    placeholder="Enter custom model name"
-                    onChange={(e) => {
-                      form.setFieldValue('auto_router_default_model', e.target.value);
-                      setIsDirty(true);
-                    }}
-                  />
-                </Form.Item>
-              )}
-            </>
-          ) : (
-            <div className="mt-1 p-2 bg-gray-50 rounded">
-              {localModelData.litellm_params?.auto_router_default_model || "Not Set"}
-            </div>
-          )}
-        </div>
-
-        {/* Embedding Model */}
-        <div>
-          <Text className="font-medium">Embedding Model</Text>
-          {isEditing ? (
-            <>
-              <Form.Item name="auto_router_embedding_model" className="mb-0">
-                <AntdSelect
-                  placeholder="Select an embedding model (optional)"
-                  onChange={(value) => {
-                    setShowCustomEmbeddingModel(value === 'custom');
-                    setIsDirty(true);
-                  }}
-                  options={[
-                    ...Array.from(new Set(modelInfo.map(option => option.model_group)))
-                      .map((model_group) => ({
-                        value: model_group,
-                        label: model_group,
-                      })),
-                    { value: 'custom', label: 'Enter custom model name' }
-                  ]}
-                  style={{ width: "100%" }}
-                  showSearch={true}
-                  allowClear
-                />
-              </Form.Item>
-              {showCustomEmbeddingModel && (
-                <Form.Item name="custom_embedding_model" className="mb-0 mt-2">
-                  <TextInput 
-                    placeholder="Enter custom embedding model name"
-                    onChange={(e) => {
-                      form.setFieldValue('auto_router_embedding_model', e.target.value);
-                      setIsDirty(true);
-                    }}
-                  />
-                </Form.Item>
-              )}
-            </>
-          ) : (
-            <div className="mt-1 p-2 bg-gray-50 rounded">
-              {localModelData.litellm_params?.auto_router_embedding_model || "Not Set"}
-            </div>
-          )}
-        </div>
-
-        {/* Model Access Groups - Admin only */}
-        {isAdmin && (
-          <div>
-            <Text className="font-medium">Model Access Groups</Text>
-            {isEditing ? (
-              <Form.Item name="model_access_group" className="mb-0">
-                <AntdSelect
-                  mode="tags"
-                  showSearch
-                  placeholder="Select existing groups or type to create new ones"
-                  optionFilterProp="children"
-                  tokenSeparators={[',']}
-                  options={modelAccessGroups.map((group) => ({
-                    value: group,
-                    label: group
-                  }))}
-                  maxTagCount="responsive"
-                  allowClear
-                  onChange={() => setIsDirty(true)}
-                />
-              </Form.Item>
-            ) : (
-              <div className="mt-1 p-2 bg-gray-50 rounded">
-                {localModelData.model_info?.access_groups ? (
-                  Array.isArray(localModelData.model_info.access_groups) ? (
-                    localModelData.model_info.access_groups.length > 0 ? (
-                      <div className="flex flex-wrap gap-1">
-                        {localModelData.model_info.access_groups.map(
-                          (group: string, index: number) => (
-                            <span
-                              key={index}
-                              className="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800"
-                            >
-                              {group}
-                            </span>
-                          )
-                        )}
-                      </div>
-                    ) : (
-                      "No groups assigned"
-                    )
-                  ) : (
-                    localModelData.model_info.access_groups
-                  )
-                ) : (
-                  "Not Set"
-                )}
-              </div>
-            )}
-          </div>
-        )}
-      </div>
-    </div>
-  );
-};
-
-export default EditAutoRouterTab; 
\ No newline at end of file