@copilotz/admin 0.9.36 → 0.9.38

package/dist/index.cjs

@@ -63,6 +63,7 @@ __export(index_exports, {
   formatUsageBucket: () => formatUsageBucket,
   getUsageDimensionLabel: () => getUsageDimensionLabel,
   getUsageGroupLabel: () => getUsageGroupLabel,
+  getUsageMetricLabel: () => getUsageMetricLabel,
   getUsageRange: () => getUsageRange,
   getUsageTotalValue: () => getUsageTotalValue,
   mergeAdminConfig: () => mergeAdminConfig,
@@ -158,6 +159,21 @@ function normalizeMessagePage(payload) {
   const pageInfo = isRecord(candidate) ? normalizeMessagePageInfo(candidate.pageInfo, data) : normalizeMessagePageInfo(void 0, data);
   return { data, pageInfo };
 }
+function isQueueEvent(value) {
+  return isRecord(value) && typeof value.id === "string" && typeof value.threadId === "string" && typeof value.eventType === "string";
+}
+function normalizeQueueEvent(value) {
+  if (isQueueEvent(value)) return value;
+  if (isRecord(value) && isQueueEvent(value.data)) return value.data;
+  return void 0;
+}
+function normalizeQueueEvents(value) {
+  if (Array.isArray(value)) return value.filter(isQueueEvent);
+  if (isRecord(value) && Array.isArray(value.data)) {
+    return value.data.filter(isQueueEvent);
+  }
+  return [];
+}
 function createAdminClient(options = {}) {
   const baseUrl = resolveBaseUrl(options.baseUrl);
   const paths = { ...DEFAULT_PATHS, ...options.paths };
@@ -217,12 +233,16 @@ function createAdminClient(options = {}) {
       metric: filters.metric,
       groupBy: filters.groupBy,
       attribution: filters.attribution,
+      kind: filters.kind,
       threadId: filters.threadId,
       participantId: filters.participantId,
       participantType: filters.participantType,
       namespace: filters.namespace,
       provider: filters.provider,
-      model: filters.model
+      model: filters.model,
+      resource: filters.resource,
+      operation: filters.operation,
+      status: filters.status
     }),
     listThreads: async (listOptions = {}) => await requestJson(`${paths.adminBase}/threads`, {
       search: listOptions.search,
@@ -260,9 +280,25 @@ function createAdminClient(options = {}) {
       );
       return normalizeMessagePage(payload);
     },
-    getThreadEvent: async (threadId) => await requestJson(
-      `${paths.threadsBase}/${encodeURIComponent(threadId)}/events`
-    ),
+    listEvents: async (eventOptions = {}) => {
+      const payload = await requestJson(`${paths.adminBase}/events`, {
+        namespace: eventOptions.namespace,
+        threadId: eventOptions.threadId,
+        status: eventOptions.status,
+        eventType: eventOptions.eventType,
+        traceId: eventOptions.traceId,
+        search: eventOptions.search,
+        limit: String(eventOptions.limit ?? 50),
+        offset: eventOptions.offset ? String(eventOptions.offset) : void 0
+      });
+      return normalizeQueueEvents(payload);
+    },
+    getThreadEvent: async (threadId) => {
+      const payload = await requestJson(
+        `${paths.threadsBase}/${encodeURIComponent(threadId)}/events`
+      );
+      return normalizeQueueEvent(payload);
+    },
     listCollections: async () => await requestJson(paths.collectionsBase),
     listCollectionItems: async (collection, listOptions = {}) => await requestJson(
       `${paths.collectionsBase}/${encodeURIComponent(collection)}`,
@@ -1469,7 +1505,11 @@ var EMPTY_USAGE_TOTALS = {
   reasoningTokens: 0,
   totalCalls: 0,
   totalCostUsd: 0,
-  totalTokens: 0
+  failedCalls: 0,
+  totalCredits: 0,
+  totalDurationMs: 0,
+  totalTokens: 0,
+  unpricedCalls: 0
 };
 var USAGE_CHART_COLORS = [
   "hsl(var(--primary))",
@@ -1480,53 +1520,66 @@ var USAGE_CHART_COLORS = [
   "hsl(var(--muted-foreground))"
 ];
 function addUsageTotals(target, source) {
-  target.cacheCreationInputCostUsd += source.cacheCreationInputCostUsd;
-  target.cacheCreationInputTokens += source.cacheCreationInputTokens;
-  target.cacheReadInputCostUsd += source.cacheReadInputCostUsd;
-  target.cacheReadInputTokens += source.cacheReadInputTokens;
-  target.inputCostUsd += source.inputCostUsd;
-  target.inputTokens += source.inputTokens;
-  target.outputCostUsd += source.outputCostUsd;
-  target.outputTokens += source.outputTokens;
-  target.reasoningCostUsd += source.reasoningCostUsd;
-  target.reasoningTokens += source.reasoningTokens;
-  target.totalCalls += source.totalCalls;
-  target.totalCostUsd += source.totalCostUsd;
-  target.totalTokens += source.totalTokens;
+  target.cacheCreationInputCostUsd += safeUsageNumber(source.cacheCreationInputCostUsd);
+  target.cacheCreationInputTokens += safeUsageNumber(source.cacheCreationInputTokens);
+  target.cacheReadInputCostUsd += safeUsageNumber(source.cacheReadInputCostUsd);
+  target.cacheReadInputTokens += safeUsageNumber(source.cacheReadInputTokens);
+  target.inputCostUsd += safeUsageNumber(source.inputCostUsd);
+  target.inputTokens += safeUsageNumber(source.inputTokens);
+  target.outputCostUsd += safeUsageNumber(source.outputCostUsd);
+  target.outputTokens += safeUsageNumber(source.outputTokens);
+  target.reasoningCostUsd += safeUsageNumber(source.reasoningCostUsd);
+  target.reasoningTokens += safeUsageNumber(source.reasoningTokens);
+  target.totalCalls += safeUsageNumber(source.totalCalls);
+  target.totalCostUsd += safeUsageNumber(source.totalCostUsd);
+  target.failedCalls += safeUsageNumber(source.failedCalls);
+  target.totalCredits += safeUsageNumber(source.totalCredits);
+  target.totalDurationMs += safeUsageNumber(source.totalDurationMs);
+  target.totalTokens += safeUsageNumber(source.totalTokens);
+  target.unpricedCalls += safeUsageNumber(source.unpricedCalls);
+}
+function safeUsageNumber(value) {
+  return typeof value === "number" && Number.isFinite(value) ? value : 0;
 }
 function getUsageTotalValue(totals, metricKind, dimension) {
-  if (metricKind === "calls") return totals.totalCalls;
+  if (metricKind === "calls") return safeUsageNumber(totals.totalCalls);
+  if (metricKind === "duration") {
+    return safeUsageNumber(totals.totalDurationMs);
+  }
+  if (metricKind === "credits") return safeUsageNumber(totals.totalCredits);
+  if (metricKind === "failures") return safeUsageNumber(totals.failedCalls);
+  if (metricKind === "unpriced") return safeUsageNumber(totals.unpricedCalls);
   if (metricKind === "cost") {
     switch (dimension) {
       case "input":
-        return totals.inputCostUsd;
+        return safeUsageNumber(totals.inputCostUsd);
       case "output":
-        return totals.outputCostUsd;
+        return safeUsageNumber(totals.outputCostUsd);
       case "reasoning":
-        return totals.reasoningCostUsd;
+        return safeUsageNumber(totals.reasoningCostUsd);
       case "cacheRead":
-        return totals.cacheReadInputCostUsd;
+        return safeUsageNumber(totals.cacheReadInputCostUsd);
       case "cacheWrite":
-        return totals.cacheCreationInputCostUsd;
+        return safeUsageNumber(totals.cacheCreationInputCostUsd);
       case "total":
       default:
-        return totals.totalCostUsd;
+        return safeUsageNumber(totals.totalCostUsd);
     }
   }
   switch (dimension) {
     case "input":
-      return totals.inputTokens;
+      return safeUsageNumber(totals.inputTokens);
     case "output":
-      return totals.outputTokens;
+      return safeUsageNumber(totals.outputTokens);
     case "reasoning":
-      return totals.reasoningTokens;
+      return safeUsageNumber(totals.reasoningTokens);
     case "cacheRead":
-      return totals.cacheReadInputTokens;
+      return safeUsageNumber(totals.cacheReadInputTokens);
     case "cacheWrite":
-      return totals.cacheCreationInputTokens;
+      return safeUsageNumber(totals.cacheCreationInputTokens);
     case "total":
     default:
-      return totals.totalTokens;
+      return safeUsageNumber(totals.totalTokens);
   }
 }
 function aggregateUsageRows(points, metricKind, dimension) {
@@ -1638,6 +1691,14 @@ function getUsageDimensionLabel(dimension) {
 }
 function getUsageGroupLabel(groupBy) {
   switch (groupBy) {
+    case "kind":
+      return "Kind";
+    case "resource":
+      return "Resource";
+    case "operation":
+      return "Operation";
+    case "status":
+      return "Status";
     case "thread":
       return "Thread";
     case "namespace":
@@ -1651,6 +1712,25 @@ function getUsageGroupLabel(groupBy) {
       return "Participant";
   }
 }
+function getUsageMetricLabel(metricKind) {
+  switch (metricKind) {
+    case "cost":
+      return "Spend";
+    case "tokens":
+      return "Tokens";
+    case "duration":
+      return "Duration";
+    case "credits":
+      return "Credits";
+    case "failures":
+      return "Failures";
+    case "unpriced":
+      return "Unpriced";
+    case "calls":
+    default:
+      return "Calls";
+  }
+}
 function formatUsageBucket(bucket, interval) {
   const date = new Date(bucket);
   if (Number.isNaN(date.getTime())) return bucket;
@@ -1693,6 +1773,9 @@ function formatMetricValue(value, metricKind) {
       style: "currency"
     }).format(value);
   }
+  if (metricKind === "duration") {
+    return formatDuration(value);
+  }
   return formatNumber(value);
 }
 function formatCompactMetric(value, metricKind) {
@@ -1705,12 +1788,30 @@ function formatCompactMetric(value, metricKind) {
       style: "currency"
     }).format(value);
   }
+  if (metricKind === "duration") {
+    if (value >= 36e5) return `${(value / 36e5).toFixed(1)}h`;
+    if (value >= 6e4) return `${(value / 6e4).toFixed(1)}m`;
+    if (value >= 1e3) return `${(value / 1e3).toFixed(1)}s`;
+    return `${Math.round(value)}ms`;
+  }
   return new Intl.NumberFormat(void 0, {
     compactDisplay: "short",
     maximumFractionDigits: 1,
     notation: "compact"
   }).format(value);
 }
+function formatDuration(value) {
+  if (value >= 36e5) {
+    return `${new Intl.NumberFormat(void 0, { maximumFractionDigits: 1 }).format(value / 36e5)} h`;
+  }
+  if (value >= 6e4) {
+    return `${new Intl.NumberFormat(void 0, { maximumFractionDigits: 1 }).format(value / 6e4)} min`;
+  }
+  if (value >= 1e3) {
+    return `${new Intl.NumberFormat(void 0, { maximumFractionDigits: 1 }).format(value / 1e3)} sec`;
+  }
+  return `${formatNumber(Math.round(value))} ms`;
+}
 
 // src/modules/agents/index.tsx
 var import_jsx_runtime20 = require("react/jsx-runtime");
@@ -2188,33 +2289,61 @@ function eventsModule() {
     }]
   };
 }
+var EVENT_STATUSES = [
+  "all",
+  "pending",
+  "processing",
+  "completed",
+  "failed",
+  "expired",
+  "overwritten"
+];
 function EventsPage({ context }) {
   const [threadId, setThreadId] = import_react4.default.useState("");
-  const [status, setStatus] = import_react4.default.useState("");
-  const [type, setType] = import_react4.default.useState("");
+  const [status, setStatus] = import_react4.default.useState(
+    "all"
+  );
+  const [eventType, setEventType] = import_react4.default.useState("");
   const [traceId, setTraceId] = import_react4.default.useState("");
-  const [event, setEvent] = import_react4.default.useState(null);
+  const [events, setEvents] = import_react4.default.useState([]);
+  const [selectedEvent, setSelectedEvent] = import_react4.default.useState(null);
   const [error, setError] = import_react4.default.useState(null);
-  const [hasSearched, setHasSearched] = import_react4.default.useState(false);
+  const [loading, setLoading] = import_react4.default.useState(false);
+  const [hasLoaded, setHasLoaded] = import_react4.default.useState(false);
   const inspect = async () => {
-    if (!threadId.trim()) return;
-    setHasSearched(true);
+    setHasLoaded(true);
+    setLoading(true);
     setError(null);
     try {
-      const next = await context.client.getThreadEvent(threadId.trim());
-      setEvent(next ?? null);
+      const next = await context.client.listEvents({
+        namespace: context.scope.namespace || void 0,
+        threadId: threadId.trim() || void 0,
+        status: status === "all" ? void 0 : status,
+        eventType: eventType.trim() || void 0,
+        traceId: traceId.trim() || void 0,
+        limit: 50
+      });
+      setEvents(next);
+      setSelectedEvent(
+        (current) => current && next.some((event) => event.id === current.id) ? current : next[0] ?? null
+      );
     } catch (cause) {
       setError(cause instanceof Error ? cause.message : "Failed to load event");
-      setEvent(null);
+      setEvents([]);
+      setSelectedEvent(null);
+    } finally {
+      setLoading(false);
     }
   };
-  const rows = event && (!status || event.status.includes(status)) && (!type || event.eventType.includes(type)) && (!traceId || event.traceId?.includes(traceId)) ? [event] : [];
+  import_react4.default.useEffect(() => {
+    void inspect();
+  }, [context.client, context.refreshKey, context.scope.namespace]);
   return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "space-y-4", children: [
     /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
       PageHeader,
       {
         title: "Events",
-        description: "Queue and event inspection. Current backend support is thread-focused; filters are ready for broader event listing."
+        description: "Queue and event inspection across the active namespace."
       }
     ),
     /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
@@ -2223,13 +2352,13 @@ function EventsPage({ context }) {
         actions: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
           Button,
           {
-            disabled: !threadId.trim(),
+            disabled: loading,
             onClick: () => void inspect(),
             size: "sm",
             type: "button",
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react8.Search, { className: "size-3" }),
-              "Inspect"
+              loading ? "Loading" : "Inspect"
             ]
           }
         ),
@@ -2238,37 +2367,45 @@ function EventsPage({ context }) {
             Input,
             {
               className: "h-8 w-[220px]",
-              onChange: (event2) => setThreadId(event2.target.value),
-              onKeyDown: (event2) => {
-                if (event2.key === "Enter") void inspect();
+              onChange: (event) => setThreadId(event.target.value),
+              onKeyDown: (event) => {
+                if (event.key === "Enter") void inspect();
               },
               placeholder: "Thread ID",
               value: threadId
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-            Input,
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+            Select,
             {
-              className: "h-8 w-[150px]",
-              onChange: (event2) => setStatus(event2.target.value),
-              placeholder: "Status",
-              value: status
+              value: status,
+              onValueChange: (value) => setStatus(value),
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectTrigger, { className: "h-8 w-[150px] text-xs", "aria-label": "Status", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectValue, {}) }),
+                /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectContent, { children: EVENT_STATUSES.map((option) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SelectItem, { value: option, children: option === "all" ? "All statuses" : option }, option)) })
+              ]
             }
           ),
           /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             Input,
             {
               className: "h-8 w-[180px]",
-              onChange: (event2) => setType(event2.target.value),
+              onChange: (event) => setEventType(event.target.value),
+              onKeyDown: (event) => {
+                if (event.key === "Enter") void inspect();
+              },
               placeholder: "Event type",
-              value: type
+              value: eventType
             }
           ),
           /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             Input,
             {
               className: "h-8 w-[180px]",
-              onChange: (event2) => setTraceId(event2.target.value),
+              onChange: (event) => setTraceId(event.target.value),
+              onKeyDown: (event) => {
+                if (event.key === "Enter") void inspect();
+              },
               placeholder: "Trace ID",
               value: traceId
             }
@@ -2276,27 +2413,34 @@ function EventsPage({ context }) {
         ]
       }
     ),
-    error ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(EmptyState, { title: "Unable to inspect event", description: error }) : !hasSearched ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    error ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(EmptyState, { title: "Unable to inspect event", description: error }) : !hasLoaded && loading ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
       EmptyState,
       {
         icon: import_lucide_react8.Activity,
-        title: "Choose a thread",
-        description: "Enter a thread ID to inspect its next pending event."
+        title: "Loading events",
+        description: "Fetching recent queue events for the active namespace."
       }
     ) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "grid gap-4 xl:grid-cols-[1fr_420px]", children: [
       /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
         ResourceTable,
         {
-          rows,
+          rows: events,
           getRowKey: (row) => row.id,
+          onRowClick: setSelectedEvent,
           empty: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
             EmptyState,
             {
-              title: "No matching event",
-              description: "No pending event matched the current filters."
+              title: "No matching events",
+              description: "No event rows matched the current filters."
             }
           ),
           columns: [
+            {
+              id: "thread",
+              header: "Thread",
+              className: "max-w-[180px] truncate font-mono text-xs",
+              render: (row) => row.threadId
+            },
             {
               id: "type",
               header: "Type",
@@ -2320,7 +2464,20 @@ function EventsPage({ context }) {
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(JsonPanel, { title: "Event JSON", value: event, minHeight: 420 })
+      selectedEvent ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        JsonPanel,
+        {
+          title: "Event JSON",
+          value: selectedEvent,
+          minHeight: 420
+        }
+      ) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        EmptyState,
+        {
+          title: "No event selected",
+          description: "Select an event row to inspect its payload."
+        }
+      )
     ] })
   ] });
 }
@@ -3138,6 +3295,22 @@ var USAGE_DIMENSIONS = [
   "cacheRead",
   "cacheWrite"
 ];
+var USAGE_WORKLOADS = [
+  "all",
+  "llm",
+  "tool",
+  "asset",
+  "rag",
+  "embedding"
+];
+var STATUS_OPTIONS = [
+  "all",
+  "completed",
+  "failed",
+  "cancelled",
+  "aborted",
+  "error"
+];
 function usageModule() {
   return {
     group: "operate",
@@ -3164,11 +3337,12 @@ function UsagePage({ context }) {
     "7d"
   );
   const [interval, setInterval] = import_react8.default.useState("day");
+  const [workload, setWorkload] = import_react8.default.useState("all");
   const [metricKind, setMetricKind] = import_react8.default.useState(
-    "cost"
+    "calls"
   );
   const [dimension, setDimension] = import_react8.default.useState("total");
-  const [groupBy, setGroupBy] = import_react8.default.useState("participant");
+  const [groupBy, setGroupBy] = import_react8.default.useState("kind");
   const [attribution, setAttribution] = import_react8.default.useState(
     "initiatedBy"
   );
@@ -3177,6 +3351,11 @@ function UsagePage({ context }) {
   const [participantId, setParticipantId] = import_react8.default.useState("");
   const [provider, setProvider] = import_react8.default.useState("");
   const [model, setModel] = import_react8.default.useState("");
+  const [resource, setResource] = import_react8.default.useState("");
+  const [operation, setOperation] = import_react8.default.useState("");
+  const [status, setStatus] = import_react8.default.useState(
+    "all"
+  );
   const [customFrom, setCustomFrom] = import_react8.default.useState("");
   const [customTo, setCustomTo] = import_react8.default.useState("");
   const [usage, setUsage] = import_react8.default.useState(null);
@@ -3186,6 +3365,32 @@ function UsagePage({ context }) {
     () => getUsageRange(period, customFrom, customTo),
     [customFrom, customTo, period]
   );
+  const metricOptions = import_react8.default.useMemo(
+    () => getUsageMetricOptions(workload),
+    [workload]
+  );
+  const groupOptions = import_react8.default.useMemo(
+    () => getUsageGroupOptions(workload),
+    [workload]
+  );
+  const showLlmFields = workload === "llm";
+  const showResourceFields = workload !== "llm";
+  const showDimension = metricKind === "tokens" || metricKind === "cost" && workload === "llm";
+  import_react8.default.useEffect(() => {
+    if (!metricOptions.includes(metricKind)) {
+      setMetricKind(metricOptions[0]);
+    }
+  }, [metricKind, metricOptions]);
+  import_react8.default.useEffect(() => {
+    if (!groupOptions.includes(groupBy)) {
+      setGroupBy(groupOptions[0]);
+    }
+  }, [groupBy, groupOptions]);
+  import_react8.default.useEffect(() => {
+    if (!showDimension && dimension !== "total") {
+      setDimension("total");
+    }
+  }, [dimension, showDimension]);
   import_react8.default.useEffect(() => {
     let active = true;
     setIsLoading(true);
@@ -3194,13 +3399,17 @@ function UsagePage({ context }) {
       attribution,
       from: range.from,
       groupBy,
+      kind: workload,
       interval,
       metric: metricKind,
-      model: emptyToUndefined(model),
+      model: showLlmFields ? emptyToUndefined(model) : void 0,
       namespace: context.scope.namespace || void 0,
+      operation: showResourceFields ? emptyToUndefined(operation) : void 0,
       participantId: emptyToUndefined(participantId),
       participantType,
-      provider: emptyToUndefined(provider),
+      provider: showLlmFields ? emptyToUndefined(provider) : void 0,
+      resource: showResourceFields ? emptyToUndefined(resource) : void 0,
+      status: status === "all" ? void 0 : status,
       threadId: emptyToUndefined(threadId),
       to: range.to
     }).then((next) => {
@@ -3225,12 +3434,18 @@ function UsagePage({ context }) {
     interval,
     metricKind,
     model,
+    operation,
     participantId,
     participantType,
     provider,
     range.from,
     range.to,
-    threadId
+    resource,
+    showLlmFields,
+    showResourceFields,
+    status,
+    threadId,
+    workload
   ]);
   const points = usage?.points ?? [];
   const totals = usage?.totals ?? EMPTY_USAGE_TOTALS;
@@ -3247,9 +3462,10 @@ function UsagePage({ context }) {
       PageHeader,
       {
         title: "Usage",
-        description: "Inspect cost, token, and call attribution across namespaces, models, participants, threads, and providers.",
+        description: "Inspect metered LLM, tool, and resource activity by workload, actor, status, cost, duration, tokens, and credits.",
         badges: [
-          { label: period },
+          { label: workload },
+          { label: getUsageMetricLabel(metricKind), variant: "secondary" },
           { label: getUsageGroupLabel(groupBy), variant: "secondary" },
           ...isLoading ? [{ label: "Loading" }] : []
         ]
@@ -3277,10 +3493,21 @@ function UsagePage({ context }) {
       /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         UsageSelect,
         {
-          label: "Metric",
+          label: "Workload",
+          onValueChange: (value) => setWorkload(value),
+          options: USAGE_WORKLOADS,
+          value: workload,
+          formatOption: getUsageKindLabel
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        UsageSelect,
+        {
+          label: "Measure",
           onValueChange: (value) => setMetricKind(value),
-          options: ["cost", "tokens", "calls"],
-          value: metricKind
+          options: metricOptions,
+          value: metricKind,
+          formatOption: getUsageMetricLabel
         }
       ),
       /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
@@ -3288,20 +3515,22 @@ function UsagePage({ context }) {
         {
           label: "Group",
           onValueChange: (value) => setGroupBy(value),
-          options: ["participant", "thread", "namespace", "provider", "model"],
-          value: groupBy
+          options: groupOptions,
+          value: groupBy,
+          formatOption: getUsageGroupLabel
         }
       ),
       /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         UsageSelect,
         {
-          label: "Attribution",
+          label: "Actor",
           onValueChange: (value) => setAttribution(value),
           options: ["initiatedBy", "generatedBy"],
-          value: attribution
+          value: attribution,
+          formatOption: getUsageAttributionLabel
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+      showDimension && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         UsageSelect,
         {
           label: "Dimension",
@@ -3336,12 +3565,21 @@ function UsagePage({ context }) {
       /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         UsageSelect,
         {
-          label: "Type",
+          label: "Actor type",
           onValueChange: (value) => setParticipantType(value),
           options: ["all", "human", "agent", "job"],
           value: participantType
         }
       ),
+      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        UsageSelect,
+        {
+          label: "Status",
+          onValueChange: (value) => setStatus(value),
+          options: STATUS_OPTIONS,
+          value: status
+        }
+      ),
       /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         Input,
         {
@@ -3360,46 +3598,86 @@ function UsagePage({ context }) {
           value: participantId
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-        Input,
-        {
-          className: "h-8 w-[140px]",
-          onChange: (event) => setProvider(event.target.value),
-          placeholder: "Provider",
-          value: provider
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
-        Input,
-        {
-          className: "h-8 w-[140px]",
-          onChange: (event) => setModel(event.target.value),
-          placeholder: "Model",
-          value: model
-        }
-      )
+      showResourceFields && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+          Input,
+          {
+            className: "h-8 w-[170px]",
+            onChange: (event) => setResource(event.target.value),
+            placeholder: "Resource / tool",
+            value: resource
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+          Input,
+          {
+            className: "h-8 w-[150px]",
+            onChange: (event) => setOperation(event.target.value),
+            placeholder: "Operation",
+            value: operation
+          }
+        )
+      ] }),
+      showLlmFields && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+          Input,
+          {
+            className: "h-8 w-[140px]",
+            onChange: (event) => setProvider(event.target.value),
+            placeholder: "Provider",
+            value: provider
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+          Input,
+          {
+            className: "h-8 w-[140px]",
+            onChange: (event) => setModel(event.target.value),
+            placeholder: "Model",
+            value: model
+          }
+        )
+      ] })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
       MetricStrip,
       {
         items: [
           {
-            detail: `${totals.totalCalls} calls`,
+            detail: `${formatMetricValue(totals.unpricedCalls, "unpriced")} unpriced`,
             icon: import_lucide_react12.DollarSign,
-            label: "Cost",
+            label: "Spend",
             value: formatMetricValue(totals.totalCostUsd, "cost")
           },
           {
-            detail: `${formatMetricValue(totals.inputTokens, "tokens")} input`,
+            detail: `${formatMetricValue(totals.failedCalls, "failures")} failed`,
             icon: import_lucide_react12.Activity,
+            label: "Calls",
+            value: formatMetricValue(totals.totalCalls, "calls")
+          },
+          {
+            detail: "Tool and resource runtime",
+            icon: import_lucide_react12.Clock,
+            label: "Duration",
+            value: formatMetricValue(totals.totalDurationMs, "duration")
+          },
+          {
+            detail: `${formatMetricValue(totals.inputTokens, "tokens")} input`,
+            icon: import_lucide_react12.Sparkles,
             label: "Tokens",
             value: formatMetricValue(totals.totalTokens, "tokens")
           },
           {
-            detail: `${formatMetricValue(totals.reasoningTokens, "tokens")} reasoning`,
-            icon: import_lucide_react12.Sparkles,
-            label: "Calls",
-            value: formatMetricValue(totals.totalCalls, "calls")
+            detail: "Custom metering",
+            icon: import_lucide_react12.Coins,
+            label: "Credits",
+            value: formatMetricValue(totals.totalCredits, "credits")
+          },
+          {
+            detail: "Failed or aborted work",
+            icon: import_lucide_react12.AlertTriangle,
+            label: "Failures",
+            value: formatMetricValue(totals.failedCalls, "failures")
           }
         ]
       }
@@ -3408,7 +3686,7 @@ function UsagePage({ context }) {
       EmptyState,
       {
         title: "No usage",
-        description: "Usage records will appear here when provider-native usage is captured."
+        description: "Metered LLM, tool, and resource records will appear here after work is captured in the usage ledger."
       }
     ) : /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(Card, { className: "h-[320px] py-3", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(CardContent, { className: "h-full px-3", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(UsageChart, { chartState, metricKind }) }) }),
@@ -3487,6 +3765,7 @@ function UsageRowsTable({
   totals
 }) {
   const totalValue = getUsageTotalValue(totals, metricKind, dimension);
+  const valueHeader = (metricKind === "tokens" || metricKind === "cost") && dimension !== "total" ? `${getUsageDimensionLabel(dimension)} ${getUsageMetricLabel(metricKind)}` : getUsageMetricLabel(metricKind);
   return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     ResourceTable,
     {
@@ -3504,7 +3783,7 @@ function UsageRowsTable({
         {
           align: "right",
           id: "value",
-          header: `${getUsageDimensionLabel(dimension)} ${metricKind}`,
+          header: valueHeader,
           render: (row) => formatMetricValue(row.value, metricKind)
         },
         {
@@ -3521,20 +3800,100 @@ function UsageRowsTable({
         },
         {
           align: "right",
-          id: "input",
-          header: "Input",
-          render: (row) => formatMetricValue(getUsageTotalValue(row, metricKind, "input"), metricKind)
+          id: "spend",
+          header: "Spend",
+          render: (row) => formatMetricValue(row.totalCostUsd, "cost")
         },
         {
           align: "right",
-          id: "output",
-          header: "Output",
-          render: (row) => formatMetricValue(getUsageTotalValue(row, metricKind, "output"), metricKind)
+          id: "duration",
+          header: "Duration",
+          render: (row) => formatMetricValue(row.totalDurationMs, "duration")
+        },
+        {
+          align: "right",
+          id: "tokens",
+          header: "Tokens",
+          render: (row) => formatMetricValue(row.totalTokens, "tokens")
+        },
+        {
+          align: "right",
+          id: "failures",
+          header: "Failures",
+          render: (row) => formatMetricValue(row.failedCalls, "failures")
+        },
+        {
+          align: "right",
+          id: "unpriced",
+          header: "Unpriced",
+          render: (row) => formatMetricValue(row.unpricedCalls, "unpriced")
         }
       ]
     }
   );
 }
+function getUsageMetricOptions(workload) {
+  if (workload === "llm") {
+    return ["cost", "tokens", "calls", "failures", "unpriced"];
+  }
+  if (workload === "tool") {
+    return ["calls", "duration", "cost", "credits", "failures", "unpriced"];
+  }
+  return [
+    "calls",
+    "cost",
+    "duration",
+    "tokens",
+    "credits",
+    "failures",
+    "unpriced"
+  ];
+}
+function getUsageGroupOptions(workload) {
+  if (workload === "llm") {
+    return ["participant", "model", "provider", "thread", "namespace", "status"];
+  }
+  if (workload === "tool") {
+    return [
+      "resource",
+      "operation",
+      "status",
+      "participant",
+      "thread",
+      "namespace"
+    ];
+  }
+  return [
+    "kind",
+    "resource",
+    "operation",
+    "status",
+    "participant",
+    "thread",
+    "namespace"
+  ];
+}
+function getUsageKindLabel(kind) {
+  switch (kind) {
+    case "all":
+      return "All";
+    case "llm":
+      return "LLM";
+    case "tool":
+      return "Tools";
+    case "asset":
+      return "Assets";
+    case "rag":
+      return "RAG";
+    case "embedding":
+      return "Embeddings";
+    default:
+      return kind;
+  }
+}
+function getUsageAttributionLabel(attribution) {
+  return attribution === "initiatedBy" ? "Initiator" : "Performer";
+}
 function emptyToUndefined(value) {
   const trimmed = value.trim();
   return trimmed.length > 0 ? trimmed : void 0;
@@ -4023,6 +4382,7 @@ function useCopilotzAdmin(options = {}) {
   formatUsageBucket,
   getUsageDimensionLabel,
   getUsageGroupLabel,
+  getUsageMetricLabel,
   getUsageRange,
   getUsageTotalValue,
   mergeAdminConfig,