phoenix/litellm
1
0
Fork 0
forked from phoenix/litellm-mirror
Code Pull requests Activity

v0 -run /health check through admin ui

Browse source
This commit is contained in:
Ishaan Jaff 2024-04-13 18:05:26 -07:00
parent a6fa0e030e
commit db4faca3a3
2 changed files with 63 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

29
ui/litellm-dashboard/src/components/model_dashboard.tsx
View file

@ -15,7 +15,7 @@ import {
} from "@tremor/react";
import { TabPanel, TabPanels, TabGroup, TabList, Tab, TextInput, Icon } from "@tremor/react";
import { Select, SelectItem, MultiSelect, MultiSelectItem } from "@tremor/react";
import { modelInfoCall, userGetRequesedtModelsCall, modelMetricsCall, modelCreateCall, Model, modelCostMap, modelDeleteCall } from "./networking";
import { modelInfoCall, userGetRequesedtModelsCall, modelMetricsCall, modelCreateCall, Model, modelCostMap, modelDeleteCall, healthCheckCall } from "./networking";
import { BarChart } from "@tremor/react";
import {
Button as Button2,
@ -81,6 +81,9 @@ const ModelDashboard: React.FC<ModelDashboardProps> = ({
const providers: Providers[] = [Providers.OpenAI, Providers.Azure, Providers.Anthropic, Providers.Google_AI_Studio, Providers.Bedrock, Providers.OpenAI_Compatible]
const [selectedProvider, setSelectedProvider] = useState<String>("OpenAI");
const [healthCheckResponse, setHealthCheckResponse] = useState<string>('');
useEffect(() => {
if (!accessToken || !token || !userRole || !userID) {
@ -246,6 +249,18 @@ const ModelDashboard: React.FC<ModelDashboardProps> = ({
console.log(`providerModels: ${providerModels}`);
}
const runHealthCheck = async () => {
try {
message.info('Running health check...');
setHealthCheckResponse('');
const response = await healthCheckCall(accessToken);
setHealthCheckResponse(response);
} catch (error) {
console.error('Error running health check:', error);
setHealthCheckResponse('Error running health check');
}
};
const handleSubmit = async (formValues: Record<string, any>) => {
try {
/**
@ -354,6 +369,7 @@ const ModelDashboard: React.FC<ModelDashboardProps> = ({
<TabList className="mt-2">
<Tab>All Models</Tab>
<Tab>Add Model</Tab>
<Tab><pre>/health Models</pre></Tab>
</TabList>
<TabPanels>
@ -593,6 +609,17 @@ const ModelDashboard: React.FC<ModelDashboardProps> = ({
</Form>
</Card>
</TabPanel>
<TabPanel>
<Card>
<Text>`/health` will run a very small request through your models configured on litellm</Text>
<Button onClick={runHealthCheck}>Run `/health`</Button>
{healthCheckResponse && (
<pre>{JSON.stringify(healthCheckResponse, null, 2)}</pre>
)}
</Card>
</TabPanel>
</TabPanels>
</TabGroup>

35
ui/litellm-dashboard/src/components/networking.tsx
View file

@ -1287,4 +1287,39 @@ export const setCallbacksCall = async (
}
};
export const healthCheckCall = async (
accessToken: String,
) => {
/**
* Get all the models user has access to
*/
try {
let url = proxyBaseUrl ? `${proxyBaseUrl}/health` : `/health`;
//message.info("Requesting model data");
const response = await fetch(url, {
method: "GET",
headers: {
Authorization: `Bearer ${accessToken}`,
"Content-Type": "application/json",
},
});
if (!response.ok) {
const errorData = await response.text();
message.error(errorData);
throw new Error("Network response was not ok");
}
const data = await response.json();
//message.info("Received model data");
return data;
// Handle success - you might want to update some state or UI based on the created key
} catch (error) {
console.error("Failed to call /health:", error);
throw error;
}
};