@stigmer/react 3.12.3 → 3.12.5

package/src/provider-standing/useProviderStanding.ts

@@ -0,0 +1,50 @@
+"use client";
+
+import type { ProviderStandingView } from "@stigmer/protos/ai/stigmer/platform/providerstanding/v1/io_pb";
+import { useStigmer } from "../hooks.js";
+import { useFetch } from "../internal/useFetch.js";
+
+/** Return value of {@link useProviderStanding}. */
+export interface UseProviderStandingReturn {
+  /** The standing view, or `null` before the first successful fetch. */
+  readonly standing: ProviderStandingView | null;
+  /** `true` while the initial fetch is in flight. */
+  readonly isLoading: boolean;
+  /** `true` while a background refetch is in flight and stale data is shown. */
+  readonly isRefetching: boolean;
+  /** Error from the last failed request, or `null` when healthy. */
+  readonly error: Error | null;
+  /** Discard cached data and re-fetch from the server. */
+  readonly refetch: () => void;
+}
+
+/**
+ * Data hook for platform provider standing: the latest canary-probe
+ * verdict per platform LLM provider account (status, latency, bounded
+ * error summary, probe time), recorded hourly by the standing probe.
+ *
+ * Platform-operator surface: the caller needs
+ * `can_view_provider_standing` on `platform:stigmer`. Cloud-only — the
+ * OSS Go server does not implement the controller.
+ *
+ * Pass `enabled: false` to skip fetching (stable no-op).
+ *
+ * @example
+ * ```tsx
+ * const { standing, isLoading, refetch } = useProviderStanding();
+ * ```
+ */
+export function useProviderStanding(
+  options?: { readonly enabled?: boolean },
+): UseProviderStandingReturn {
+  const stigmer = useStigmer();
+  const enabled = options?.enabled ?? true;
+
+  const { data: standing, isLoading, isRefetching, error, refetch } = useFetch(
+    enabled ? () => stigmer.providerStanding.getStandingView() : null,
+    [enabled, stigmer],
+    null as ProviderStandingView | null,
+  );
+
+  return { standing, isLoading, isRefetching, error, refetch };
+}

package/src/provider.tsx

@@ -240,6 +240,18 @@ const EMPTY_REVIEW_RENDERERS: ReviewRenderers = {};
  * column makes it balloon even in a content-sized page), so only
  * the host — which knows its layout — can apply it safely.
  *
+ * **Hosts without a global CSS reset.** SDK components carry their
+ * own per-element resets (lists, fieldsets, form controls) and the
+ * markdown surfaces declare their margins explicitly, so they render
+ * correctly with no Tailwind-preflight-style reset in the host page
+ * (#695). Two deliberate boundaries remain the host's: font-family
+ * inherits from the host (an embedded widget adopting host typography
+ * is correct — set `--stgm-font-sans` to override), and the host's
+ * OWN content inside the provider keeps its user-agent styling — the
+ * SDK never resets elements it did not render. If your reset-less
+ * page composes its own `<p>`/`<h*>` content between SDK components,
+ * their user-agent margins are yours to manage.
+ *
  * Two stable selector hooks are part of the public contract:
  * `data-stgm-root` marks the in-tree container (and only it);
  * `data-stgm-portal` marks the portal container appended to

package/src/resource-creation/StepIndicator.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { cn } from "@stigmer/theme";
+import { UNSTYLED_LIST } from "../internal/element-resets.js";
 
 /** Props for {@link StepIndicator}. */
 export interface StepIndicatorProps {
@@ -37,7 +38,7 @@ export function StepIndicator({
       aria-label="Wizard progress"
       className={cn("stg:flex stg:flex-col stg:gap-1", className)}
     >
-      <ol className="stg:flex stg:flex-col stg:gap-1" role="list">
+      <ol className={cn(UNSTYLED_LIST, "stg:flex stg:flex-col stg:gap-1")} role="list">
         {steps.map((step, index) => {
           const state = getStepState(index, currentStepIndex);
           const isClickable = state === "completed" && onStepClick != null;

package/src/schedule/ScheduleDetailView.tsx

@@ -2,6 +2,7 @@
 
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { cn } from "@stigmer/theme";
+import { UNSTYLED_LIST } from "../internal/element-resets.js";
 import { create } from "@bufbuild/protobuf";
 import { timestampDate } from "@bufbuild/protobuf/wkt";
 import type { Schedule } from "@stigmer/protos/ai/stigmer/agentic/schedule/v1/api_pb";
@@ -1356,7 +1357,7 @@ function EnvironmentRefList({
     return <span className="stg:text-sm stg:text-muted-foreground">—</span>;
   }
   return (
-    <ul className="stg:flex stg:flex-col stg:gap-0.5">
+    <ul className={cn(UNSTYLED_LIST, "stg:flex stg:flex-col stg:gap-0.5")}>
       {refs.map((ref, i) => (
         <li
           key={`${ref.org}/${ref.slug}-${i}`}
@@ -1470,7 +1471,7 @@ function WorkspaceSummary({
     return <span className="stg:text-sm stg:text-muted-foreground">—</span>;
   }
   return (
-    <ul className="stg:flex stg:flex-col stg:gap-0.5">
+    <ul className={cn(UNSTYLED_LIST, "stg:flex stg:flex-col stg:gap-0.5")}>
       {entries.map((entry, i) => {
         const git =
           entry.source?.source?.case === "gitRepo"

package/src/schedule/ScheduleRunsTable.tsx

@@ -2,6 +2,7 @@
 
 import { useState } from "react";
 import { cn } from "@stigmer/theme";
+import { UNSTYLED_LIST } from "../internal/element-resets.js";
 import { timestampDate } from "@bufbuild/protobuf/wkt";
 import {
   ScheduleRunOrigin,
@@ -277,7 +278,7 @@ export function ScheduleRunsCompactList({
     return <EmptyRuns />;
   }
   return (
-    <ul className="stg:divide-y stg:divide-border">
+    <ul className={cn(UNSTYLED_LIST, "stg:divide-y stg:divide-border")}>
       {runs.map((run, i) => (
         <CompactRunRow
           key={runKey(run, i)}

package/src/session/NewSessionViewer.tsx

@@ -9,6 +9,7 @@ import type { WorkspaceContentSearcher } from "../workspace/WorkspaceContentSear
 import type { InteractionModeOption } from "../composer/index.js";
 import { SessionComposer } from "../composer/index.js";
 import type { HarnessOption } from "../models/harness.js";
+import type { AccountExecutionDefaults } from "../identity-account/useAccountExecutionDefaults.js";
 import { SessionViewerLayout } from "./SessionViewerLayout.js";
 import { useWorkspaceEditors } from "../internal/store/index.js";
 import { WorkspaceSurface } from "../workspace/WorkspaceSurface.js";
@@ -163,6 +164,15 @@ export interface NewSessionViewerProps {
    */
   readonly defaultHarness?: HarnessOption;
 
+  /**
+   * The user's account-level execution defaults, typically from
+   * `useAccountExecutionDefaults()`. Seeds the harness and model pickers
+   * under the layered precedence documented on
+   * {@link UseNewSessionFlowOptions.accountDefaults}; explicit device
+   * picks always win. Ignored for the `"guest"` audience.
+   */
+  readonly accountDefaults?: AccountExecutionDefaults;
+
   /** Agent to auto-select on mount (used for draft flows). */
   readonly initialAgentRef?: ResourceRef;
   /**
@@ -253,6 +263,7 @@ export function NewSessionViewer({
   panelOpen,
   onPanelOpenChange,
   defaultHarness,
+  accountDefaults,
   initialAgentRef,
   initialInstanceId,
   initialAttachments,
@@ -269,6 +280,7 @@ export function NewSessionViewer({
     onError,
     getRuntimeEnv,
     defaultHarness,
+    accountDefaults,
     audience,
     runConfig,
   });

package/src/session/__tests__/UsageTab.test.tsx

@@ -0,0 +1,136 @@
+// The #362 console surface: the Usage tab pairs billing's RESOLVED
+// per-execution model (the after-the-fact truth for Cursor Auto runs)
+// with the tier the runner REQUESTED (the streaming summary's audit
+// record that the account default was never left in control).
+
+import { describe, it, expect, afterEach, vi } from "vitest";
+import { render, screen, cleanup } from "@testing-library/react";
+import { create } from "@bufbuild/protobuf";
+import { AgentExecutionSchema } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/api_pb";
+import { ServiceTier } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
+import type { UseSessionUsageReturn } from "../useSessionUsage.js";
+
+// UsageTab's render contract is what this suite pins; the aggregation
+// itself (billing-report-wins, streaming fallback, breakdown mapping) is
+// useSessionUsage's own suite. Mocking the hook also spares the RPC
+// provider plumbing.
+const usageMock = vi.hoisted(() => vi.fn<() => UseSessionUsageReturn>());
+vi.mock("../useSessionUsage.js", async (importOriginal) => ({
+  ...(await importOriginal<object>()),
+  useSessionUsage: () => usageMock(),
+}));
+
+import { UsageTab } from "../facets/UsageTab.js";
+
+// UsageWidget re-aggregates via the real hook internally — with the module
+// mocked above it sees the same mocked value, which is exactly the intent.
+
+const EMPTY_USAGE: UseSessionUsageReturn = {
+  totalCostUsd: 0,
+  totalTokens: 0,
+  inputTokens: 0,
+  outputTokens: 0,
+  cacheReadTokens: 0,
+  cacheCreationTokens: 0,
+  llmCallCount: 0,
+  modelBreakdown: [],
+  executionBreakdown: [],
+  primaryModel: "",
+  primaryProvider: "",
+  hasUsage: false,
+  isEstimated: false,
+};
+
+function usageWith(overrides: Partial<UseSessionUsageReturn>): UseSessionUsageReturn {
+  return {
+    ...EMPTY_USAGE,
+    hasUsage: true,
+    totalCostUsd: 0.0123,
+    totalTokens: 100,
+    llmCallCount: 1,
+    primaryModel: "composer-2.5",
+    primaryProvider: "cursor",
+    ...overrides,
+  };
+}
+
+function executionWithTier(id: string, tier?: ServiceTier) {
+  return create(AgentExecutionSchema, {
+    metadata: { id },
+    spec: { sessionId: "ses_1" },
+    status: {
+      streamingUsage: {
+        totalTokens: 100n,
+        turnCount: 1,
+        estimatedCostUsd: 0.01,
+        model: "default",
+        ...(tier !== undefined ? { requestedServiceTier: tier } : {}),
+      },
+    },
+  });
+}
+
+afterEach(cleanup);
+
+describe("UsageTab (#362 model provenance)", () => {
+  it("shows the empty state when no usage exists", () => {
+    usageMock.mockReturnValue(EMPTY_USAGE);
+    render(<UsageTab executions={[]} />);
+    expect(screen.getByText(/No usage data yet/)).toBeTruthy();
+  });
+
+  it("renders the billing-resolved model per run with its cost — the Auto forensics view", () => {
+    usageMock.mockReturnValue(usageWith({
+      executionBreakdown: [{
+        executionId: "exe_1",
+        resolvedModel: "cursor-grok-4.5-high-fast",
+        billableCostUsd: 0.0123,
+        isEstimated: false,
+      }],
+    }));
+
+    render(<UsageTab executions={[executionWithTier("exe_1", ServiceTier.STANDARD)]} />);
+
+    expect(screen.getByText(/cursor-grok-4\.5-high-fast/)).toBeTruthy();
+    expect(screen.getByRole("list", { name: "Per-execution model and tier" })).toBeTruthy();
+  });
+
+  it("pairs the run with the tier the runner requested", () => {
+    usageMock.mockReturnValue(usageWith({
+      executionBreakdown: [{
+        executionId: "exe_1",
+        resolvedModel: "composer-2.5",
+        billableCostUsd: 0.0123,
+        isEstimated: false,
+      }],
+    }));
+
+    render(<UsageTab executions={[executionWithTier("exe_1", ServiceTier.FAST)]} />);
+
+    expect(screen.getByText("fast requested")).toBeTruthy();
+  });
+
+  it("omits the tier chip for executions that predate the tier attribute", () => {
+    usageMock.mockReturnValue(usageWith({
+      executionBreakdown: [{
+        executionId: "exe_0",
+        resolvedModel: "claude-haiku-4.5",
+        billableCostUsd: 0.0042,
+        isEstimated: false,
+      }],
+    }));
+
+    render(<UsageTab executions={[executionWithTier("exe_0")]} />);
+
+    expect(screen.getByText(/claude-haiku-4\.5/)).toBeTruthy();
+    expect(screen.queryByText(/requested/)).toBeNull();
+  });
+
+  it("renders no provenance list before any billing record lands", () => {
+    usageMock.mockReturnValue(usageWith({ executionBreakdown: [] }));
+
+    render(<UsageTab executions={[executionWithTier("exe_1", ServiceTier.STANDARD)]} />);
+
+    expect(screen.queryByRole("list", { name: "Per-execution model and tier" })).toBeNull();
+  });
+});

package/src/session/__tests__/useNewSessionFlow.test.tsx

@@ -805,6 +805,157 @@ describe("useNewSessionFlow", () => {
     });
   });
 
+  describe("accountDefaults (oss#293 Phase 1.5 layered seed)", () => {
+    // Two native models so "stored pick outranks account default" is
+    // distinguishable; the shared TEST_MODELS carries one per harness.
+    const SEED_MODELS = parseRegistryJson({
+      models: [
+        { id: "claude-sonnet-4.6", displayName: "Claude Sonnet 4.6", shortDescription: "", speedTier: "fast", provider: "anthropic", harness: "native", costTier: "standard", featured: true, pricing: { inputPricePerMillion: 3, outputPricePerMillion: 15, cacheWritePricePerMillion: 3.75, cacheReadPricePerMillion: 0.3 } },
+        { id: "gpt-5.3", displayName: "GPT 5.3", shortDescription: "", speedTier: "fast", provider: "openai", harness: "native", costTier: "standard", featured: false, pricing: { inputPricePerMillion: 2, outputPricePerMillion: 8, cacheWritePricePerMillion: 2, cacheReadPricePerMillion: 0.2 } },
+        { id: "default", displayName: "Cursor Auto", shortDescription: "", speedTier: "fast", provider: "cursor", harness: "cursor", costTier: "standard", featured: true, pricing: { inputPricePerMillion: 1.25, outputPricePerMillion: 6, cacheWritePricePerMillion: 1.25, cacheReadPricePerMillion: 0.25 } },
+        { id: "composer-2.5", displayName: "Composer 2.5", shortDescription: "", speedTier: "fast", provider: "cursor", harness: "cursor", costTier: "standard", featured: false, pricing: { inputPricePerMillion: 1, outputPricePerMillion: 5, cacheWritePricePerMillion: 1, cacheReadPricePerMillion: 0.1 } },
+      ],
+    });
+
+    function seedWrapper() {
+      const state: ModelRegistryState = { models: SEED_MODELS, isLoading: false, error: null, refetch: () => {} };
+      return function Wrapper({ children }: { children: ReactNode }) {
+        return (
+          <ModelRegistryContext.Provider value={state}>
+            {children}
+          </ModelRegistryContext.Provider>
+        );
+      };
+    }
+
+    it("seeds the harness when nothing is stored", () => {
+      const opts = { ...defaultOptions(), accountDefaults: { harness: "cursor" as const } };
+      const { result } = renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      expect(result.current.harness).toBe("cursor");
+    });
+
+    it("a stored harness choice outranks the account default", () => {
+      localStorage.setItem(STORAGE_KEY_HARNESS, "native");
+      const opts = { ...defaultOptions(), accountDefaults: { harness: "cursor" as const } };
+      const { result } = renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      expect(result.current.harness).toBe("native");
+    });
+
+    it("the account harness outranks the embedder defaultHarness", () => {
+      const opts = {
+        ...defaultOptions(),
+        defaultHarness: "native" as const,
+        accountDefaults: { harness: "cursor" as const },
+      };
+      const { result } = renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      expect(result.current.harness).toBe("cursor");
+    });
+
+    it("never persists the seeded harness — only explicit choices", () => {
+      const opts = { ...defaultOptions(), accountDefaults: { harness: "cursor" as const } };
+      renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      expect(localStorage.getItem(STORAGE_KEY_HARNESS)).toBeNull();
+    });
+
+    it("a late-arriving harness seed applies when the user has not picked (whoAmI resolves after mount)", () => {
+      const base: Parameters<typeof useNewSessionFlow>[0] = defaultOptions();
+      const { result, rerender } = renderHook(
+        (opts: Parameters<typeof useNewSessionFlow>[0]) => useNewSessionFlow(opts),
+        { wrapper: seedWrapper(), initialProps: base },
+      );
+      expect(result.current.harness).toBe("native");
+
+      rerender({ ...base, accountDefaults: { harness: "cursor" as const } });
+
+      expect(result.current.harness).toBe("cursor");
+      expect(localStorage.getItem(STORAGE_KEY_HARNESS)).toBeNull();
+    });
+
+    it("a late-arriving harness seed never overrides an explicit pick this mount", () => {
+      const base: Parameters<typeof useNewSessionFlow>[0] = defaultOptions();
+      const { result, rerender } = renderHook(
+        (opts: Parameters<typeof useNewSessionFlow>[0]) => useNewSessionFlow(opts),
+        { wrapper: seedWrapper(), initialProps: base },
+      );
+      act(() => result.current.setHarness("native"));
+
+      rerender({ ...base, accountDefaults: { harness: "cursor" as const } });
+
+      expect(result.current.harness).toBe("native");
+    });
+
+    it("seeds the model for the active harness when nothing is stored", () => {
+      const opts = { ...defaultOptions(), accountDefaults: { nativeModel: "gpt-5.3" } };
+      const { result } = renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      expect(result.current.modelId).toBe("gpt-5.3");
+    });
+
+    it("a stored model pick outranks the account default", async () => {
+      localStorage.setItem(STORAGE_KEY_MODEL_NATIVE, "claude-sonnet-4.6");
+      const opts = { ...defaultOptions(), accountDefaults: { nativeModel: "gpt-5.3" } };
+      const { result } = renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      // The stored restore lands in a passive effect once the registry is
+      // ready; the account seed must not win the race before it.
+      await act(async () => {});
+      expect(result.current.modelId).toBe("claude-sonnet-4.6");
+    });
+
+    it("self-heals a stale account model to the platform default (undefined)", () => {
+      const opts = { ...defaultOptions(), accountDefaults: { nativeModel: "retired-model" } };
+      const { result } = renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      expect(result.current.modelId).toBeUndefined();
+    });
+
+    it("never persists the seeded model — only explicit choices", () => {
+      const opts = { ...defaultOptions(), accountDefaults: { nativeModel: "gpt-5.3" } };
+      renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      expect(localStorage.getItem(STORAGE_KEY_MODEL_NATIVE)).toBeNull();
+    });
+
+    it("follows the active harness: cursorModel seeds cursor sessions", () => {
+      const opts = {
+        ...defaultOptions(),
+        accountDefaults: { harness: "cursor" as const, nativeModel: "gpt-5.3", cursorModel: "composer-2.5" },
+      };
+      const { result } = renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      expect(result.current.harness).toBe("cursor");
+      expect(result.current.modelId).toBe("composer-2.5");
+    });
+
+    it("submits the seeded model explicitly — the pill promise (#663) and the DD-003 seed rule", async () => {
+      const opts = { ...defaultOptions(), accountDefaults: { nativeModel: "gpt-5.3" } };
+      const { result } = renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      await act(async () => {
+        await result.current.submit("Hello");
+      });
+
+      expect(mockCreateExecution.mock.calls[0][0].modelName).toBe("gpt-5.3");
+    });
+
+    it("guest audience ignores accountDefaults entirely", () => {
+      const opts = {
+        ...defaultOptions(),
+        audience: "guest" as const,
+        accountDefaults: { harness: "native" as const, nativeModel: "gpt-5.3", cursorModel: "composer-2.5" },
+      };
+      const { result } = renderHook(() => useNewSessionFlow(opts), { wrapper: seedWrapper() });
+
+      // Platform share policy: cursor harness, no client model.
+      expect(result.current.harness).toBe("cursor");
+      expect(result.current.modelId).toBeUndefined();
+    });
+  });
+
   describe("submit while default agent is loading", () => {
     it("awaits default agent and creates session when fetch resolves", async () => {
       const resolvedAgent = { status: { defaultInstanceId: "awaited-inst" } };

package/src/session/__tests__/useSessionUsage.test.ts

@@ -53,6 +53,14 @@ function authoritativeReport(billableMicros: bigint): GetSessionUsageReportOutpu
       primaryProvider: "cursor",
     },
     modelBreakdown: [],
+    executions: [
+      {
+        executionId: "exe_1",
+        primaryModel: "claude-sonnet-4-6",
+        billableCostMicros: billableMicros,
+        isEstimated: false,
+      },
+    ],
     isEstimated: false,
   } as unknown as GetSessionUsageReportOutput;
 }
@@ -71,6 +79,7 @@ function emptyReport(): GetSessionUsageReportOutput {
       primaryProvider: "",
     },
     modelBreakdown: [],
+    executions: [],
     isEstimated: true,
   } as unknown as GetSessionUsageReportOutput;
 }
@@ -122,6 +131,16 @@ describe("useSessionUsage", () => {
     // 60_000 micros = $0.06 billable, replacing the $0.05 estimate.
     expect(result.current.totalCostUsd).toBeCloseTo(0.06);
     expect(result.current.llmCallCount).toBe(2);
+    // The #362 provenance rows ride the same report: billing-RESOLVED
+    // model per execution, never the runner's requested echo.
+    expect(result.current.executionBreakdown).toEqual([
+      {
+        executionId: "exe_1",
+        resolvedModel: "claude-sonnet-4-6",
+        billableCostUsd: 0.06,
+        isEstimated: false,
+      },
+    ]);
   });
 
   it("polls the usage report while an execution is in progress", async () => {

package/src/session/facets/ArtifactsTab.tsx

@@ -7,6 +7,7 @@ import {
   artifactKey,
   type SessionArtifactEntry,
 } from "../useSessionArtifacts.js";
+import { UNSTYLED_LIST } from "../../internal/element-resets.js";
 import { ArtifactPreviewModal } from "../../execution/ArtifactPreviewModal.js";
 import { ArtifactRow } from "../../execution/ArtifactRow.js";
 import { isPlanArtifact } from "../../library/detect-plan-artifact.js";
@@ -123,7 +124,7 @@ export function ArtifactsTab({
 
   return (
     <>
-      <ul role="list" className="stg:flex stg:flex-col">
+      <ul role="list" className={`${UNSTYLED_LIST} stg:flex stg:flex-col`}>
         {artifacts.map((entry) => (
           <ArtifactRow
             key={artifactKey(entry.artifact)}

package/src/session/facets/ChangesTab.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import type { AgentExecution } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/api_pb";
+import { UNSTYLED_LIST } from "../../internal/element-resets.js";
 import { useSessionWriteBacks } from "../useSessionWriteBacks.js";
 import { WriteBackCard } from "../../execution/WriteBackCard.js";
 
@@ -48,7 +49,7 @@ export function ChangesTab({
     // Dense row groups matching the Artifacts facet's list — gap separates
     // entries only in multi-repo sessions (single-entry lists stay seamless).
     return (
-      <ul role="list" className="stg:flex stg:flex-col stg:gap-3">
+      <ul role="list" className={`${UNSTYLED_LIST} stg:flex stg:flex-col stg:gap-3`}>
         {writeBacks.map((entry) => (
           <li key={entry.writeBack.workspaceEntryName}>
             <WriteBackCard writeBack={entry.writeBack} />

package/src/session/facets/UsageTab.tsx

@@ -1,8 +1,9 @@
 "use client";
 
 import type { AgentExecution } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/api_pb";
-import { useSessionUsage } from "../useSessionUsage.js";
-import { UsageWidget } from "../../execution/UsageWidget.js";
+import { ServiceTier } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
+import { useSessionUsage, type ExecutionUsageEntry } from "../useSessionUsage.js";
+import { UsageWidget, formatCost } from "../../execution/UsageWidget.js";
 
 export interface UsageTabProps {
   readonly executions: readonly AgentExecution[];
@@ -11,9 +12,16 @@ export interface UsageTabProps {
 /**
  * Usage facet for the session panel (a `useSessionRailViews` rail view).
  *
- * Uses `useSessionUsage` to determine if data exists, then delegates
- * rendering to the existing `UsageWidget`. Shows an empty state when
- * no usage data is available.
+ * Renders the session totals ({@link UsageWidget}) plus the #362 model
+ * provenance list: per execution, the billing-RESOLVED model with its
+ * cost — for a Cursor Auto run, the only honest answer to "which model
+ * actually ran and what did it cost", since the requested model is empty
+ * by definition there — paired with the tier the runner REQUESTED (the
+ * streaming summary's audit record that the account default was never
+ * left in control). Requested-vs-billed divergence is a platform alarm
+ * (`stigmer.billing.service_tier.mismatch`), not a per-row UI concern.
+ *
+ * Shows an empty state when no usage data is available.
  */
 export function UsageTab({ executions }: UsageTabProps) {
   const usage = useSessionUsage(executions);
@@ -28,5 +36,89 @@ export function UsageTab({ executions }: UsageTabProps) {
     );
   }
 
-  return <UsageWidget executions={executions} />;
+  return (
+    <div className="stg:flex stg:flex-col stg:gap-4">
+      <UsageWidget executions={executions} />
+      {usage.executionBreakdown.length > 0 && (
+        <ExecutionModelList
+          entries={usage.executionBreakdown}
+          executions={executions}
+        />
+      )}
+    </div>
+  );
+}
+
+/**
+ * Per-execution model provenance rows, in the report's chronological
+ * order: `#N resolved-model [tier requested] [Estimated]  $cost`.
+ */
+function ExecutionModelList({
+  entries,
+  executions,
+}: {
+  readonly entries: readonly ExecutionUsageEntry[];
+  readonly executions: readonly AgentExecution[];
+}) {
+  return (
+    <div
+      className="stg:flex stg:flex-col stg:gap-1"
+      role="list"
+      aria-label="Per-execution model and tier"
+    >
+      <div className="stg:text-xs stg:font-medium stg:text-foreground">
+        Models per run
+      </div>
+      {entries.map((entry, index) => {
+        const requestedTier = requestedTierLabel(executions, entry.executionId);
+        return (
+          <div
+            key={entry.executionId}
+            className="stg:flex stg:items-baseline stg:justify-between stg:gap-2 stg:text-xs stg:text-muted-foreground"
+            role="listitem"
+          >
+            <span className="stg:truncate">
+              <span className="stg:tabular-nums">#{index + 1}</span>{" "}
+              {entry.resolvedModel || "—"}
+              {requestedTier && (
+                <span className="stg:ml-1 stg:rounded stg:bg-muted stg:px-1 stg:py-0.5 stg:text-[10px] stg:font-medium stg:leading-none">
+                  {requestedTier} requested
+                </span>
+              )}
+              {entry.isEstimated && (
+                <span className="stg:ml-1 stg:rounded stg:bg-muted stg:px-1 stg:py-0.5 stg:text-[10px] stg:font-medium stg:leading-none">
+                  Estimated
+                </span>
+              )}
+            </span>
+            <span className="stg:shrink-0 stg:tabular-nums">
+              {formatCost(entry.billableCostUsd)}
+            </span>
+          </div>
+        );
+      })}
+    </div>
+  );
+}
+
+/**
+ * The tier the runner requested for one execution, from its streaming
+ * usage summary — present once the runner has translated the execution
+ * config, absent for executions that predate the tier attribute. Never
+ * "unspecified": the runner records the RESOLVED tier (#357's audit
+ * contract).
+ */
+function requestedTierLabel(
+  executions: readonly AgentExecution[],
+  executionId: string,
+): string | null {
+  const match = executions.find((e) => e.metadata?.id === executionId);
+  switch (match?.status?.streamingUsage?.requestedServiceTier) {
+    case ServiceTier.FAST:
+      return "fast";
+    case ServiceTier.STANDARD:
+      return "standard";
+    default:
+      return null;
+  }
 }

package/src/session/index.ts

@@ -58,6 +58,7 @@ export type { UseSessionFileChangesReturn } from "./useSessionFileChanges.js";
 
 export { useSessionUsage } from "./useSessionUsage.js";
 export type {
+  ExecutionUsageEntry,
   ModelCostEntry,
   UseSessionUsageReturn,
 } from "./useSessionUsage.js";