tokmon 0.21.0 → 0.22.0

package/dist/{bootstrap-ink-QHJOOWIW.js → bootstrap-ink-P3PH2EV4.js}

@@ -13,12 +13,13 @@ import {
   cursorModelSpend,
   detectProviders,
   fetchPeak,
+  modelColor,
   resolveTimezone,
   shortDate,
   systemTimezone,
   time,
   tokens
-} from "./chunk-YCIUMAKK.js";
+} from "./chunk-2PIYMU6W.js";
 import {
   COLOR_PALETTE,
   DEFAULTS,
@@ -1086,7 +1087,7 @@ var TableProviderBar = memo4(function TableProviderBar2({ providers, active, onS
     /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: "  p/P switch" })
   ] });
 });
-var ControlBar = memo4(function ControlBar2({ views, period, sort, search, searchCaret, searching, showPeriod }) {
+var ControlBar = memo4(function ControlBar2({ views, period, sort, model, search, searchCaret, searching, showPeriod, showModel }) {
   return /* @__PURE__ */ jsxs4(Box4, { children: [
     showPeriod && /* @__PURE__ */ jsxs4(Fragment3, { children: [
       views.map((v, i) => /* @__PURE__ */ jsx4(Box4, { marginRight: 2, children: i === period ? /* @__PURE__ */ jsxs4(Text4, { bold: true, color: "cyan", children: [
@@ -1103,6 +1104,15 @@ var ControlBar = memo4(function ControlBar2({ views, period, sort, search, searc
       glyphs().middot,
       "  "
     ] }),
+    showModel && /* @__PURE__ */ jsxs4(Fragment3, { children: [
+      /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: "model " }),
+      /* @__PURE__ */ jsx4(Text4, { bold: true, color: model ? modelColor(model) : "cyan", children: model ?? "all" }),
+      /* @__PURE__ */ jsxs4(Text4, { dimColor: true, children: [
+        "  m model  ",
+        glyphs().middot,
+        "  "
+      ] })
+    ] }),
     searching ? /* @__PURE__ */ jsxs4(Fragment3, { children: [
       /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: "/" }),
       /* @__PURE__ */ jsx4(CaretText, { value: search, caret: searchCaret, color: "cyan" })
@@ -2038,6 +2048,45 @@ function sortRows(rows, sortIdx) {
       return sorted;
   }
 }
+function tableModelOptions(rows) {
+  const models = /* @__PURE__ */ new Set();
+  for (const row of rows) for (const model of row.breakdown) models.add(model.name);
+  return [...models].sort();
+}
+function cycleTableModel(current, models, dir) {
+  if (models.length === 0) return null;
+  const idx = current ? models.indexOf(current) : -1;
+  if (dir === 1) {
+    if (idx < 0) return models[0];
+    return idx === models.length - 1 ? null : models[idx + 1];
+  }
+  if (idx < 0) return models[models.length - 1];
+  return idx === 0 ? null : models[idx - 1];
+}
+function filterRowsByModel(rows, model) {
+  if (!model) return rows;
+  return rows.flatMap((row) => {
+    const detail = row.breakdown.find((m) => m.name === model);
+    if (!detail) return [];
+    const input = detail.input;
+    const output = detail.output;
+    const cacheCreate = detail.cacheCreate;
+    const cacheRead = detail.cacheRead;
+    return [{
+      label: row.label,
+      models: [model],
+      input,
+      output,
+      cacheCreate,
+      cacheRead,
+      cacheSavings: detail.cacheSavings,
+      total: input + output + cacheCreate + cacheRead,
+      cost: detail.cost,
+      count: detail.count,
+      breakdown: [{ ...detail }]
+    }];
+  });
+}
 function filterTokenRows(rows, q) {
   if (!q) return rows;
   const s = q.toLowerCase();
@@ -2122,6 +2171,7 @@ function handleKey(input, key, ctx) {
     setSort,
     SORTS_FOR,
     tableIsCursor,
+    cycleTableModel: cycleTableModel2,
     setView,
     cursor,
     rowCountRef,
@@ -2550,8 +2600,11 @@ function handleKey(input, key, ctx) {
         return;
       }
       if (input === "m") {
-        setView(2);
-        resetView();
+        cycleTableModel2(1);
+        return;
+      }
+      if (input === "M") {
+        cycleTableModel2(-1);
         return;
       }
       if (key.leftArrow) {
@@ -2977,6 +3030,7 @@ function App({ interval: cliInterval, initialConfig, baseUrl = null, wsToken = n
   const [expanded, setExpanded] = useState8(-1);
   const [sort, setSort] = useState8(1);
   const [tableProvider, setTableProvider] = useState8(null);
+  const [tableModel, setTableModel] = useState8(null);
   const [search, setSearch] = useState8("");
   const [searchMode, setSearchMode] = useState8(false);
   const [cursorRowsLocal, setCursorRows] = useState8(null);
@@ -3163,6 +3217,7 @@ function App({ interval: cliInterval, initialConfig, baseUrl = null, wsToken = n
     setCursorRows(null);
     setCursor(0);
     setExpanded(-1);
+    setTableModel(null);
     setSort(tableIsCursor ? 0 : 1);
     setTableLoading(false);
   }, [tableKey]);
@@ -3202,7 +3257,7 @@ function App({ interval: cliInterval, initialConfig, baseUrl = null, wsToken = n
   useEffect7(() => {
     setCursor(0);
     setExpanded(-1);
-  }, [search]);
+  }, [search, tableModel]);
   useEffect7(() => {
     setDashPage((p) => Math.min(p, dashPageCount - 1));
   }, [dashPageCount]);
@@ -3319,6 +3374,7 @@ function App({ interval: cliInterval, initialConfig, baseUrl = null, wsToken = n
     setSort(nextIsCursor ? 0 : 1);
     setCursor(0);
     setExpanded(-1);
+    setTableModel(null);
     setSearch("");
     setSearchCaret(0);
     setSearchMode(false);
@@ -3348,7 +3404,7 @@ function App({ interval: cliInterval, initialConfig, baseUrl = null, wsToken = n
     if (webStartingRef.current) return;
     webStartingRef.current = true;
     try {
-      const { startWebServer } = await import("./server-F7CUK4ZM.js");
+      const { startWebServer } = await import("./server-GEGTLRUW.js");
       const ctrl = await startWebServer({ config: cfg, log: false });
       webRef.current = ctrl;
       openUrl(ctrl.url);
@@ -3369,6 +3425,7 @@ function App({ interval: cliInterval, initialConfig, baseUrl = null, wsToken = n
     setTableProvider(p);
     setCursor(0);
     setExpanded(-1);
+    setTableModel(null);
     setSearch("");
     setSearchCaret(0);
     setSearchMode(false);
@@ -3378,9 +3435,22 @@ function App({ interval: cliInterval, initialConfig, baseUrl = null, wsToken = n
     else setCursor(idx);
   }, [cursor]);
   const onRowClickCursor = useCallback4((idx) => setCursor(idx), []);
+  const rawTokenRows = useMemo2(
+    () => tab === 1 && !tableIsCursor ? table ? [table.daily, table.weekly, table.monthly][view] : [] : [],
+    [tab, tableIsCursor, table, view]
+  );
+  const tokenModelOptions = useMemo2(() => tableModelOptions(rawTokenRows), [rawTokenRows]);
+  useEffect7(() => {
+    if (tableModel && !tokenModelOptions.includes(tableModel)) setTableModel(null);
+  }, [tableModel, tokenModelOptions]);
+  const cycleTableModelFilter = useCallback4((dir) => {
+    setTableModel((cur) => cycleTableModel(cur, tokenModelOptions, dir));
+    resetView();
+  }, [tokenModelOptions, resetView]);
+  const activeTableModel = tableModel && tokenModelOptions.includes(tableModel) ? tableModel : null;
   const tokenRows = useMemo2(
-    () => tab === 1 && !tableIsCursor ? sortRows(filterTokenRows(table ? [table.daily, table.weekly, table.monthly][view] : [], search), sort) : [],
-    [tab, tableIsCursor, table, view, search, sort]
+    () => tab === 1 && !tableIsCursor ? sortRows(filterTokenRows(filterRowsByModel(rawTokenRows, activeTableModel), search), sort) : [],
+    [tab, tableIsCursor, rawTokenRows, activeTableModel, search, sort]
   );
   const cursorTableRows = useMemo2(
     () => tab === 1 && tableIsCursor ? sortCursorRows(filterCursorRows(cursorRows ?? [], search), sort) : [],
@@ -3446,6 +3516,7 @@ function App({ interval: cliInterval, initialConfig, baseUrl = null, wsToken = n
     setSort,
     SORTS_FOR,
     tableIsCursor,
+    cycleTableModel: cycleTableModelFilter,
     setView,
     cursor,
     rowCountRef,
@@ -3563,10 +3634,12 @@ function App({ interval: cliInterval, initialConfig, baseUrl = null, wsToken = n
             views: VIEWS,
             period: view,
             sort: sortLabel(SORTS_FOR[sort % SORTS_FOR.length]),
+            model: activeTableModel,
             search,
             searchCaret,
             searching: searchMode,
-            showPeriod: !tableIsCursor
+            showPeriod: !tableIsCursor,
+            showModel: !tableIsCursor
           }
         ),
         /* @__PURE__ */ jsx11(Box11, { height: 1 }),