scriptoriumadmin/litellm
1
0
Fork 0
mirror of https://github.com/BerriAI/litellm.git synced 2026-09-06 08:16:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 78

fix(ui): name the tab Model Access Group Budgets and keep sub-cent budgets readable

Browse source 
Marks the tab New, and stops a budget under a cent rendering as "of $0.00"
next to an over-budget meter.
This commit is contained in:
ryan-crabbe-berri 2026-08-29 16:38:58 -07:00
parent 0777e37849
commit a5cd3fae81
3 changed files with 26 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
ui/litellm-dashboard/src/app/(dashboard)/models-and-endpoints/components/AccessGroupBudgetColumns.tsx
View file

@ -16,6 +16,9 @@ import {
import { cn } from "@/lib/cva.config";
import { ModelAccessGroup } from "@/app/(dashboard)/hooks/modelAccessGroups/useModelAccessGroups";
const budgetDecimals = (maxBudget: number | null | undefined): number =>
maxBudget != null && maxBudget > 0 && maxBudget < 0.01 ? 5 : 2;
interface AccessGroupRowActionsProps {
accessGroup: ModelAccessGroup;
onSetBudget: (accessGroup: ModelAccessGroup) => void;
@ -101,7 +104,11 @@ export const getAccessGroupBudgetColumns = ({
size: 180,
enableSorting: true,
cell: ({ row }) => (
<SpendBudgetCell spend={row.original.spend} maxBudget={row.original.budget?.max_budget} budgetDecimals={2} />
<SpendBudgetCell
spend={row.original.spend}
maxBudget={row.original.budget?.max_budget}
budgetDecimals={budgetDecimals(row.original.budget?.max_budget)}
/>
),
},
{

10
ui/litellm-dashboard/src/app/(dashboard)/models-and-endpoints/page.tsx
View file

@ -9,6 +9,7 @@ import { useUISettings } from "@/app/(dashboard)/hooks/uiSettings/useUISettings"
import { all_admin_roles, internalUserRoles } from "@/utils/roles";
import { canCreateModels } from "@/utils/modelPermissions";
import BetaBadge from "@/components/BetaBadge";
import NewBadge from "@/components/common_components/NewBadge";
import CostOptimizationFeedbackBanner from "@/components/molecules/cost_optimization_feedback_banner";
import ModelInfoView from "@/components/model_info_view";
import TeamInfoView from "@/components/team/TeamInfo";
@ -48,7 +49,7 @@ const TAB_LABELS: Record<ModelTabSlug, string> = {
health: "Health Status",
"retry-settings": "Model Retry Settings",
"model-group-alias": "Model Group Alias",
"access-group-budgets": "Access Group Budgets",
"access-group-budgets": "Model Access Group Budgets",
"price-data": "Price Data Reload",
};
@ -131,6 +132,13 @@ export default function ModelsAndEndpointsPage() {
</span>
);
}
if (slug === "access-group-budgets") {
return (
<span className="flex items-center gap-2">
{TAB_LABELS[slug]} <NewBadge />
</span>
);
}
return TAB_LABELS[slug];
};

9
ui/litellm-dashboard/src/app/(dashboard)/models-and-endpoints/panels/AccessGroupBudgetsPanel.integration.test.tsx
View file

@ -66,6 +66,15 @@ describe("AccessGroupBudgetsPanel", () => {
expect(GET).toHaveBeenCalledWith("/access_group/list");
});
it("keeps a sub-cent budget readable instead of rounding it away to $0.00", async () => {
GET.mockResolvedValue({
data: { access_groups: [{ ...BUDGETED_GROUP, budget: { ...BUDGETED_GROUP.budget, max_budget: 0.00002 } }] },
});
renderPanel();
expect(await screen.findByText("of $0.00002")).toBeInTheDocument();
});
it("shows a group with no budget as unlimited and offers nothing to clear", async () => {
renderPanel();