diff --git a/ui/litellm-dashboard/src/app/page.tsx b/ui/litellm-dashboard/src/app/page.tsx index 26bdb7af24..9b7a09cbfd 100644 --- a/ui/litellm-dashboard/src/app/page.tsx +++ b/ui/litellm-dashboard/src/app/page.tsx @@ -18,6 +18,7 @@ import Usage from "../components/usage"; import CacheDashboard from "@/components/cache_dashboard"; import { jwtDecode } from "jwt-decode"; import { Typography } from "antd"; +import { setGlobalLitellmHeaderName } from "../components/networking" function getCookie(name: string) { console.log("COOKIES", document.cookie) @@ -123,6 +124,11 @@ const CreateKeyPage = () => { if (decoded.premium_user) { setPremiumUser(decoded.premium_user); } + + if (decoded.auth_header_name) { + setGlobalLitellmHeaderName(decoded.auth_header_name); + } + } } }, [token]); diff --git a/ui/litellm-dashboard/src/components/networking.tsx b/ui/litellm-dashboard/src/components/networking.tsx index 8527b39a29..b196d3c2e3 100644 --- a/ui/litellm-dashboard/src/components/networking.tsx +++ b/ui/litellm-dashboard/src/components/networking.tsx @@ -37,30 +37,15 @@ const handleError = async (errorData: string) => { }; -export const getLiteLLMHeaderName = async () => { - try { - const url = proxyBaseUrl ? `${proxyBaseUrl}/litellm_header_name` : '/litellm_header_name'; - const response = await fetch(url, { - method: 'GET', - headers: { - 'Content-Type': 'application/json', - }, - }); +// Global variable for the header name +let globalLitellmHeaderName: string | null = null; - if (!response.ok) { - throw new Error(`HTTP error! status: ${response.status}`); - } +// Function to set the global header name +export function setGlobalLitellmHeaderName(headerName: string | null) { + console.log(`setGlobalLitellmHeaderName: ${headerName}`); + globalLitellmHeaderName = headerName; +} - const data = await response.json(); - console.log('Received LiteLLM header name:', data); - return data.litellm_key_header_name; - } catch (error) { - console.error('Failed to get LiteLLM header name:', error); - throw error; - } -}; - -const litellm_key_header_name = getLiteLLMHeaderName(); export const modelCostMap = async ( accessToken: string, @@ -71,7 +56,7 @@ export const modelCostMap = async ( url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, } @@ -94,7 +79,7 @@ export const modelCreateCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -133,7 +118,7 @@ export const modelSettingsCall = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -164,7 +149,7 @@ export const modelDeleteCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -206,7 +191,7 @@ export const budgetDeleteCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -241,7 +226,7 @@ export const budgetCreateCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -277,7 +262,7 @@ export const invitationCreateCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -316,7 +301,7 @@ export const invitationClaimCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -354,7 +339,7 @@ export const alertingSettingsCall = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -411,7 +396,7 @@ export const keyCreateCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -473,7 +458,7 @@ export const userCreateCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -507,7 +492,7 @@ export const keyDeleteCall = async (accessToken: String, user_key: String) => { const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -539,7 +524,7 @@ export const teamDeleteCall = async (accessToken: String, teamID: String) => { const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -592,7 +577,7 @@ export const userInfoCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -627,7 +612,7 @@ export const teamInfoCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -659,7 +644,7 @@ export const getTotalSpendCall = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -724,7 +709,7 @@ export const claimOnboardingToken = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -766,7 +751,7 @@ export const modelInfoCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -814,7 +799,7 @@ export const modelHubCall = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -845,7 +830,7 @@ export const getAllowedIPs = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -874,7 +859,7 @@ export const addAllowedIP = async (accessToken: String, ip: String) => { const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ ip: ip }), @@ -904,7 +889,7 @@ export const deleteAllowedIP = async (accessToken: String, ip: String) => { const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ ip: ip }), @@ -946,7 +931,7 @@ export const modelMetricsCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -985,7 +970,7 @@ export const streamingModelMetricsCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1030,7 +1015,7 @@ export const modelMetricsSlowResponsesCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1074,7 +1059,7 @@ export const modelExceptionsCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1102,6 +1087,7 @@ export const modelAvailableCall = async ( /** * Get all the models user has access to */ + console.log("in /models calls, globalLitellmHeaderName", globalLitellmHeaderName) try { let url = proxyBaseUrl ? `${proxyBaseUrl}/models` : `/models`; @@ -1109,7 +1095,7 @@ export const modelAvailableCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1139,7 +1125,7 @@ export const keySpendLogsCall = async (accessToken: String, token: String) => { const response = await fetch(`${url}?api_key=${token}`, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1167,7 +1153,7 @@ export const teamSpendLogsCall = async (accessToken: String) => { const response = await fetch(`${url}`, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1210,7 +1196,7 @@ export const tagsSpendLogsCall = async ( const response = await fetch(`${url}`, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1238,7 +1224,7 @@ export const allTagNamesCall = async (accessToken: String) => { const response = await fetch(`${url}`, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1266,7 +1252,7 @@ export const allEndUsersCall = async (accessToken: String) => { const response = await fetch(`${url}`, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1304,7 +1290,7 @@ export const userSpendLogsCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1334,7 +1320,7 @@ export const adminSpendLogsCall = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1364,7 +1350,7 @@ export const adminTopKeysCall = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1412,14 +1398,14 @@ export const adminTopEndUsersCall = async ( const requestOptions: { method: string; headers: { - litellm_key_header_name: string; + [globalLitellmHeaderName]: string; "Content-Type": string; }; body?: string; // The body is optional and might not be present } = { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }; @@ -1465,12 +1451,12 @@ export const adminspendByProvider = async ( const requestOptions: { method: string; headers: { - litellm_key_header_name: string; + [globalLitellmHeaderName]: string; }; } = { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, }, }; @@ -1508,12 +1494,12 @@ export const adminGlobalActivity = async ( const requestOptions: { method: string; headers: { - litellm_key_header_name: string; + [globalLitellmHeaderName]: string; }; } = { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, }, }; @@ -1549,12 +1535,12 @@ export const adminGlobalCacheActivity = async ( const requestOptions: { method: string; headers: { - litellm_key_header_name: string; + [globalLitellmHeaderName]: string; }; } = { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, }, }; @@ -1590,12 +1576,12 @@ export const adminGlobalActivityPerModel = async ( const requestOptions: { method: string; headers: { - litellm_key_header_name: string; + [globalLitellmHeaderName]: string; }; } = { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, }, }; @@ -1636,12 +1622,12 @@ export const adminGlobalActivityExceptions = async ( const requestOptions: { method: string; headers: { - litellm_key_header_name: string; + [globalLitellmHeaderName]: string; }; } = { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, }, }; @@ -1682,12 +1668,12 @@ export const adminGlobalActivityExceptionsPerDeployment = async ( const requestOptions: { method: string; headers: { - litellm_key_header_name: string; + [globalLitellmHeaderName]: string; }; } = { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, }, }; @@ -1716,7 +1702,7 @@ export const adminTopModelsCall = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1743,7 +1729,7 @@ export const keyInfoCall = async (accessToken: String, keys: String[]) => { const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -1773,7 +1759,7 @@ export const spendUsersCall = async (accessToken: String, userID: String) => { const response = await fetch(`${url}?user_id=${userID}`, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1805,7 +1791,7 @@ export const userRequestModelCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -1840,7 +1826,7 @@ export const userGetRequesedtModelsCall = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1880,7 +1866,7 @@ export const userGetAllUsersCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1909,7 +1895,7 @@ export const getPossibleUserRoles = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -1938,7 +1924,7 @@ export const teamCreateCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -1974,7 +1960,7 @@ export const keyUpdateCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -2009,7 +1995,7 @@ export const teamUpdateCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -2044,7 +2030,7 @@ export const modelUpdateCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -2088,7 +2074,7 @@ export const teamMemberAddCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -2131,7 +2117,7 @@ export const userUpdateUserCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: response_body, @@ -2169,7 +2155,7 @@ export const PredictedSpendLogsCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -2205,7 +2191,7 @@ export const slackBudgetAlertsHealthCheck = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -2244,7 +2230,7 @@ export const serviceHealthCheck = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -2279,7 +2265,7 @@ export const getBudgetList = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -2312,7 +2298,7 @@ export const getBudgetSettings = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -2350,7 +2336,7 @@ export const getCallbacksCall = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -2381,7 +2367,7 @@ export const getGeneralSettingsCall = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -2415,7 +2401,7 @@ export const getConfigFieldSetting = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -2453,7 +2439,7 @@ export const updateConfigFieldSetting = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify(formData), @@ -2493,7 +2479,7 @@ export const deleteConfigFieldSetting = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify(formData), @@ -2528,7 +2514,7 @@ export const setCallbacksCall = async ( const response = await fetch(url, { method: "POST", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, body: JSON.stringify({ @@ -2563,7 +2549,7 @@ export const healthCheckCall = async (accessToken: String) => { const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, }); @@ -2599,7 +2585,7 @@ export const getProxyBaseUrlAndLogoutUrl = async ( const response = await fetch(url, { method: "GET", headers: { - litellm_key_header_name: `Bearer ${accessToken}`, + [globalLitellmHeaderName]: `Bearer ${accessToken}`, "Content-Type": "application/json", }, });