@acarmisc/backstage-plugin-litellm 0.16.0 → 0.17.0

package/dist/index.cjs.js

@@ -1942,7 +1942,7 @@ var init_GenerateKeyDialog = __esm({
 });
 
 // src/components/ManageTeamDialog.tsx
-var import_react5, import_Dialog3, import_DialogTitle3, import_DialogContent3, import_DialogActions3, import_TextField3, import_Button4, import_Alert2, import_Checkbox2, import_FormControlLabel2, import_Autocomplete3, import_Box5, import_Divider2, import_Typography5, import_IconButton3, import_List, import_ListItem, import_ListItemText, import_icons_material4, ManageTeamDialog;
+var import_react5, import_Dialog3, import_DialogTitle3, import_DialogContent3, import_DialogActions3, import_TextField3, import_Button4, import_Alert2, import_Checkbox2, import_FormControlLabel2, import_Autocomplete3, import_MenuItem2, import_Box5, import_Divider2, import_Typography5, import_IconButton3, import_List, import_ListItem, import_ListItemText, import_icons_material4, BUDGET_DURATION_OPTIONS, DEFAULT_BUDGET_DURATION, FALLBACK_BUDGET_CEILING, ManageTeamDialog;
 var init_ManageTeamDialog = __esm({
   "src/components/ManageTeamDialog.tsx"() {
     "use strict";
@@ -1957,6 +1957,7 @@ var init_ManageTeamDialog = __esm({
     import_Checkbox2 = __toESM(require("@mui/material/Checkbox"));
     import_FormControlLabel2 = __toESM(require("@mui/material/FormControlLabel"));
     import_Autocomplete3 = __toESM(require("@mui/material/Autocomplete"));
+    import_MenuItem2 = __toESM(require("@mui/material/MenuItem"));
     import_Box5 = __toESM(require("@mui/material/Box"));
     import_Divider2 = __toESM(require("@mui/material/Divider"));
     import_Typography5 = __toESM(require("@mui/material/Typography"));
@@ -1965,6 +1966,15 @@ var init_ManageTeamDialog = __esm({
     import_ListItem = __toESM(require("@mui/material/ListItem"));
     import_ListItemText = __toESM(require("@mui/material/ListItemText"));
     import_icons_material4 = require("@mui/icons-material");
+    BUDGET_DURATION_OPTIONS = [
+      { value: "1d", label: "Daily (1d)" },
+      { value: "7d", label: "Weekly (7d)" },
+      { value: "30d", label: "Monthly (30d)" },
+      { value: "90d", label: "Quarterly (90d)" },
+      { value: "365d", label: "Yearly (365d)" }
+    ];
+    DEFAULT_BUDGET_DURATION = "30d";
+    FALLBACK_BUDGET_CEILING = 1e3;
     ManageTeamDialog = ({
       open,
       onClose,
@@ -2001,21 +2011,23 @@ var init_ManageTeamDialog = __esm({
       const [mcpBusy, setMcpBusy] = (0, import_react5.useState)(false);
       const [mcpError, setMcpError] = (0, import_react5.useState)(null);
       const allowUnlimitedBudget = config?.teamManagement?.allowUnlimitedBudget ?? false;
-      const maxBudgetCeiling = config?.teamManagement?.maxBudgetCeiling;
+      const maxBudgetCeiling = config?.teamManagement?.maxBudgetCeiling ?? FALLBACK_BUDGET_CEILING;
       (0, import_react5.useEffect)(() => {
         if (open) {
           if (mode === "edit" && team) {
             setAlias(team.team_alias ?? "");
             setModels(team.models ?? []);
-            setMaxBudget(team.max_budget ? String(team.max_budget) : "");
+            setMaxBudget(
+              team.max_budget ? String(team.max_budget) : String(maxBudgetCeiling)
+            );
             setUnlimited(allowUnlimitedBudget && !team.max_budget);
-            setBudgetDuration("");
+            setBudgetDuration(team.budget_duration ?? DEFAULT_BUDGET_DURATION);
           } else {
             setAlias("");
             setModels([]);
-            setMaxBudget("");
+            setMaxBudget(String(maxBudgetCeiling));
             setUnlimited(allowUnlimitedBudget);
-            setBudgetDuration("");
+            setBudgetDuration(DEFAULT_BUDGET_DURATION);
           }
           setError(null);
           setMemberRef("");
@@ -2026,7 +2038,7 @@ var init_ManageTeamDialog = __esm({
           setMcpIds(team?.object_permission?.mcp_servers ?? []);
           setMcpError(null);
         }
-      }, [open, mode, team, allowUnlimitedBudget]);
+      }, [open, mode, team, allowUnlimitedBudget, maxBudgetCeiling]);
       const handleSubmit = async () => {
         setError(null);
         if (!alias.trim()) {
@@ -2047,7 +2059,7 @@ var init_ManageTeamDialog = __esm({
             setError("Budget must be a positive number");
             return;
           }
-          if (maxBudgetCeiling !== null && maxBudgetCeiling !== void 0 && budget > maxBudgetCeiling) {
+          if (budget > maxBudgetCeiling) {
             setError(`Budget cannot exceed $${maxBudgetCeiling}`);
             return;
           }
@@ -2134,6 +2146,7 @@ var init_ManageTeamDialog = __esm({
         }
       };
       const modelNames = allModels.map((m) => m.model_name);
+      const durationOptions = BUDGET_DURATION_OPTIONS.some((o) => o.value === budgetDuration) ? BUDGET_DURATION_OPTIONS : [...BUDGET_DURATION_OPTIONS, { value: budgetDuration, label: budgetDuration }];
       const members = team?.members_with_roles ?? [];
       const showMembers = mode === "edit" && !!canManageMembers;
       const showKnowledgeBases = mode === "edit" && !!canManageKnowledgeBases;
@@ -2169,7 +2182,8 @@ var init_ManageTeamDialog = __esm({
           value: maxBudget,
           onChange: (e) => setMaxBudget(e.target.value),
           disabled: submitting || unlimited,
-          helperText: maxBudgetCeiling !== null && maxBudgetCeiling !== void 0 ? `Maximum: $${maxBudgetCeiling}` : void 0,
+          inputProps: { min: 0, max: maxBudgetCeiling },
+          helperText: `Maximum: $${maxBudgetCeiling}`,
           fullWidth: true
         }
       ), allowUnlimitedBudget && /* @__PURE__ */ import_react5.default.createElement(
@@ -2181,13 +2195,15 @@ var init_ManageTeamDialog = __esm({
       ), /* @__PURE__ */ import_react5.default.createElement(
         import_TextField3.default,
         {
+          select: true,
           label: "Budget Duration",
           value: budgetDuration,
           onChange: (e) => setBudgetDuration(e.target.value),
-          placeholder: "30d",
-          disabled: submitting,
+          disabled: submitting || unlimited,
+          helperText: "Spend-reset period for the team budget",
           fullWidth: true
-        }
+        },
+        durationOptions.map((o) => /* @__PURE__ */ import_react5.default.createElement(import_MenuItem2.default, { key: o.value, value: o.value }, o.label))
       ), showMembers && /* @__PURE__ */ import_react5.default.createElement(import_Box5.default, null, /* @__PURE__ */ import_react5.default.createElement(import_Divider2.default, { sx: { my: 1 } }), /* @__PURE__ */ import_react5.default.createElement(import_Typography5.default, { variant: "subtitle2", sx: { mb: 1 } }, "Members"), memberError && /* @__PURE__ */ import_react5.default.createElement(import_Alert2.default, { severity: "error", sx: { mb: 1 }, onClose: () => setMemberError(null) }, memberError), members.length === 0 ? /* @__PURE__ */ import_react5.default.createElement(import_Typography5.default, { variant: "body2", color: "text.secondary" }, "No members yet.") : /* @__PURE__ */ import_react5.default.createElement(import_List.default, { dense: true, disablePadding: true }, members.map((m) => /* @__PURE__ */ import_react5.default.createElement(
         import_ListItem.default,
         {
@@ -2286,7 +2302,7 @@ function rateTone(rate) {
   if (rate >= 0.9) return "warning";
   return "danger";
 }
-var import_react6, import_Paper3, import_Box6, import_Typography6, import_TextField4, import_MenuItem2, import_Grid, import_Table2, import_TableBody2, import_TableCell2, import_TableContainer2, import_TableHead2, import_TableRow2, import_Skeleton3, import_recharts, TOP_N_MODELS, PERIOD_LS_KEY, PRESET_LABELS, fmtPct, ChartSkeleton, ChartOrFallback, SuccessRateCell, UsageStats;
+var import_react6, import_Paper3, import_Box6, import_Typography6, import_TextField4, import_MenuItem3, import_Grid, import_Table2, import_TableBody2, import_TableCell2, import_TableContainer2, import_TableHead2, import_TableRow2, import_Skeleton3, import_recharts, TOP_N_MODELS, PERIOD_LS_KEY, PRESET_LABELS, fmtPct, ChartSkeleton, ChartOrFallback, SuccessRateCell, UsageStats;
 var init_UsageStats = __esm({
   "src/components/UsageStats.tsx"() {
     "use strict";
@@ -2295,7 +2311,7 @@ var init_UsageStats = __esm({
     import_Box6 = __toESM(require("@mui/material/Box"));
     import_Typography6 = __toESM(require("@mui/material/Typography"));
     import_TextField4 = __toESM(require("@mui/material/TextField"));
-    import_MenuItem2 = __toESM(require("@mui/material/MenuItem"));
+    import_MenuItem3 = __toESM(require("@mui/material/MenuItem"));
     import_Grid = __toESM(require("@mui/material/Grid"));
     import_Table2 = __toESM(require("@mui/material/Table"));
     import_TableBody2 = __toESM(require("@mui/material/TableBody"));
@@ -2500,7 +2516,7 @@ var init_UsageStats = __esm({
           onChange: (e) => handlePresetChange(e.target.value),
           sx: { minWidth: 160 }
         },
-        Object.keys(PRESET_LABELS).map((p) => /* @__PURE__ */ import_react6.default.createElement(import_MenuItem2.default, { key: p, value: p }, PRESET_LABELS[p]))
+        Object.keys(PRESET_LABELS).map((p) => /* @__PURE__ */ import_react6.default.createElement(import_MenuItem3.default, { key: p, value: p }, PRESET_LABELS[p]))
       );
       return /* @__PURE__ */ import_react6.default.createElement(
         SectionCard,
@@ -2545,8 +2561,8 @@ var init_UsageStats = __esm({
               onChange: (e) => setSelectedModel(e.target.value),
               sx: { minWidth: 220 }
             },
-            /* @__PURE__ */ import_react6.default.createElement(import_MenuItem2.default, { value: "all" }, "All models"),
-            models.map((m) => /* @__PURE__ */ import_react6.default.createElement(import_MenuItem2.default, { key: m.model_name, value: m.model_name }, m.model_name))
+            /* @__PURE__ */ import_react6.default.createElement(import_MenuItem3.default, { value: "all" }, "All models"),
+            models.map((m) => /* @__PURE__ */ import_react6.default.createElement(import_MenuItem3.default, { key: m.model_name, value: m.model_name }, m.model_name))
           )
         ),
         tab === "costs" && /* @__PURE__ */ import_react6.default.createElement(import_Grid.default, { container: true, spacing: 2 }, /* @__PURE__ */ import_react6.default.createElement(import_Grid.default, { item: true, xs: 12 }, /* @__PURE__ */ import_react6.default.createElement(ChartCard, { title: "Daily spend by model", height: 260 }, /* @__PURE__ */ import_react6.default.createElement(ChartOrFallback, { loading, empty: modelSpendByDate.length === 0, height: 260 }, /* @__PURE__ */ import_react6.default.createElement(import_recharts.ResponsiveContainer, { width: "100%", height: "100%" }, /* @__PURE__ */ import_react6.default.createElement(import_recharts.AreaChart, { data: modelSpendByDate, margin: { top: 4, right: 8, left: 0, bottom: 0 } }, /* @__PURE__ */ import_react6.default.createElement(import_recharts.CartesianGrid, { ...chart.grid }), /* @__PURE__ */ import_react6.default.createElement(import_recharts.XAxis, { dataKey: "date", tickFormatter: fmtDateShort, ...chart.axis }), /* @__PURE__ */ import_react6.default.createElement(import_recharts.YAxis, { tickFormatter: fmtUsdCompact, width: 56, ...chart.axis }), /* @__PURE__ */ import_react6.default.createElement(
@@ -2886,7 +2902,7 @@ function fmtTokens(n) {
   if (n >= 1e3) return `${(n / 1e3).toFixed(0)}K`;
   return String(n);
 }
-var import_react8, import_Box8, import_Table4, import_TableBody4, import_TableCell4, import_TableContainer4, import_TableHead4, import_TableRow4, import_Typography8, import_MenuItem3, import_Select, import_FormControl, import_InputLabel, import_ContentCopy, import_Tooltip, import_Snackbar, import_Alert3, import_styles5, ALL_PROXY_MODELS2, ModelsTable;
+var import_react8, import_Box8, import_Table4, import_TableBody4, import_TableCell4, import_TableContainer4, import_TableHead4, import_TableRow4, import_Typography8, import_MenuItem4, import_Select, import_FormControl, import_InputLabel, import_ContentCopy, import_Tooltip, import_Snackbar, import_Alert3, import_styles5, ALL_PROXY_MODELS2, ModelsTable;
 var init_ModelsTable = __esm({
   "src/components/ModelsTable.tsx"() {
     "use strict";
@@ -2899,7 +2915,7 @@ var init_ModelsTable = __esm({
     import_TableHead4 = __toESM(require("@mui/material/TableHead"));
     import_TableRow4 = __toESM(require("@mui/material/TableRow"));
     import_Typography8 = __toESM(require("@mui/material/Typography"));
-    import_MenuItem3 = __toESM(require("@mui/material/MenuItem"));
+    import_MenuItem4 = __toESM(require("@mui/material/MenuItem"));
     import_Select = __toESM(require("@mui/material/Select"));
     import_FormControl = __toESM(require("@mui/material/FormControl"));
     import_InputLabel = __toESM(require("@mui/material/InputLabel"));
@@ -2953,7 +2969,7 @@ var init_ModelsTable = __esm({
             label: "Team",
             onChange: (e) => setSelectedTeamId(e.target.value)
           },
-          teams.map((t) => /* @__PURE__ */ import_react8.default.createElement(import_MenuItem3.default, { key: t.team_id, value: t.team_id }, t.team_alias ?? t.team_id))
+          teams.map((t) => /* @__PURE__ */ import_react8.default.createElement(import_MenuItem4.default, { key: t.team_id, value: t.team_id }, t.team_alias ?? t.team_id))
         ))),
         loading && /* @__PURE__ */ import_react8.default.createElement(EmptyState, { message: "Loading models\u2026" }),
         !loading && !selectedTeamId && /* @__PURE__ */ import_react8.default.createElement(
@@ -3049,7 +3065,7 @@ function renderAuditLogBody(loading, entries) {
   }
   return entries.map((entry) => /* @__PURE__ */ import_react9.default.createElement(DetailRow, { key: entry.id, entry }));
 }
-var import_react9, import_Box9, import_Typography9, import_Table5, import_TableBody5, import_TableCell5, import_TableContainer5, import_TableHead5, import_TableRow5, import_TablePagination, import_TextField5, import_MenuItem4, import_Skeleton5, import_Collapse2, import_IconButton5, import_Alert4, import_styles6, import_icons_material6, import_react_use, ACTION_TONES, TABLE_LABELS, DetailRow, AuditLog;
+var import_react9, import_Box9, import_Typography9, import_Table5, import_TableBody5, import_TableCell5, import_TableContainer5, import_TableHead5, import_TableRow5, import_TablePagination, import_TextField5, import_MenuItem5, import_Skeleton5, import_Collapse2, import_IconButton5, import_Alert4, import_styles6, import_icons_material6, import_react_use, ACTION_TONES, TABLE_LABELS, DetailRow, AuditLog;
 var init_AuditLog = __esm({
   "src/components/AuditLog.tsx"() {
     "use strict";
@@ -3064,7 +3080,7 @@ var init_AuditLog = __esm({
     import_TableRow5 = __toESM(require("@mui/material/TableRow"));
     import_TablePagination = __toESM(require("@mui/material/TablePagination"));
     import_TextField5 = __toESM(require("@mui/material/TextField"));
-    import_MenuItem4 = __toESM(require("@mui/material/MenuItem"));
+    import_MenuItem5 = __toESM(require("@mui/material/MenuItem"));
     import_Skeleton5 = __toESM(require("@mui/material/Skeleton"));
     import_Collapse2 = __toESM(require("@mui/material/Collapse"));
     import_IconButton5 = __toESM(require("@mui/material/IconButton"));
@@ -3184,11 +3200,11 @@ var init_AuditLog = __esm({
               },
               sx: { minWidth: 150 }
             },
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "" }, "All actions"),
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "created" }, "Created"),
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "updated" }, "Updated"),
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "deleted" }, "Deleted"),
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "blocked" }, "Blocked")
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "" }, "All actions"),
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "created" }, "Created"),
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "updated" }, "Updated"),
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "deleted" }, "Deleted"),
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "blocked" }, "Blocked")
           ), /* @__PURE__ */ import_react9.default.createElement(
             import_TextField5.default,
             {
@@ -3202,12 +3218,12 @@ var init_AuditLog = __esm({
               },
               sx: { minWidth: 150 }
             },
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "" }, "All tables"),
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "LiteLLM_VerificationToken" }, "Key"),
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "LiteLLM_TeamTable" }, "Team"),
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "LiteLLM_TeamMembership" }, "Team member"),
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "LiteLLM_ObjectPermissionTable" }, "Team access (KB / MCP)"),
-            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem4.default, { value: "LiteLLM_UserTable" }, "User")
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "" }, "All tables"),
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "LiteLLM_VerificationToken" }, "Key"),
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "LiteLLM_TeamTable" }, "Team"),
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "LiteLLM_TeamMembership" }, "Team member"),
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "LiteLLM_ObjectPermissionTable" }, "Team access (KB / MCP)"),
+            /* @__PURE__ */ import_react9.default.createElement(import_MenuItem5.default, { value: "LiteLLM_UserTable" }, "User")
           ), /* @__PURE__ */ import_react9.default.createElement(
             import_TextField5.default,
             {
@@ -3774,7 +3790,7 @@ var import_Box11 = __toESM(require("@mui/material/Box"));
 var import_Typography11 = __toESM(require("@mui/material/Typography"));
 var import_FormControl2 = __toESM(require("@mui/material/FormControl"));
 var import_Select2 = __toESM(require("@mui/material/Select"));
-var import_MenuItem5 = __toESM(require("@mui/material/MenuItem"));
+var import_MenuItem6 = __toESM(require("@mui/material/MenuItem"));
 var import_Grid2 = __toESM(require("@mui/material/Grid"));
 var import_CircularProgress5 = __toESM(require("@mui/material/CircularProgress"));
 var import_Alert6 = __toESM(require("@mui/material/Alert"));
@@ -3850,9 +3866,9 @@ var LiteLLMHomeWidget = ({
       onChange: (e) => setPeriod(e.target.value),
       displayEmpty: true
     },
-    /* @__PURE__ */ import_react12.default.createElement(import_MenuItem5.default, { value: "today" }, "Today"),
-    /* @__PURE__ */ import_react12.default.createElement(import_MenuItem5.default, { value: "7d" }, "7d"),
-    /* @__PURE__ */ import_react12.default.createElement(import_MenuItem5.default, { value: "30d" }, "30d")
+    /* @__PURE__ */ import_react12.default.createElement(import_MenuItem6.default, { value: "today" }, "Today"),
+    /* @__PURE__ */ import_react12.default.createElement(import_MenuItem6.default, { value: "7d" }, "7d"),
+    /* @__PURE__ */ import_react12.default.createElement(import_MenuItem6.default, { value: "30d" }, "30d")
   ))), loading && /* @__PURE__ */ import_react12.default.createElement(import_Box11.default, { display: "flex", justifyContent: "center", alignItems: "center", minHeight: 120 }, /* @__PURE__ */ import_react12.default.createElement(import_CircularProgress5.default, { size: 32 })), !loading && totalFailure && /* @__PURE__ */ import_react12.default.createElement(import_Alert6.default, { severity: "error", sx: { mt: 1 } }, usageError ?? "Failed to load usage data"), !loading && !totalFailure && /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, partialFailure && /* @__PURE__ */ import_react12.default.createElement(import_Alert6.default, { severity: "warning", sx: { mt: 1, mb: 1 } }, usageError ? `Usage data unavailable (${usageError}).` : "", keysError ? ` Key list unavailable (${keysError}).` : "", " Showing what loaded."), /* @__PURE__ */ import_react12.default.createElement(import_Grid2.default, { container: true, spacing: 2, sx: { mb: hasSparkline ? 1.5 : 0 } }, /* @__PURE__ */ import_react12.default.createElement(import_Grid2.default, { item: true, xs: 6 }, /* @__PURE__ */ import_react12.default.createElement(Kpi, { label: "USD Spent", value: fmtUsd(usage?.total_spend ?? 0) })), /* @__PURE__ */ import_react12.default.createElement(import_Grid2.default, { item: true, xs: 6 }, /* @__PURE__ */ import_react12.default.createElement(Kpi, { label: "Tokens In", value: fmtInt(usage?.prompt_tokens ?? 0) })), /* @__PURE__ */ import_react12.default.createElement(import_Grid2.default, { item: true, xs: 6 }, /* @__PURE__ */ import_react12.default.createElement(Kpi, { label: "Tokens Out", value: fmtInt(usage?.completion_tokens ?? 0) })), /* @__PURE__ */ import_react12.default.createElement(import_Grid2.default, { item: true, xs: 6 }, /* @__PURE__ */ import_react12.default.createElement(Kpi, { label: "Keys", value: fmtInt(keys.length) }))), hasSparkline && /* @__PURE__ */ import_react12.default.createElement(import_Box11.default, { height: 120 }, /* @__PURE__ */ import_react12.default.createElement(import_recharts3.ResponsiveContainer, { width: "100%", height: "100%" }, /* @__PURE__ */ import_react12.default.createElement(import_recharts3.AreaChart, { data: dailyData, margin: { top: 4, right: 0, bottom: 0, left: 0 } }, /* @__PURE__ */ import_react12.default.createElement(
     import_recharts3.Area,
     {