scriptoriumadmin/litellm
1
0
Fork 0
mirror of https://github.com/BerriAI/litellm.git synced 2026-08-28 05:25:59 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 8

[UI QA Fixes] Stable release (#13231)

Browse source 
* qa - user agent view

* fixes for usage time selector
This commit is contained in:
Ishaan Jaff 2025-08-02 12:22:23 -07:00 • committed by GitHub
parent cd9c388a3f
commit b297dffba5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 9 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
ui/litellm-dashboard/src/components/shared/advanced_date_picker.tsx
View file

@ -198,19 +198,7 @@ const AdvancedDatePicker: React.FC<AdvancedDatePickerProps> = ({
const { from, to } = option.getValue()
const newValue = { from, to }
// Immediately apply the selected option
onValueChange(newValue)
// Apply the same background adjustment logic as the original component
requestIdleCallback(
() => {
const adjustedValue = adjustDateRange(newValue)
onValueChange(adjustedValue)
},
{ timeout: 100 },
)
// Update local state to reflect the selection
// Update local state to reflect the selection (don't apply immediately)
setTempValue(newValue)
setSelectedOption(option.shortLabel)
@ -218,8 +206,7 @@ const AdvancedDatePicker: React.FC<AdvancedDatePickerProps> = ({
setStartDate(moment(from).format("YYYY-MM-DD"))
setEndDate(moment(to).format("YYYY-MM-DD"))
// Close the dropdown
setIsOpen(false)
// Don't close the dropdown - let user click Apply to confirm
}
const updateTempValueFromInputs = useCallback(() => {

12
ui/litellm-dashboard/src/components/user_agent_activity.tsx
View file

@ -22,7 +22,7 @@ import {
TabPanel,
TabPanels,
} from "@tremor/react";
import { Select } from "antd";
import { Select, Tooltip } from "antd";
import { formatNumberWithCommas } from "@/utils/dataUtils";
import { userAgentSummaryCall, tagDauCall, tagWauCall, tagMauCall, tagDistinctCall } from "./networking";
import AdvancedDatePicker from "./shared/advanced_date_picker";
@ -241,7 +241,7 @@ const UserAgentActivity: React.FC<UserAgentActivityProps> = ({
return tag;
};
// Helper function to truncate user agent name with tooltip
// Helper function to truncate user agent name (used with Ant Design Tooltip)
const truncateUserAgent = (userAgent: string): string => {
if (userAgent.length > 15) {
return userAgent.substring(0, 15) + "...";
@ -450,9 +450,11 @@ const UserAgentActivity: React.FC<UserAgentActivityProps> = ({
const displayName = truncateUserAgent(userAgent);
return (
<Card key={index}>
<Title className="truncate" title={userAgent}>
{displayName}
</Title>
<Tooltip title={userAgent} placement="top">
<Title className="truncate">
{displayName}
</Title>
</Tooltip>
<div className="mt-4 space-y-3">
<div>
<Text className="text-sm text-gray-600">Success Requests</Text>