diff --git a/ui/litellm-dashboard/src/app/page.tsx b/ui/litellm-dashboard/src/app/page.tsx index 49a795528f2..9d1d49545f2 100644 --- a/ui/litellm-dashboard/src/app/page.tsx +++ b/ui/litellm-dashboard/src/app/page.tsx @@ -4,8 +4,7 @@ import React, { Suspense, useEffect, useState } from "react"; import { useSearchParams } from "next/navigation"; import { jwtDecode } from "jwt-decode"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; -import { defaultOrg } from "@/components/common_components/default_org"; -import { KeyResponse, Team } from "@/components/key_team_helpers/key_list"; +import { Team } from "@/components/key_team_helpers/key_list"; import Navbar from "@/components/navbar"; import UserDashboard from "@/components/user_dashboard"; import ModelDashboard from "@/components/model_dashboard"; @@ -26,17 +25,21 @@ import ChatUI from "@/components/chat_ui"; import Sidebar from "@/components/leftnav"; import Usage from "@/components/usage"; import CacheDashboard from "@/components/cache_dashboard"; -import { getUiConfig, proxyBaseUrl, setGlobalLitellmHeaderName } from "@/components/networking"; +import { + getUiConfig, + proxyBaseUrl, + setGlobalLitellmHeaderName, +} from "@/components/networking"; import { Organization } from "@/components/networking"; import GuardrailsPanel from "@/components/guardrails"; import TransformRequestPanel from "@/components/transform_request"; import { fetchUserModels } from "@/components/create_key_button"; import { fetchTeams } from "@/components/common_components/fetch_teams"; -import { MCPToolsViewer, MCPServers } from "@/components/mcp_tools"; +import { MCPServers } from "@/components/mcp_tools"; import TagManagement from "@/components/tag_management"; import VectorStoreManagement from "@/components/vector_store_management"; import { UiLoadingSpinner } from "@/components/ui/ui-loading-spinner"; -import { cx } from '@/lib/cva.config'; +import { cx } from "@/lib/cva.config"; function getCookie(name: string) { const cookieValue = document.cookie @@ -49,8 +52,6 @@ function formatUserRole(userRole: string) { if (!userRole) { return "Undefined Role"; } - console.log(`Received user role: ${userRole.toLowerCase()}`); - console.log(`Received user role length: ${userRole.toLowerCase().length}`); switch (userRole.toLowerCase()) { case "app_owner": return "App Owner"; @@ -66,7 +67,8 @@ function formatUserRole(userRole: string) { return "Org Admin"; case "internal_user": return "Internal User"; - case "internal_viewer": + case "internal_user_viewer": + case "internal_viewer": // TODO:remove if deprecated return "Internal Viewer"; case "app_user": return "App User"; @@ -88,7 +90,7 @@ function LoadingScreen() {
🚅 LiteLLM
- +
Loading... @@ -142,15 +144,16 @@ export default function CreateKeyPage() { const [accessToken, setAccessToken] = useState(null); const addKey = (data: any) => { - setKeys((prevData) => (prevData ? [...prevData, data] : [data])) + setKeys((prevData) => (prevData ? [...prevData, data] : [data])); setCreateClicked(() => !createClicked); - } - const redirectToLogin = authLoading === false && token === null && invitation_id === null; + }; + const redirectToLogin = + authLoading === false && token === null && invitation_id === null; useEffect(() => { const token = getCookie("token"); - getUiConfig().then((data) => { // get the information for constructing the proxy base url, and then set the token and auth loading - console.log("ui config in page.tsx:", data); + getUiConfig().then((data) => { + // get the information for constructing the proxy base url, and then set the token and auth loading setToken(token); setAuthLoading(false); }); @@ -158,53 +161,41 @@ export default function CreateKeyPage() { useEffect(() => { if (redirectToLogin) { - window.location.href = (proxyBaseUrl || "") + "/sso/key/generate" + window.location.href = (proxyBaseUrl || "") + "/sso/key/generate"; } - }, [redirectToLogin]) + }, [redirectToLogin]); useEffect(() => { if (!token) { return; } - const decoded = jwtDecode(token) as { [key: string]: any }; if (decoded) { - // cast decoded to dictionary - console.log("Decoded token:", decoded); - - console.log("Decoded key:", decoded.key); // set accessToken setAccessToken(decoded.key); setDisabledPersonalKeyCreation( - decoded.disabled_non_admin_personal_key_creation, + decoded.disabled_non_admin_personal_key_creation ); // check if userRole is defined if (decoded.user_role) { const formattedUserRole = formatUserRole(decoded.user_role); - console.log("Decoded user_role:", formattedUserRole); setUserRole(formattedUserRole); if (formattedUserRole == "Admin Viewer") { setPage("usage"); } - } else { - console.log("User role not defined"); } if (decoded.user_email) { setUserEmail(decoded.user_email); - } else { - console.log(`User Email is not set ${decoded}`); } if (decoded.login_method) { setShowSSOBanner( - decoded.login_method == "username_password" ? true : false, + decoded.login_method == "username_password" ? true : false ); - } else { - console.log(`User Email is not set ${decoded}`); } if (decoded.premium_user) { @@ -218,13 +209,9 @@ export default function CreateKeyPage() { if (decoded.user_id) { setUserID(decoded.user_id); } - } - - }, [token]); - useEffect(() => { if (accessToken && userID && userRole) { fetchUserModels(userID, userRole, accessToken, setUserModels); @@ -238,7 +225,7 @@ export default function CreateKeyPage() { }, [accessToken, userID, userRole]); if (authLoading || redirectToLogin) { - return + return ; } return ( @@ -369,8 +356,11 @@ export default function CreateKeyPage() { ) : page == "budgets" ? ( ) : page == "guardrails" ? ( - - ): page == "transform-request" ? ( + + ) : page == "transform-request" ? ( ) : page == "general-settings" ? ( ) : page == "mcp-servers" ? (