@acarmisc/backstage-plugin-litellm 0.21.2 → 0.21.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +58 -7
- package/dist/index.cjs.js.map +3 -3
- package/dist/index.esm.js +57 -6
- package/dist/index.esm.js.map +3 -3
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -3401,7 +3401,7 @@ function fmtTokens(n) {
|
|
|
3401
3401
|
if (n >= 1e3) return `${(n / 1e3).toFixed(0)}K`;
|
|
3402
3402
|
return String(n);
|
|
3403
3403
|
}
|
|
3404
|
-
var import_react9, import_Box9, import_Table5, import_TableBody5, import_TableCell5, import_TableContainer5, import_TableHead5, import_TableRow5, import_Typography9, import_MenuItem4, import_Select, import_FormControl, import_InputLabel, import_TextField5, import_InputAdornment2, import_icons_material7, import_ContentCopy, import_Tooltip, import_Snackbar, import_Alert4, import_styles6, ALL_PROXY_MODELS2, ModelsTable;
|
|
3404
|
+
var import_react9, import_Box9, import_Table5, import_TableBody5, import_TableCell5, import_TableContainer5, import_TableHead5, import_TableRow5, import_TableSortLabel2, import_Typography9, import_MenuItem4, import_Select, import_FormControl, import_InputLabel, import_TextField5, import_InputAdornment2, import_icons_material7, import_ContentCopy, import_Tooltip, import_Snackbar, import_Alert4, import_styles6, ALL_PROXY_MODELS2, ModelsTable;
|
|
3405
3405
|
var init_ModelsTable = __esm({
|
|
3406
3406
|
"src/components/ModelsTable.tsx"() {
|
|
3407
3407
|
"use strict";
|
|
@@ -3413,6 +3413,7 @@ var init_ModelsTable = __esm({
|
|
|
3413
3413
|
import_TableContainer5 = __toESM(require("@mui/material/TableContainer"));
|
|
3414
3414
|
import_TableHead5 = __toESM(require("@mui/material/TableHead"));
|
|
3415
3415
|
import_TableRow5 = __toESM(require("@mui/material/TableRow"));
|
|
3416
|
+
import_TableSortLabel2 = __toESM(require("@mui/material/TableSortLabel"));
|
|
3416
3417
|
import_Typography9 = __toESM(require("@mui/material/Typography"));
|
|
3417
3418
|
import_MenuItem4 = __toESM(require("@mui/material/MenuItem"));
|
|
3418
3419
|
import_Select = __toESM(require("@mui/material/Select"));
|
|
@@ -3433,6 +3434,8 @@ var init_ModelsTable = __esm({
|
|
|
3433
3434
|
const [selectedTeamId, setSelectedTeamId] = (0, import_react9.useState)("");
|
|
3434
3435
|
const [filterText, setFilterText] = (0, import_react9.useState)("");
|
|
3435
3436
|
const [copiedSnackbar, setCopiedSnackbar] = (0, import_react9.useState)(false);
|
|
3437
|
+
const [sortKey, setSortKey] = (0, import_react9.useState)("model_name");
|
|
3438
|
+
const [sortDirection, setSortDirection] = (0, import_react9.useState)("asc");
|
|
3436
3439
|
const selectedTeam = (0, import_react9.useMemo)(
|
|
3437
3440
|
() => teams.find((t) => t.team_id === selectedTeamId) ?? null,
|
|
3438
3441
|
[teams, selectedTeamId]
|
|
@@ -3443,14 +3446,62 @@ var init_ModelsTable = __esm({
|
|
|
3443
3446
|
}, [allModels, selectedTeam]);
|
|
3444
3447
|
const filteredModels = (0, import_react9.useMemo)(() => {
|
|
3445
3448
|
const q = filterText.trim().toLowerCase();
|
|
3446
|
-
|
|
3447
|
-
|
|
3448
|
-
|
|
3449
|
-
|
|
3450
|
-
|
|
3449
|
+
let models = teamModels;
|
|
3450
|
+
if (q) {
|
|
3451
|
+
models = teamModels.filter(
|
|
3452
|
+
(model) => model.model_name.toLowerCase().includes(q) || (model.access_groups || []).some((group) => group.toLowerCase().includes(q))
|
|
3453
|
+
);
|
|
3454
|
+
}
|
|
3455
|
+
return [...models].sort((a, b) => {
|
|
3456
|
+
let aVal;
|
|
3457
|
+
let bVal;
|
|
3458
|
+
switch (sortKey) {
|
|
3459
|
+
case "model_name":
|
|
3460
|
+
aVal = a.model_name;
|
|
3461
|
+
bVal = b.model_name;
|
|
3462
|
+
break;
|
|
3463
|
+
case "mode":
|
|
3464
|
+
aVal = a.mode;
|
|
3465
|
+
bVal = b.mode;
|
|
3466
|
+
break;
|
|
3467
|
+
case "input_cost_per_token":
|
|
3468
|
+
aVal = a.input_cost_per_token ?? 0;
|
|
3469
|
+
bVal = b.input_cost_per_token ?? 0;
|
|
3470
|
+
break;
|
|
3471
|
+
case "output_cost_per_token":
|
|
3472
|
+
aVal = a.output_cost_per_token ?? 0;
|
|
3473
|
+
bVal = b.output_cost_per_token ?? 0;
|
|
3474
|
+
break;
|
|
3475
|
+
case "max_input_tokens":
|
|
3476
|
+
aVal = a.max_input_tokens ?? 0;
|
|
3477
|
+
bVal = b.max_input_tokens ?? 0;
|
|
3478
|
+
break;
|
|
3479
|
+
case "max_output_tokens":
|
|
3480
|
+
aVal = a.max_output_tokens ?? 0;
|
|
3481
|
+
bVal = b.max_output_tokens ?? 0;
|
|
3482
|
+
break;
|
|
3483
|
+
default:
|
|
3484
|
+
return 0;
|
|
3485
|
+
}
|
|
3486
|
+
if (aVal === void 0 || aVal === null) aVal = "";
|
|
3487
|
+
if (bVal === void 0 || bVal === null) bVal = "";
|
|
3488
|
+
if (typeof aVal === "string" && typeof bVal === "string") {
|
|
3489
|
+
return sortDirection === "asc" ? aVal.localeCompare(bVal) : bVal.localeCompare(aVal);
|
|
3490
|
+
}
|
|
3491
|
+
return sortDirection === "asc" ? aVal - bVal : bVal - aVal;
|
|
3492
|
+
});
|
|
3493
|
+
}, [teamModels, filterText, sortKey, sortDirection]);
|
|
3451
3494
|
const handleCopyModelId = (0, import_react9.useCallback)((modelId) => {
|
|
3452
3495
|
navigator.clipboard.writeText(modelId).then(() => setCopiedSnackbar(true));
|
|
3453
3496
|
}, []);
|
|
3497
|
+
const handleSort = (0, import_react9.useCallback)((key) => {
|
|
3498
|
+
if (sortKey === key) {
|
|
3499
|
+
setSortDirection((prev) => prev === "asc" ? "desc" : "asc");
|
|
3500
|
+
} else {
|
|
3501
|
+
setSortKey(key);
|
|
3502
|
+
setSortDirection("asc");
|
|
3503
|
+
}
|
|
3504
|
+
}, [sortKey]);
|
|
3454
3505
|
const modeColor = (mode) => {
|
|
3455
3506
|
switch (mode) {
|
|
3456
3507
|
case "chat":
|
|
@@ -3516,7 +3567,7 @@ var init_ModelsTable = __esm({
|
|
|
3516
3567
|
hint: "Try a different search term"
|
|
3517
3568
|
}
|
|
3518
3569
|
),
|
|
3519
|
-
!loading && filteredModels.length > 0 && /* @__PURE__ */ import_react9.default.createElement(import_TableContainer5.default, null, /* @__PURE__ */ import_react9.default.createElement(import_Table5.default, { size: "small", sx: dataTableSx }, /* @__PURE__ */ import_react9.default.createElement(import_TableHead5.default, null, /* @__PURE__ */ import_react9.default.createElement(import_TableRow5.default, null, /* @__PURE__ */ import_react9.default.createElement(import_TableCell5.default,
|
|
3570
|
+
!loading && filteredModels.length > 0 && /* @__PURE__ */ import_react9.default.createElement(import_TableContainer5.default, null, /* @__PURE__ */ import_react9.default.createElement(import_Table5.default, { size: "small", sx: dataTableSx }, /* @__PURE__ */ import_react9.default.createElement(import_TableHead5.default, null, /* @__PURE__ */ import_react9.default.createElement(import_TableRow5.default, null, /* @__PURE__ */ import_react9.default.createElement(import_TableCell5.default, { sortDirection: sortKey === "model_name" ? sortDirection : false }, /* @__PURE__ */ import_react9.default.createElement(import_TableSortLabel2.default, { active: sortKey === "model_name", direction: sortKey === "model_name" ? sortDirection : "asc", onClick: () => handleSort("model_name") }, "Model ID")), /* @__PURE__ */ import_react9.default.createElement(import_TableCell5.default, { sortDirection: sortKey === "mode" ? sortDirection : false }, /* @__PURE__ */ import_react9.default.createElement(import_TableSortLabel2.default, { active: sortKey === "mode", direction: sortKey === "mode" ? sortDirection : "asc", onClick: () => handleSort("mode") }, "Mode")), /* @__PURE__ */ import_react9.default.createElement(import_TableCell5.default, { align: "right", sortDirection: sortKey === "input_cost_per_token" ? sortDirection : false }, /* @__PURE__ */ import_react9.default.createElement(import_TableSortLabel2.default, { active: sortKey === "input_cost_per_token", direction: sortKey === "input_cost_per_token" ? sortDirection : "asc", onClick: () => handleSort("input_cost_per_token") }, "Input Cost")), /* @__PURE__ */ import_react9.default.createElement(import_TableCell5.default, { align: "right", sortDirection: sortKey === "output_cost_per_token" ? sortDirection : false }, /* @__PURE__ */ import_react9.default.createElement(import_TableSortLabel2.default, { active: sortKey === "output_cost_per_token", direction: sortKey === "output_cost_per_token" ? sortDirection : "asc", onClick: () => handleSort("output_cost_per_token") }, "Output Cost")), /* @__PURE__ */ import_react9.default.createElement(import_TableCell5.default, { align: "right", sortDirection: sortKey === "max_input_tokens" ? sortDirection : false }, /* @__PURE__ */ import_react9.default.createElement(import_TableSortLabel2.default, { active: sortKey === "max_input_tokens", direction: sortKey === "max_input_tokens" ? sortDirection : "asc", onClick: () => handleSort("max_input_tokens") }, "Max Input")), /* @__PURE__ */ import_react9.default.createElement(import_TableCell5.default, { align: "right", sortDirection: sortKey === "max_output_tokens" ? sortDirection : false }, /* @__PURE__ */ import_react9.default.createElement(import_TableSortLabel2.default, { active: sortKey === "max_output_tokens", direction: sortKey === "max_output_tokens" ? sortDirection : "asc", onClick: () => handleSort("max_output_tokens") }, "Max Output")), /* @__PURE__ */ import_react9.default.createElement(import_TableCell5.default, null, "Capabilities"))), /* @__PURE__ */ import_react9.default.createElement(import_TableBody5.default, null, filteredModels.map((m) => /* @__PURE__ */ import_react9.default.createElement(import_TableRow5.default, { key: m.model_name, hover: true }, /* @__PURE__ */ import_react9.default.createElement(import_TableCell5.default, null, /* @__PURE__ */ import_react9.default.createElement(import_Box9.default, { sx: { display: "flex", alignItems: "center", gap: 0.5 } }, /* @__PURE__ */ import_react9.default.createElement(import_Tooltip.default, { title: m.model_name, placement: "top" }, /* @__PURE__ */ import_react9.default.createElement(
|
|
3520
3571
|
"span",
|
|
3521
3572
|
{
|
|
3522
3573
|
role: "button",
|