@copilotz/admin 0.9.28 → 0.9.29
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 +120 -146
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +120 -147
- package/dist/index.js.map +1 -1
- package/dist/styles.css +2 -32
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -536,16 +536,6 @@ function CardHeader({ className, ...props }) {
|
|
|
536
536
|
}
|
|
537
537
|
);
|
|
538
538
|
}
|
|
539
|
-
function CardTitle({ className, ...props }) {
|
|
540
|
-
return /* @__PURE__ */ jsx(
|
|
541
|
-
"div",
|
|
542
|
-
{
|
|
543
|
-
"data-slot": "card-title",
|
|
544
|
-
className: cn("leading-none font-semibold", className),
|
|
545
|
-
...props
|
|
546
|
-
}
|
|
547
|
-
);
|
|
548
|
-
}
|
|
549
539
|
function CardContent({ className, ...props }) {
|
|
550
540
|
return /* @__PURE__ */ jsx(
|
|
551
541
|
"div",
|
|
@@ -1496,7 +1486,6 @@ import {
|
|
|
1496
1486
|
BarChart,
|
|
1497
1487
|
CartesianGrid,
|
|
1498
1488
|
Legend,
|
|
1499
|
-
Tooltip as Tooltip2,
|
|
1500
1489
|
XAxis,
|
|
1501
1490
|
YAxis
|
|
1502
1491
|
} from "recharts";
|
|
@@ -1865,7 +1854,7 @@ function UsageDashboard({
|
|
|
1865
1854
|
}, [loadUsage, setHeaderRefresh]);
|
|
1866
1855
|
return /* @__PURE__ */ jsxs8("div", { className: "grid h-full min-h-0 grid-rows-[auto_minmax(0,4fr)_minmax(0,5fr)] gap-3", children: [
|
|
1867
1856
|
/* @__PURE__ */ jsxs8("div", { className: "space-y-3", children: [
|
|
1868
|
-
/* @__PURE__ */ jsxs8("div", { className: "flex flex-col gap-3 xl:flex-row xl:items-
|
|
1857
|
+
/* @__PURE__ */ jsxs8("div", { className: "flex flex-col gap-3 xl:flex-row xl:items-start xl:justify-between", children: [
|
|
1869
1858
|
/* @__PURE__ */ jsxs8("div", { className: "min-w-0", children: [
|
|
1870
1859
|
/* @__PURE__ */ jsx13("h2", { className: "text-xl font-semibold tracking-tight", children: config.labels.llmUsageTitle }),
|
|
1871
1860
|
/* @__PURE__ */ jsxs8("div", { className: "mt-1 flex flex-wrap items-center gap-2", children: [
|
|
@@ -1906,34 +1895,19 @@ function UsageDashboard({
|
|
|
1906
1895
|
}
|
|
1907
1896
|
)
|
|
1908
1897
|
] }),
|
|
1909
|
-
/* @__PURE__ */
|
|
1910
|
-
|
|
1911
|
-
|
|
1912
|
-
|
|
1913
|
-
|
|
1914
|
-
|
|
1915
|
-
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1919
|
-
|
|
1920
|
-
|
|
1921
|
-
|
|
1922
|
-
] }) }) }),
|
|
1923
|
-
/* @__PURE__ */ jsx13(CardContent, { className: "min-h-0 flex-1 px-2 lg:px-4", children: error ? /* @__PURE__ */ jsx13("div", { className: "rounded-lg border border-destructive/30 bg-destructive/10 p-4 text-sm text-destructive", children: error }) : chartState.data.length === 0 ? /* @__PURE__ */ jsx13(
|
|
1924
|
-
EmptyDashboard,
|
|
1925
|
-
{
|
|
1926
|
-
description: config.labels.noResults,
|
|
1927
|
-
title: "No usage"
|
|
1928
|
-
}
|
|
1929
|
-
) : /* @__PURE__ */ jsx13(
|
|
1930
|
-
UsageChart,
|
|
1931
|
-
{
|
|
1932
|
-
chartState,
|
|
1933
|
-
metricKind
|
|
1934
|
-
}
|
|
1935
|
-
) })
|
|
1936
|
-
] }),
|
|
1898
|
+
/* @__PURE__ */ jsx13(Card, { className: "min-h-0 gap-0 overflow-hidden py-2", children: /* @__PURE__ */ jsx13(CardContent, { className: "min-h-0 flex-1 px-2 lg:px-4", children: error ? /* @__PURE__ */ jsx13("div", { className: "rounded-lg border border-destructive/30 bg-destructive/10 p-4 text-sm text-destructive", children: error }) : chartState.data.length === 0 ? /* @__PURE__ */ jsx13(
|
|
1899
|
+
EmptyDashboard,
|
|
1900
|
+
{
|
|
1901
|
+
description: config.labels.noResults,
|
|
1902
|
+
title: "No usage"
|
|
1903
|
+
}
|
|
1904
|
+
) : /* @__PURE__ */ jsx13(
|
|
1905
|
+
UsageChart,
|
|
1906
|
+
{
|
|
1907
|
+
chartState,
|
|
1908
|
+
metricKind
|
|
1909
|
+
}
|
|
1910
|
+
) }) }),
|
|
1937
1911
|
/* @__PURE__ */ jsx13(
|
|
1938
1912
|
UsageTable,
|
|
1939
1913
|
{
|
|
@@ -2022,7 +1996,7 @@ function UsageChart({
|
|
|
2022
1996
|
}
|
|
2023
1997
|
),
|
|
2024
1998
|
/* @__PURE__ */ jsx13(
|
|
2025
|
-
|
|
1999
|
+
Tooltip,
|
|
2026
2000
|
{
|
|
2027
2001
|
content: /* @__PURE__ */ jsx13(
|
|
2028
2002
|
ChartTooltipContent,
|
|
@@ -2067,72 +2041,62 @@ function UsageTable({
|
|
|
2067
2041
|
}) {
|
|
2068
2042
|
const totalValue = getUsageTotalValue(totals, metricKind, dimension);
|
|
2069
2043
|
const filterable = groupBy !== "namespace";
|
|
2070
|
-
return /* @__PURE__ */
|
|
2071
|
-
/* @__PURE__ */ jsx13(
|
|
2072
|
-
/* @__PURE__ */ jsx13(
|
|
2073
|
-
/* @__PURE__ */
|
|
2074
|
-
|
|
2075
|
-
|
|
2076
|
-
|
|
2077
|
-
|
|
2044
|
+
return /* @__PURE__ */ jsx13(Card, { className: "min-h-0 gap-0 overflow-hidden py-0", children: /* @__PURE__ */ jsx13(CardContent, { className: "min-h-0 flex-1 overflow-hidden px-0", children: rows.length === 0 ? /* @__PURE__ */ jsx13("p", { className: "px-5 py-4 text-sm text-muted-foreground", children: labels.noResults }) : /* @__PURE__ */ jsx13("div", { className: "h-full overflow-auto", children: /* @__PURE__ */ jsxs8("table", { className: "w-full min-w-[940px] text-sm", children: [
|
|
2045
|
+
/* @__PURE__ */ jsx13("thead", { className: "sticky top-0 z-10 bg-card", children: /* @__PURE__ */ jsxs8("tr", { className: "border-b text-left text-xs uppercase tracking-[0.12em] text-muted-foreground", children: [
|
|
2046
|
+
/* @__PURE__ */ jsx13("th", { className: "px-5 py-2.5 font-medium", children: getGroupByLabel(groupBy) }),
|
|
2047
|
+
/* @__PURE__ */ jsx13("th", { className: "px-3 py-2.5 text-right font-medium", children: getUsageSummaryLabel(labels, metricKind, dimension) }),
|
|
2048
|
+
/* @__PURE__ */ jsx13("th", { className: "px-3 py-2.5 text-right font-medium", children: "Share" }),
|
|
2049
|
+
/* @__PURE__ */ jsx13("th", { className: "px-3 py-2.5 text-right font-medium", children: "Calls" }),
|
|
2050
|
+
/* @__PURE__ */ jsx13("th", { className: "px-3 py-2.5 text-right font-medium", children: "Input" }),
|
|
2051
|
+
/* @__PURE__ */ jsx13("th", { className: "px-3 py-2.5 text-right font-medium", children: "Output" }),
|
|
2052
|
+
/* @__PURE__ */ jsx13("th", { className: "px-3 py-2.5 text-right font-medium", children: "Reasoning" }),
|
|
2053
|
+
/* @__PURE__ */ jsx13("th", { className: "px-3 py-2.5 text-right font-medium", children: "Cache read" }),
|
|
2054
|
+
/* @__PURE__ */ jsx13("th", { className: "px-5 py-2.5 text-right font-medium", children: "Avg/call" })
|
|
2078
2055
|
] }) }),
|
|
2079
|
-
/* @__PURE__ */ jsx13(
|
|
2080
|
-
|
|
2081
|
-
|
|
2082
|
-
|
|
2083
|
-
|
|
2084
|
-
|
|
2085
|
-
|
|
2086
|
-
|
|
2087
|
-
|
|
2088
|
-
|
|
2089
|
-
|
|
2090
|
-
|
|
2091
|
-
|
|
2092
|
-
|
|
2093
|
-
|
|
2094
|
-
|
|
2095
|
-
|
|
2096
|
-
className:
|
|
2097
|
-
|
|
2098
|
-
|
|
2099
|
-
|
|
2100
|
-
|
|
2101
|
-
children:
|
|
2102
|
-
|
|
2103
|
-
|
|
2104
|
-
|
|
2105
|
-
|
|
2106
|
-
|
|
2107
|
-
|
|
2108
|
-
|
|
2109
|
-
|
|
2110
|
-
|
|
2111
|
-
|
|
2112
|
-
|
|
2113
|
-
|
|
2114
|
-
|
|
2115
|
-
|
|
2116
|
-
|
|
2117
|
-
|
|
2118
|
-
|
|
2119
|
-
|
|
2120
|
-
|
|
2121
|
-
|
|
2122
|
-
|
|
2123
|
-
metricKind
|
|
2124
|
-
) }),
|
|
2125
|
-
/* @__PURE__ */ jsx13("td", { className: "px-5 py-3 text-right", children: formatMetricValue(
|
|
2126
|
-
row.totalCalls > 0 ? row.value / row.totalCalls : 0,
|
|
2127
|
-
metricKind
|
|
2128
|
-
) })
|
|
2129
|
-
]
|
|
2130
|
-
},
|
|
2131
|
-
row.groupKey
|
|
2132
|
-
);
|
|
2133
|
-
}) })
|
|
2134
|
-
] }) }) })
|
|
2135
|
-
] });
|
|
2056
|
+
/* @__PURE__ */ jsx13("tbody", { children: rows.slice(0, 60).map((row) => {
|
|
2057
|
+
const share = totalValue > 0 ? row.value / totalValue : 0;
|
|
2058
|
+
return /* @__PURE__ */ jsxs8(
|
|
2059
|
+
"tr",
|
|
2060
|
+
{
|
|
2061
|
+
className: cn(
|
|
2062
|
+
"border-b last:border-0",
|
|
2063
|
+
filterable && "cursor-pointer transition-colors hover:bg-muted/50"
|
|
2064
|
+
),
|
|
2065
|
+
onClick: () => filterable && onRowFilter(row),
|
|
2066
|
+
children: [
|
|
2067
|
+
/* @__PURE__ */ jsxs8("td", { className: "px-5 py-3", children: [
|
|
2068
|
+
/* @__PURE__ */ jsx13("div", { className: "max-w-80 truncate font-medium", children: row.groupLabel }),
|
|
2069
|
+
row.groupKey !== row.groupLabel && /* @__PURE__ */ jsx13("div", { className: "mt-0.5 max-w-80 truncate text-xs text-muted-foreground", children: row.groupKey })
|
|
2070
|
+
] }),
|
|
2071
|
+
/* @__PURE__ */ jsx13("td", { className: "px-3 py-3 text-right font-medium", children: formatMetricValue(row.value, metricKind) }),
|
|
2072
|
+
/* @__PURE__ */ jsx13("td", { className: "px-3 py-3 text-right", children: formatPercent(share) }),
|
|
2073
|
+
/* @__PURE__ */ jsx13("td", { className: "px-3 py-3 text-right", children: formatNumber(row.totalCalls) }),
|
|
2074
|
+
/* @__PURE__ */ jsx13("td", { className: "px-3 py-3 text-right", children: formatMetricValue(
|
|
2075
|
+
getUsageTotalValue(row, metricKind, "input"),
|
|
2076
|
+
metricKind
|
|
2077
|
+
) }),
|
|
2078
|
+
/* @__PURE__ */ jsx13("td", { className: "px-3 py-3 text-right", children: formatMetricValue(
|
|
2079
|
+
getUsageTotalValue(row, metricKind, "output"),
|
|
2080
|
+
metricKind
|
|
2081
|
+
) }),
|
|
2082
|
+
/* @__PURE__ */ jsx13("td", { className: "px-3 py-3 text-right", children: formatMetricValue(
|
|
2083
|
+
getUsageTotalValue(row, metricKind, "reasoning"),
|
|
2084
|
+
metricKind
|
|
2085
|
+
) }),
|
|
2086
|
+
/* @__PURE__ */ jsx13("td", { className: "px-3 py-3 text-right", children: formatMetricValue(
|
|
2087
|
+
getUsageTotalValue(row, metricKind, "cacheRead"),
|
|
2088
|
+
metricKind
|
|
2089
|
+
) }),
|
|
2090
|
+
/* @__PURE__ */ jsx13("td", { className: "px-5 py-3 text-right", children: formatMetricValue(
|
|
2091
|
+
row.totalCalls > 0 ? row.value / row.totalCalls : 0,
|
|
2092
|
+
metricKind
|
|
2093
|
+
) })
|
|
2094
|
+
]
|
|
2095
|
+
},
|
|
2096
|
+
row.groupKey
|
|
2097
|
+
);
|
|
2098
|
+
}) })
|
|
2099
|
+
] }) }) }) });
|
|
2136
2100
|
}
|
|
2137
2101
|
function DashboardHeaderControls({
|
|
2138
2102
|
attribution,
|
|
@@ -2354,57 +2318,66 @@ function InlineFilters({
|
|
|
2354
2318
|
] });
|
|
2355
2319
|
}
|
|
2356
2320
|
function HeaderSelect(props) {
|
|
2357
|
-
return /* @__PURE__ */ jsxs8(
|
|
2358
|
-
/* @__PURE__ */ jsx13(
|
|
2359
|
-
SelectTrigger,
|
|
2360
|
-
{
|
|
2361
|
-
"aria-label": props.label,
|
|
2362
|
-
className: cn("h-8 bg-background text-xs", props.width),
|
|
2363
|
-
children: /* @__PURE__ */ jsx13(SelectValue, {})
|
|
2364
|
-
}
|
|
2365
|
-
),
|
|
2366
|
-
/* @__PURE__ */ jsx13(SelectContent, { children: props.options.map(([value, label]) => /* @__PURE__ */ jsx13(SelectItem, { value, children: label }, value)) })
|
|
2367
|
-
] });
|
|
2368
|
-
}
|
|
2369
|
-
function UsageSelect(props) {
|
|
2370
|
-
return /* @__PURE__ */ jsxs8("label", { className: cn("space-y-1", props.compact && "w-[116px]"), children: [
|
|
2371
|
-
/* @__PURE__ */ jsx13("span", { className: "sr-only", children: props.label }),
|
|
2321
|
+
return /* @__PURE__ */ jsxs8(Tooltip, { children: [
|
|
2372
2322
|
/* @__PURE__ */ jsxs8(Select, { value: props.value, onValueChange: props.onValueChange, children: [
|
|
2373
|
-
/* @__PURE__ */ jsx13(
|
|
2323
|
+
/* @__PURE__ */ jsx13(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx13(
|
|
2374
2324
|
SelectTrigger,
|
|
2375
2325
|
{
|
|
2376
2326
|
"aria-label": props.label,
|
|
2377
|
-
className: cn(
|
|
2378
|
-
"w-full min-w-0 bg-background",
|
|
2379
|
-
props.compact ? "h-8 text-xs" : "h-9"
|
|
2380
|
-
),
|
|
2327
|
+
className: cn("h-8 bg-background text-xs", props.width),
|
|
2381
2328
|
children: /* @__PURE__ */ jsx13(SelectValue, {})
|
|
2382
2329
|
}
|
|
2383
|
-
),
|
|
2330
|
+
) }),
|
|
2384
2331
|
/* @__PURE__ */ jsx13(SelectContent, { children: props.options.map(([value, label]) => /* @__PURE__ */ jsx13(SelectItem, { value, children: label }, value)) })
|
|
2385
|
-
] })
|
|
2332
|
+
] }),
|
|
2333
|
+
/* @__PURE__ */ jsx13(TooltipContent, { children: props.label })
|
|
2334
|
+
] });
|
|
2335
|
+
}
|
|
2336
|
+
function UsageSelect(props) {
|
|
2337
|
+
return /* @__PURE__ */ jsxs8(Tooltip, { children: [
|
|
2338
|
+
/* @__PURE__ */ jsxs8("label", { className: cn("space-y-1", props.compact && "w-[116px]"), children: [
|
|
2339
|
+
/* @__PURE__ */ jsx13("span", { className: "sr-only", children: props.label }),
|
|
2340
|
+
/* @__PURE__ */ jsxs8(Select, { value: props.value, onValueChange: props.onValueChange, children: [
|
|
2341
|
+
/* @__PURE__ */ jsx13(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx13(
|
|
2342
|
+
SelectTrigger,
|
|
2343
|
+
{
|
|
2344
|
+
"aria-label": props.label,
|
|
2345
|
+
className: cn(
|
|
2346
|
+
"w-full min-w-0 bg-background",
|
|
2347
|
+
props.compact ? "h-8 text-xs" : "h-9"
|
|
2348
|
+
),
|
|
2349
|
+
children: /* @__PURE__ */ jsx13(SelectValue, {})
|
|
2350
|
+
}
|
|
2351
|
+
) }),
|
|
2352
|
+
/* @__PURE__ */ jsx13(SelectContent, { children: props.options.map(([value, label]) => /* @__PURE__ */ jsx13(SelectItem, { value, children: label }, value)) })
|
|
2353
|
+
] })
|
|
2354
|
+
] }),
|
|
2355
|
+
/* @__PURE__ */ jsx13(TooltipContent, { children: props.label })
|
|
2386
2356
|
] });
|
|
2387
2357
|
}
|
|
2388
2358
|
function FilterInput(props) {
|
|
2389
|
-
return /* @__PURE__ */ jsxs8(
|
|
2390
|
-
/* @__PURE__ */
|
|
2391
|
-
|
|
2392
|
-
|
|
2393
|
-
|
|
2394
|
-
|
|
2395
|
-
|
|
2396
|
-
|
|
2397
|
-
|
|
2398
|
-
|
|
2399
|
-
|
|
2400
|
-
|
|
2401
|
-
|
|
2402
|
-
|
|
2403
|
-
|
|
2404
|
-
|
|
2405
|
-
|
|
2406
|
-
|
|
2407
|
-
|
|
2359
|
+
return /* @__PURE__ */ jsxs8(Tooltip, { children: [
|
|
2360
|
+
/* @__PURE__ */ jsxs8("label", { className: cn("space-y-1", props.compact && "w-[150px]"), children: [
|
|
2361
|
+
/* @__PURE__ */ jsx13("span", { className: "sr-only", children: props.label }),
|
|
2362
|
+
/* @__PURE__ */ jsx13(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxs8("div", { className: "relative", children: [
|
|
2363
|
+
props.icon && /* @__PURE__ */ jsx13("span", { className: "pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground", children: props.icon }),
|
|
2364
|
+
/* @__PURE__ */ jsx13(
|
|
2365
|
+
Input,
|
|
2366
|
+
{
|
|
2367
|
+
"aria-label": props.label,
|
|
2368
|
+
className: cn(
|
|
2369
|
+
"bg-background",
|
|
2370
|
+
props.compact ? "h-8 text-xs" : "h-9",
|
|
2371
|
+
props.icon && "pl-8"
|
|
2372
|
+
),
|
|
2373
|
+
onChange: (event) => props.onChange(event.target.value),
|
|
2374
|
+
type: props.type ?? "text",
|
|
2375
|
+
value: props.value
|
|
2376
|
+
}
|
|
2377
|
+
)
|
|
2378
|
+
] }) })
|
|
2379
|
+
] }),
|
|
2380
|
+
/* @__PURE__ */ jsx13(TooltipContent, { children: props.label })
|
|
2408
2381
|
] });
|
|
2409
2382
|
}
|
|
2410
2383
|
function EmptyDashboard({
|