phoenix/litellm-mirror
0
0
Fork 1
mirror of https://github.com/BerriAI/litellm.git synced 2025-04-27 19:54:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(ui/time_to_first_token.tsx): add time to first token card to model metrics

Browse source
This commit is contained in:
Krrish Dholakia 2024-05-22 18:09:53 -07:00
parent 2bdff9b19e
commit 06606dc01b
4 changed files with 194 additions and 75 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -43,6 +43,7 @@ import {
healthCheckCall,
modelUpdateCall,
modelMetricsCall,
streamingModelMetricsCall,
modelExceptionsCall,
modelMetricsSlowResponsesCall,
getCallbacksCall,
@ -259,6 +260,9 @@ const ModelDashboard: React.FC<ModelDashboardProps> = ({
const [modelMetricsCategories, setModelMetricsCategories] = useState<any[]>(
[]
);
const [streamingModelMetrics, setStreamingModelMetrics] = useState<any[]>([]);
const [streamingModelMetricsCategories, setStreamingModelMetricsCategories] =
useState<any[]>([]);
const [modelExceptions, setModelExceptions] = useState<any[]>([]);
const [allExceptions, setAllExceptions] = useState<any[]>([]);
const [failureTableData, setFailureTableData] = useState<any[]>([]);
@ -558,6 +562,19 @@ const ModelDashboard: React.FC<ModelDashboardProps> = ({
setModelMetrics(modelMetricsResponse.data);
setModelMetricsCategories(modelMetricsResponse.all_api_bases);
const streamingModelMetricsResponse = await streamingModelMetricsCall(
accessToken,
_initial_model_group,
dateValue.from?.toISOString(),
dateValue.to?.toISOString()
);
// Assuming modelMetricsResponse now contains the metric data for the specified model group
setStreamingModelMetrics(streamingModelMetricsResponse.data);
setStreamingModelMetricsCategories(
streamingModelMetricsResponse.all_api_bases
);
const modelExceptionsResponse = await modelExceptionsCall(
accessToken,
userID,
@ -804,6 +821,19 @@ const ModelDashboard: React.FC<ModelDashboardProps> = ({
setModelMetrics(modelMetricsResponse.data);
setModelMetricsCategories(modelMetricsResponse.all_api_bases);
const streamingModelMetricsResponse = await streamingModelMetricsCall(
accessToken,
modelGroup,
startTime.toISOString(),
endTime.toISOString()
);
// Assuming modelMetricsResponse now contains the metric data for the specified model group
setStreamingModelMetrics(streamingModelMetricsResponse.data);
setStreamingModelMetricsCategories(
streamingModelMetricsResponse.all_api_bases
);
const modelExceptionsResponse = await modelExceptionsCall(
accessToken,
userID,
@ -1573,7 +1603,13 @@ const ModelDashboard: React.FC<ModelDashboardProps> = ({
)}
</TabPanel>
<TabPanel>
<TimeToFirstToken />
<TimeToFirstToken
modelMetrics={streamingModelMetrics}
modelMetricsCategories={
streamingModelMetricsCategories
}
customTooltip={customTooltip}
/>
</TabPanel>
</TabPanels>
</TabGroup>