mirror of
https://github.com/alkimake/paperclip.git
synced 2026-06-18 03:30:39 +09:00
Add cheap model profiles for local adapters (#4881)
## Thinking Path > - Paperclip is a control plane for autonomous AI companies, where adapters are the boundary between the board, agents, and execution runtimes. > - Local adapters currently expose a primary runtime configuration, but operators often need a cheaper model lane for routine or low-risk work. > - That cheap lane has to stay adapter-owned: runtime profile settings should not mutate the primary adapter config or bypass existing auth/secret mediation. > - Issue creation also needs an ergonomic way to request primary, cheap, or custom model behavior for a selected assignee. > - This pull request adds a first-class `cheap` model profile contract across adapter capabilities, heartbeat config resolution, agent configuration, and issue creation. > - The benefit is cheaper task execution can be configured and requested explicitly while preserving adapter boundaries, secret handling, and audit visibility. ## What Changed - Added adapter model-profile capability metadata and a `cheap` profile contract for supported local adapters. - Applied `runtimeConfig.modelProfiles.cheap.adapterConfig` during heartbeat config resolution, including requested/applied/fallback run metadata. - Added agent configuration UI for cheap model profile settings without writing those settings into primary `adapterConfig`. - Added New Issue assignee model lane controls for Primary / Cheap / Custom and request payload handling. - Added run ledger profile badges and Storybook stories for the new cheap-lane UI states. - Added tests for validators, heartbeat model profile application, permission/secret mediation, UI payload helpers, and run ledger rendering. - Added committed UI verification screenshots under `docs/pr-screenshots/pap-2837/`. - Addressed Greptile review feedback around cheap-profile defaults, shared profile types, and fallback test data. ## Verification Local: - `pnpm exec vitest run packages/shared/src/validators/issue.test.ts server/src/__tests__/adapter-registry.test.ts server/src/__tests__/agent-permissions-routes.test.ts server/src/__tests__/heartbeat-model-profile.test.ts ui/src/components/IssueRunLedger.test.tsx ui/src/lib/agent-config-patch.test.ts ui/src/lib/issue-assignee-overrides.test.ts ui/src/lib/new-agent-runtime-config.test.ts` — passed, 8 files / 103 tests. - `pnpm exec vitest run ui/src/lib/new-agent-runtime-config.test.ts ui/src/components/IssueRunLedger.test.tsx` — passed after Greptile/rebase follow-up, 2 files / 17 tests. - `pnpm --filter @paperclipai/ui typecheck` — passed after Greptile/rebase follow-up. - `pnpm -r typecheck` — passed. - `pnpm build` — passed. - `pnpm test:run` — did not complete successfully in this local worktree: it stopped in pre-existing `@paperclipai/adapter-utils` sandbox/SSH fixture suites outside this PR diff. Failures were 5s local timeouts plus `git init -b` unsupported by this machine's Git 2.21.0. The branch-specific targeted suites above passed. - Branch was fetched/rebased onto `public-gh/master`; `git rev-list --left-right --count public-gh/master...HEAD` reports `0 9`. Remote PR checks on latest head `e30bf399146451c86cee98ed528d51d33fa5af5a`: - `policy` — passed. - `verify` — passed. - `e2e` — passed. - `Greptile Review` — passed, confidence score 5/5; Greptile review threads resolved. - `security/snyk (cryppadotta)` — passed. Screenshots: - [New issue cheap lane desktop](https://github.com/paperclipai/paperclip/blob/PAP-2837-plan-cheap-model-for-adapters-that-can-support-it/docs/pr-screenshots/pap-2837/newissue-cheap-desktop.png) - [New issue custom lane desktop](https://github.com/paperclipai/paperclip/blob/PAP-2837-plan-cheap-model-for-adapters-that-can-support-it/docs/pr-screenshots/pap-2837/newissue-custom-desktop.png) - [New issue unsupported adapter desktop](https://github.com/paperclipai/paperclip/blob/PAP-2837-plan-cheap-model-for-adapters-that-can-support-it/docs/pr-screenshots/pap-2837/newissue-unsupported-desktop.png) - [Run ledger model profile badges desktop](https://github.com/paperclipai/paperclip/blob/PAP-2837-plan-cheap-model-for-adapters-that-can-support-it/docs/pr-screenshots/pap-2837/runledger-profile-badges-desktop.png) - Mobile variants are also in `docs/pr-screenshots/pap-2837/`. ## Risks - Medium: heartbeat config mediation now merges runtime model profiles into adapter configs, so adapter secret normalization and host-command restrictions must keep covering nested config paths. - Medium: the UI adds another issue creation choice; unsupported adapters must keep hiding the cheap lane and preserve primary behavior. - Low migration risk: no database migration is included. > For core feature work, check [`ROADMAP.md`](ROADMAP.md) first and discuss it in `#dev` before opening the PR. Feature PRs that overlap with planned core work may need to be redirected — check the roadmap first. See `CONTRIBUTING.md`. ## Model Used OpenAI Codex coding agent using GPT-5-class reasoning with repo tool use and command execution. Exact served model/context window was not exposed by the runtime. ## Checklist - [x] I have included a thinking path that traces from project context to this change - [x] I have specified the model used (with version and capability details) - [x] I have checked ROADMAP.md and confirmed this PR does not duplicate planned core work - [ ] I have run tests locally and they pass - [x] I have added or updated tests where applicable - [x] If this change affects the UI, I have included before/after screenshots - [x] I have updated relevant documentation to reflect my changes - [x] I have considered and documented any risks above - [x] I will address all Greptile and reviewer comments before requesting merge --------- Co-authored-by: Paperclip <noreply@paperclip.ing> Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Dotta
GitHub
parent
1fe1067361
commit
a3de1d764d
60 changed files with 2216 additions and 151 deletions
|
|
@ -8,6 +8,7 @@ const ALL_FALSE: AdapterCapabilities = {
|
|||
supportsSkills: false,
|
||||
supportsLocalAgentJwt: false,
|
||||
requiresMaterializedRuntimeSkills: false,
|
||||
supportsModelProfiles: false,
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -15,13 +16,13 @@ const ALL_FALSE: AdapterCapabilities = {
|
|||
* return correct values on first render before the /api/adapters call resolves.
|
||||
*/
|
||||
const KNOWN_DEFAULTS: Record<string, AdapterCapabilities> = {
|
||||
claude_local: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: false },
|
||||
codex_local: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: false },
|
||||
cursor: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: true },
|
||||
gemini_local: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: true },
|
||||
opencode_local: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: true },
|
||||
pi_local: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: true },
|
||||
hermes_local: { supportsInstructionsBundle: false, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: false },
|
||||
claude_local: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: false, supportsModelProfiles: true },
|
||||
codex_local: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: false, supportsModelProfiles: true },
|
||||
cursor: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: true, supportsModelProfiles: true },
|
||||
gemini_local: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: true, supportsModelProfiles: true },
|
||||
opencode_local: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: true, supportsModelProfiles: true },
|
||||
pi_local: { supportsInstructionsBundle: true, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: true, supportsModelProfiles: false },
|
||||
hermes_local: { supportsInstructionsBundle: false, supportsSkills: true, supportsLocalAgentJwt: true, requiresMaterializedRuntimeSkills: false, supportsModelProfiles: false },
|
||||
openclaw_gateway: ALL_FALSE,
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@ export interface AdapterCapabilities {
|
|||
supportsSkills: boolean;
|
||||
supportsLocalAgentJwt: boolean;
|
||||
requiresMaterializedRuntimeSkills: boolean;
|
||||
supportsModelProfiles: boolean;
|
||||
}
|
||||
|
||||
export interface AdapterInfo {
|
||||
|
|
|
|||
|
|
@ -13,6 +13,10 @@ import type {
|
|||
Approval,
|
||||
AgentConfigRevision,
|
||||
} from "@paperclipai/shared";
|
||||
import type {
|
||||
AdapterModelProfileDefinition,
|
||||
AdapterModelProfileKey,
|
||||
} from "@paperclipai/adapter-utils";
|
||||
import { isUuidLike, normalizeAgentUrlKey } from "@paperclipai/shared";
|
||||
import { ApiError, api } from "./client";
|
||||
|
||||
|
|
@ -28,6 +32,9 @@ export interface AdapterModel {
|
|||
label: string;
|
||||
}
|
||||
|
||||
export type { AdapterModelProfileKey };
|
||||
export type AdapterModelProfile = AdapterModelProfileDefinition;
|
||||
|
||||
export interface DetectedAdapterModel {
|
||||
model: string;
|
||||
provider: string;
|
||||
|
|
@ -172,6 +179,10 @@ export const agentsApi = {
|
|||
api.get<DetectedAdapterModel | null>(
|
||||
`/companies/${encodeURIComponent(companyId)}/adapters/${encodeURIComponent(type)}/detect-model`,
|
||||
),
|
||||
adapterModelProfiles: (companyId: string, type: string) =>
|
||||
api.get<AdapterModelProfile[]>(
|
||||
`/companies/${encodeURIComponent(companyId)}/adapters/${encodeURIComponent(type)}/model-profiles`,
|
||||
),
|
||||
testEnvironment: (
|
||||
companyId: string,
|
||||
type: string,
|
||||
|
|
|
|||
|
|
@ -41,6 +41,7 @@ import {
|
|||
help,
|
||||
adapterLabels,
|
||||
} from "./agent-config-primitives";
|
||||
import { ToggleSwitch } from "@/components/ui/toggle-switch";
|
||||
import { defaultCreateValues } from "./agent-config-defaults";
|
||||
import { getUIAdapter } from "../adapters";
|
||||
import { ClaudeLocalAdvancedFields } from "../adapters/claude-local/config-fields";
|
||||
|
|
@ -117,7 +118,8 @@ function isOverlayDirty(o: AgentConfigOverlay): boolean {
|
|||
o.adapterType !== undefined ||
|
||||
Object.keys(o.adapterConfig).length > 0 ||
|
||||
Object.keys(o.heartbeat).length > 0 ||
|
||||
Object.keys(o.runtime).length > 0
|
||||
Object.keys(o.runtime).length > 0 ||
|
||||
o.modelProfiles?.cheap !== undefined
|
||||
);
|
||||
}
|
||||
|
||||
|
|
@ -244,15 +246,17 @@ export function AgentConfigForm(props: AgentConfigFormProps) {
|
|||
|
||||
const isDirty = !isCreate && isOverlayDirty(overlay);
|
||||
|
||||
type RecordOverlayGroup = "identity" | "adapterConfig" | "heartbeat" | "runtime";
|
||||
|
||||
/** Read effective value: overlay if dirty, else original */
|
||||
function eff<T>(group: keyof Omit<AgentConfigOverlay, "adapterType">, field: string, original: T): T {
|
||||
function eff<T>(group: RecordOverlayGroup, field: string, original: T): T {
|
||||
const o = overlay[group];
|
||||
if (field in o) return o[field] as T;
|
||||
return original;
|
||||
}
|
||||
|
||||
/** Mark field dirty in overlay */
|
||||
function mark(group: keyof Omit<AgentConfigOverlay, "adapterType">, field: string, value: unknown) {
|
||||
function mark(group: RecordOverlayGroup, field: string, value: unknown) {
|
||||
setOverlay((prev) => ({
|
||||
...prev,
|
||||
[group]: { ...prev[group], [field]: value },
|
||||
|
|
@ -374,8 +378,30 @@ export function AgentConfigForm(props: AgentConfigFormProps) {
|
|||
const [runPolicyAdvancedOpen, setRunPolicyAdvancedOpen] = useState(false);
|
||||
// Popover states
|
||||
const [modelOpen, setModelOpen] = useState(false);
|
||||
const [cheapModelOpen, setCheapModelOpen] = useState(false);
|
||||
const [thinkingEffortOpen, setThinkingEffortOpen] = useState(false);
|
||||
|
||||
// Cheap model profile state — only relevant when the adapter advertises
|
||||
// `supportsModelProfiles`. Defaults are sourced from the adapter's
|
||||
// /model-profiles endpoint so the UI does not encode adapter-specific
|
||||
// cheap defaults.
|
||||
const supportsModelProfiles = adapterCaps.supportsModelProfiles;
|
||||
const { data: adapterCheapProfileDefinitions } = useQuery({
|
||||
queryKey: selectedCompanyId
|
||||
? queryKeys.agents.adapterModelProfiles(selectedCompanyId, adapterType)
|
||||
: ["agents", "none", "adapter-model-profiles", adapterType],
|
||||
queryFn: () => agentsApi.adapterModelProfiles(selectedCompanyId!, adapterType),
|
||||
enabled: Boolean(selectedCompanyId) && supportsModelProfiles,
|
||||
});
|
||||
const adapterCheapDefault = useMemo(() => {
|
||||
return (adapterCheapProfileDefinitions ?? []).find((profile) => profile.key === "cheap") ?? null;
|
||||
}, [adapterCheapProfileDefinitions]);
|
||||
const adapterCheapDefaultModel = useMemo(() => {
|
||||
const adapterConfig = adapterCheapDefault?.adapterConfig ?? {};
|
||||
const value = (adapterConfig as Record<string, unknown>).model;
|
||||
return typeof value === "string" ? value : "";
|
||||
}, [adapterCheapDefault]);
|
||||
|
||||
// Create mode helpers
|
||||
const val = isCreate ? props.values : null;
|
||||
const set = isCreate
|
||||
|
|
@ -516,6 +542,69 @@ export function AgentConfigForm(props: AgentConfigFormProps) {
|
|||
const codexSearchEnabled = adapterType === "codex_local"
|
||||
? (isCreate ? Boolean(val!.search) : eff("adapterConfig", "search", Boolean(config.search)))
|
||||
: false;
|
||||
// Cheap profile read/write helpers. Edit-mode values come from
|
||||
// runtimeConfig.modelProfiles.cheap with overlay overrides on top; create-mode
|
||||
// values come straight from CreateConfigValues (cheapModel + cheapModelEnabled).
|
||||
const cheapProfileFromAgent = useMemo(() => {
|
||||
const profiles = (runtimeConfig.modelProfiles ?? {}) as Record<string, unknown>;
|
||||
const cheap = (profiles.cheap ?? {}) as Record<string, unknown>;
|
||||
const cheapAdapterConfig = (cheap.adapterConfig ?? {}) as Record<string, unknown>;
|
||||
return {
|
||||
enabled: cheap.enabled !== false,
|
||||
model: typeof cheapAdapterConfig.model === "string" ? cheapAdapterConfig.model : "",
|
||||
};
|
||||
}, [runtimeConfig]);
|
||||
const cheapOverlay = !isCreate ? overlay.modelProfiles?.cheap : undefined;
|
||||
const currentCheapEnabled = isCreate
|
||||
? val!.cheapModelEnabled ?? false
|
||||
: cheapOverlay?.enabled ?? cheapProfileFromAgent.enabled;
|
||||
const currentCheapModel = isCreate
|
||||
? val!.cheapModel ?? ""
|
||||
: (() => {
|
||||
const overlayModel = (cheapOverlay?.adapterConfig as Record<string, unknown> | undefined)?.model;
|
||||
if (typeof overlayModel === "string") return overlayModel;
|
||||
return cheapProfileFromAgent.model;
|
||||
})();
|
||||
|
||||
function setCheapEnabled(next: boolean) {
|
||||
if (isCreate) {
|
||||
set!({ cheapModelEnabled: next });
|
||||
return;
|
||||
}
|
||||
setOverlay((prev) => ({
|
||||
...prev,
|
||||
modelProfiles: {
|
||||
cheap: {
|
||||
...(prev.modelProfiles?.cheap ?? {}),
|
||||
enabled: next,
|
||||
},
|
||||
},
|
||||
}));
|
||||
}
|
||||
|
||||
function setCheapModel(next: string) {
|
||||
if (isCreate) {
|
||||
set!({ cheapModel: next });
|
||||
return;
|
||||
}
|
||||
setOverlay((prev) => {
|
||||
const existing = prev.modelProfiles?.cheap ?? {};
|
||||
const nextAdapterConfig = {
|
||||
...((existing.adapterConfig ?? {}) as Record<string, unknown>),
|
||||
model: next || undefined,
|
||||
};
|
||||
return {
|
||||
...prev,
|
||||
modelProfiles: {
|
||||
cheap: {
|
||||
...existing,
|
||||
adapterConfig: nextAdapterConfig,
|
||||
},
|
||||
},
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
const effectiveRuntimeConfig = useMemo(() => {
|
||||
if (isCreate) {
|
||||
return {
|
||||
|
|
@ -720,6 +809,7 @@ export function AgentConfigForm(props: AgentConfigFormProps) {
|
|||
setOverlay((prev) => ({
|
||||
...prev,
|
||||
adapterType: t,
|
||||
modelProfiles: { cheap: { cleared: true } },
|
||||
adapterConfig: {
|
||||
model:
|
||||
t === "codex_local"
|
||||
|
|
@ -832,6 +922,9 @@ export function AgentConfigForm(props: AgentConfigFormProps) {
|
|||
/>
|
||||
</Field>
|
||||
|
||||
{supportsModelProfiles && (
|
||||
<div className="text-[11px] uppercase tracking-wide text-muted-foreground">Primary model</div>
|
||||
)}
|
||||
<ModelDropdown
|
||||
models={models}
|
||||
value={currentModelId}
|
||||
|
|
@ -866,6 +959,20 @@ export function AgentConfigForm(props: AgentConfigFormProps) {
|
|||
</p>
|
||||
)}
|
||||
|
||||
{supportsModelProfiles && (
|
||||
<CheapModelSection
|
||||
enabled={currentCheapEnabled}
|
||||
model={currentCheapModel}
|
||||
models={models}
|
||||
adapterType={adapterType}
|
||||
adapterDefaultModel={adapterCheapDefaultModel}
|
||||
onEnabledChange={setCheapEnabled}
|
||||
onModelChange={setCheapModel}
|
||||
open={cheapModelOpen}
|
||||
onOpenChange={setCheapModelOpen}
|
||||
/>
|
||||
)}
|
||||
|
||||
{showThinkingEffort && (
|
||||
<>
|
||||
<ThinkingEffortDropdown
|
||||
|
|
@ -1201,6 +1308,7 @@ function ModelDropdown({
|
|||
refreshingModels,
|
||||
detectModelLabel,
|
||||
emptyDetectHint,
|
||||
defaultLabel,
|
||||
}: {
|
||||
models: AdapterModel[];
|
||||
value: string;
|
||||
|
|
@ -1218,6 +1326,7 @@ function ModelDropdown({
|
|||
refreshingModels?: boolean;
|
||||
detectModelLabel?: string;
|
||||
emptyDetectHint?: string;
|
||||
defaultLabel?: string;
|
||||
}) {
|
||||
const [modelSearch, setModelSearch] = useState("");
|
||||
const [detectingModel, setDetectingModel] = useState(false);
|
||||
|
|
@ -1304,7 +1413,8 @@ function ModelDropdown({
|
|||
<span className={cn(!value && "text-muted-foreground")}>
|
||||
{selected
|
||||
? selected.label
|
||||
: value || (allowDefault ? "Default" : required ? "Select model (required)" : "Select model")}
|
||||
: value
|
||||
|| (allowDefault ? (defaultLabel ?? "Default") : required ? "Select model (required)" : "Select model")}
|
||||
</span>
|
||||
<ChevronDown className="h-3 w-3 text-muted-foreground" />
|
||||
</button>
|
||||
|
|
@ -1500,6 +1610,72 @@ function ModelDropdown({
|
|||
);
|
||||
}
|
||||
|
||||
function CheapModelSection({
|
||||
enabled,
|
||||
model,
|
||||
models,
|
||||
adapterType,
|
||||
adapterDefaultModel,
|
||||
onEnabledChange,
|
||||
onModelChange,
|
||||
open,
|
||||
onOpenChange,
|
||||
}: {
|
||||
enabled: boolean;
|
||||
model: string;
|
||||
models: AdapterModel[];
|
||||
adapterType: string;
|
||||
adapterDefaultModel: string;
|
||||
onEnabledChange: (next: boolean) => void;
|
||||
onModelChange: (next: string) => void;
|
||||
open: boolean;
|
||||
onOpenChange: (open: boolean) => void;
|
||||
}) {
|
||||
const placeholderHint = adapterDefaultModel
|
||||
? `Adapter default · ${adapterDefaultModel}`
|
||||
: "No adapter default — choose a cheaper model";
|
||||
return (
|
||||
<div className="rounded-md border border-border/70 bg-muted/20 p-3 space-y-3">
|
||||
<div className="flex items-center justify-between gap-3">
|
||||
<div className="min-w-0">
|
||||
<div className="text-[11px] uppercase tracking-wide text-muted-foreground">Cheap model</div>
|
||||
<p className="text-xs text-muted-foreground">
|
||||
Used when a run requests the cheap profile (e.g. routine summaries). The primary model stays unchanged.
|
||||
</p>
|
||||
</div>
|
||||
<ToggleSwitch checked={enabled} onCheckedChange={onEnabledChange} />
|
||||
</div>
|
||||
{enabled ? (
|
||||
<ModelDropdown
|
||||
models={models}
|
||||
value={model}
|
||||
onChange={onModelChange}
|
||||
open={open}
|
||||
onOpenChange={onOpenChange}
|
||||
allowDefault
|
||||
required={false}
|
||||
groupByProvider={adapterType === "opencode_local"}
|
||||
creatable
|
||||
detectedModel={null}
|
||||
detectedModelCandidates={[]}
|
||||
emptyDetectHint={placeholderHint}
|
||||
defaultLabel={placeholderHint}
|
||||
/>
|
||||
) : null}
|
||||
{enabled && !model && adapterDefaultModel ? (
|
||||
<p className="text-[11px] text-muted-foreground">
|
||||
No explicit cheap model selected — runtime falls back to <code>{adapterDefaultModel}</code>.
|
||||
</p>
|
||||
) : null}
|
||||
{enabled && !model && !adapterDefaultModel ? (
|
||||
<p className="text-[11px] text-amber-500">
|
||||
No cheap model selected and the adapter has no default. Cheap-lane runs will continue on the primary model with a fallback note.
|
||||
</p>
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function ThinkingEffortDropdown({
|
||||
value,
|
||||
options,
|
||||
|
|
|
|||
|
|
@ -431,6 +431,41 @@ describe("IssueRunLedger", () => {
|
|||
});
|
||||
});
|
||||
|
||||
it("renders requested/applied model profile and surfaces fallback reasons", () => {
|
||||
renderLedger({
|
||||
runs: [
|
||||
createRun({
|
||||
runId: "run-cheap-applied",
|
||||
resultJson: {
|
||||
modelProfile: {
|
||||
requested: "cheap",
|
||||
applied: "cheap",
|
||||
configSource: "agent_runtime",
|
||||
fallbackReason: null,
|
||||
},
|
||||
},
|
||||
}),
|
||||
createRun({
|
||||
runId: "run-cheap-fallback",
|
||||
createdAt: "2026-04-18T19:50:00.000Z",
|
||||
resultJson: {
|
||||
modelProfile: {
|
||||
requested: "cheap",
|
||||
applied: null,
|
||||
configSource: null,
|
||||
fallbackReason: "agent_runtime_profile_disabled",
|
||||
},
|
||||
},
|
||||
}),
|
||||
],
|
||||
});
|
||||
|
||||
expect(container.textContent).toContain("Profile: cheap");
|
||||
expect(container.textContent).toContain("Profile: cheap (unavailable)");
|
||||
expect(container.textContent).toContain("Cheap profile fell back to primary");
|
||||
expect(container.textContent).toContain("agent_runtime_profile_disabled");
|
||||
});
|
||||
|
||||
it("hides watchdog decision actions for known non-owner viewers", () => {
|
||||
const onWatchdogDecision = vi.fn();
|
||||
renderLedger({
|
||||
|
|
|
|||
|
|
@ -159,6 +159,45 @@ function readString(value: unknown) {
|
|||
return typeof value === "string" && value.trim().length > 0 ? value.trim() : null;
|
||||
}
|
||||
|
||||
interface ModelProfileSummary {
|
||||
requested: string;
|
||||
applied: string | null;
|
||||
configSource: string | null;
|
||||
fallbackReason: string | null;
|
||||
}
|
||||
|
||||
function modelProfileForRun(run: RunForIssue): ModelProfileSummary | null {
|
||||
const result = asRecord(run.resultJson);
|
||||
const profile = asRecord(result?.modelProfile);
|
||||
if (!profile) return null;
|
||||
const requested = readString(profile.requested);
|
||||
if (!requested) return null;
|
||||
return {
|
||||
requested,
|
||||
applied: readString(profile.applied),
|
||||
configSource: readString(profile.configSource),
|
||||
fallbackReason: readString(profile.fallbackReason),
|
||||
};
|
||||
}
|
||||
|
||||
function modelProfileBadgeTone(summary: ModelProfileSummary) {
|
||||
if (summary.applied === summary.requested) {
|
||||
return "border-emerald-500/30 bg-emerald-500/10 text-emerald-700 dark:text-emerald-300";
|
||||
}
|
||||
if (summary.fallbackReason) {
|
||||
return "border-amber-500/30 bg-amber-500/10 text-amber-700 dark:text-amber-300";
|
||||
}
|
||||
return "border-border bg-background text-muted-foreground";
|
||||
}
|
||||
|
||||
function modelProfileTitle(summary: ModelProfileSummary) {
|
||||
const lines = [`Requested: ${summary.requested}`];
|
||||
if (summary.applied) lines.push(`Applied: ${summary.applied}`);
|
||||
if (summary.configSource) lines.push(`Source: ${summary.configSource}`);
|
||||
if (summary.fallbackReason) lines.push(`Fallback: ${summary.fallbackReason}`);
|
||||
return lines.join("\n");
|
||||
}
|
||||
|
||||
function readNumber(value: unknown) {
|
||||
return typeof value === "number" && Number.isFinite(value) ? value : null;
|
||||
}
|
||||
|
|
@ -713,6 +752,26 @@ export function IssueRunLedgerContent({
|
|||
{RUN_OUTPUT_SILENCE_COPY[run.outputSilence.level]?.label}
|
||||
</span>
|
||||
) : null}
|
||||
{(() => {
|
||||
const profile = modelProfileForRun(run);
|
||||
if (!profile) return null;
|
||||
const label = profile.applied === profile.requested
|
||||
? `Profile: ${profile.requested}`
|
||||
: profile.applied
|
||||
? `Profile: ${profile.requested} → ${profile.applied}`
|
||||
: `Profile: ${profile.requested} (unavailable)`;
|
||||
return (
|
||||
<span
|
||||
className={cn(
|
||||
"rounded-md border px-1.5 py-0.5 text-[11px] font-medium",
|
||||
modelProfileBadgeTone(profile),
|
||||
)}
|
||||
title={modelProfileTitle(profile)}
|
||||
>
|
||||
{label}
|
||||
</span>
|
||||
);
|
||||
})()}
|
||||
<span className="ml-auto shrink-0">{relativeTime(item.timestamp)}</span>
|
||||
</div>
|
||||
|
||||
|
|
@ -749,6 +808,20 @@ export function IssueRunLedgerContent({
|
|||
</div>
|
||||
) : null}
|
||||
|
||||
{(() => {
|
||||
const profile = modelProfileForRun(run);
|
||||
if (!profile?.fallbackReason || profile.applied === profile.requested) return null;
|
||||
return (
|
||||
<p className="min-w-0 break-words text-[11px] leading-5 text-amber-700 dark:text-amber-300">
|
||||
{profile.requested === "cheap"
|
||||
? "Cheap profile fell back to primary"
|
||||
: `${profile.requested} profile unavailable`}
|
||||
{": "}
|
||||
<span className="font-mono">{profile.fallbackReason}</span>
|
||||
</p>
|
||||
);
|
||||
})()}
|
||||
|
||||
{run.livenessReason ? (
|
||||
<p className="min-w-0 break-words text-xs leading-5 text-muted-foreground">
|
||||
{run.livenessReason}
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
|
|||
import { pickTextColorForSolidBg } from "@/lib/color-contrast";
|
||||
import { useDialog } from "../context/DialogContext";
|
||||
import { useCompany } from "../context/CompanyContext";
|
||||
import { useAdapterCapabilities } from "../adapters/use-adapter-capabilities";
|
||||
import { executionWorkspacesApi } from "../api/execution-workspaces";
|
||||
import { issuesApi } from "../api/issues";
|
||||
import { instanceSettingsApi } from "../api/instanceSettings";
|
||||
|
|
@ -77,6 +78,7 @@ interface IssueDraft {
|
|||
assigneeId?: string;
|
||||
projectId: string;
|
||||
projectWorkspaceId?: string;
|
||||
assigneeModelLane?: IssueModelLane;
|
||||
assigneeModelOverride: string;
|
||||
assigneeThinkingEffort: string;
|
||||
assigneeChrome: boolean;
|
||||
|
|
@ -93,7 +95,12 @@ type StagedIssueFile = {
|
|||
title?: string | null;
|
||||
};
|
||||
|
||||
const ISSUE_OVERRIDE_ADAPTER_TYPES = new Set(["claude_local", "codex_local", "opencode_local"]);
|
||||
import {
|
||||
buildAssigneeAdapterOverrides,
|
||||
ISSUE_OVERRIDE_ADAPTER_TYPES,
|
||||
type IssueModelLane,
|
||||
} from "../lib/issue-assignee-overrides";
|
||||
|
||||
const STAGED_FILE_ACCEPT = "image/*,application/pdf,text/plain,text/markdown,application/json,text/csv,text/html,.md,.markdown";
|
||||
|
||||
const ISSUE_THINKING_EFFORT_OPTIONS = {
|
||||
|
|
@ -122,41 +129,6 @@ const ISSUE_THINKING_EFFORT_OPTIONS = {
|
|||
],
|
||||
} as const;
|
||||
|
||||
function buildAssigneeAdapterOverrides(input: {
|
||||
adapterType: string | null | undefined;
|
||||
modelOverride: string;
|
||||
thinkingEffortOverride: string;
|
||||
chrome: boolean;
|
||||
}): Record<string, unknown> | null {
|
||||
const adapterType = input.adapterType ?? null;
|
||||
if (!adapterType || !ISSUE_OVERRIDE_ADAPTER_TYPES.has(adapterType)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const adapterConfig: Record<string, unknown> = {};
|
||||
if (input.modelOverride) adapterConfig.model = input.modelOverride;
|
||||
if (input.thinkingEffortOverride) {
|
||||
if (adapterType === "codex_local") {
|
||||
adapterConfig.modelReasoningEffort = input.thinkingEffortOverride;
|
||||
} else if (adapterType === "opencode_local") {
|
||||
adapterConfig.variant = input.thinkingEffortOverride;
|
||||
} else if (adapterType === "claude_local") {
|
||||
adapterConfig.effort = input.thinkingEffortOverride;
|
||||
} else if (adapterType === "opencode_local") {
|
||||
adapterConfig.variant = input.thinkingEffortOverride;
|
||||
}
|
||||
}
|
||||
if (adapterType === "claude_local" && input.chrome) {
|
||||
adapterConfig.chrome = true;
|
||||
}
|
||||
|
||||
const overrides: Record<string, unknown> = {};
|
||||
if (Object.keys(adapterConfig).length > 0) {
|
||||
overrides.adapterConfig = adapterConfig;
|
||||
}
|
||||
return Object.keys(overrides).length > 0 ? overrides : null;
|
||||
}
|
||||
|
||||
function loadDraft(): IssueDraft | null {
|
||||
try {
|
||||
const raw = localStorage.getItem(DRAFT_KEY);
|
||||
|
|
@ -406,6 +378,7 @@ export function NewIssueDialog() {
|
|||
const [projectId, setProjectId] = useState("");
|
||||
const [projectWorkspaceId, setProjectWorkspaceId] = useState("");
|
||||
const [assigneeOptionsOpen, setAssigneeOptionsOpen] = useState(false);
|
||||
const [assigneeModelLane, setAssigneeModelLane] = useState<IssueModelLane>("primary");
|
||||
const [assigneeModelOverride, setAssigneeModelOverride] = useState("");
|
||||
const [assigneeThinkingEffort, setAssigneeThinkingEffort] = useState("");
|
||||
const [assigneeChrome, setAssigneeChrome] = useState(false);
|
||||
|
|
@ -496,6 +469,25 @@ export function NewIssueDialog() {
|
|||
const supportsAssigneeOverrides = Boolean(
|
||||
assigneeAdapterType && ISSUE_OVERRIDE_ADAPTER_TYPES.has(assigneeAdapterType),
|
||||
);
|
||||
const getAdapterCapabilities = useAdapterCapabilities();
|
||||
const assigneeAdapterCapabilities = assigneeAdapterType
|
||||
? getAdapterCapabilities(assigneeAdapterType)
|
||||
: null;
|
||||
const assigneeSupportsCheapLane = Boolean(
|
||||
supportsAssigneeOverrides && assigneeAdapterCapabilities?.supportsModelProfiles,
|
||||
);
|
||||
|
||||
const { data: assigneeCheapProfiles } = useQuery({
|
||||
queryKey: effectiveCompanyId && assigneeAdapterType
|
||||
? queryKeys.agents.adapterModelProfiles(effectiveCompanyId, assigneeAdapterType)
|
||||
: ["agents", "none", "adapter-model-profiles", assigneeAdapterType ?? "none"],
|
||||
queryFn: () => agentsApi.adapterModelProfiles(effectiveCompanyId!, assigneeAdapterType!),
|
||||
enabled: Boolean(effectiveCompanyId) && newIssueOpen && assigneeSupportsCheapLane,
|
||||
});
|
||||
const assigneeCheapProfile = useMemo(
|
||||
() => (assigneeCheapProfiles ?? []).find((profile) => profile.key === "cheap") ?? null,
|
||||
[assigneeCheapProfiles],
|
||||
);
|
||||
const mentionOptions = useMemo<MentionOption[]>(() => {
|
||||
return buildMarkdownMentionOptions({
|
||||
agents,
|
||||
|
|
@ -612,6 +604,7 @@ export function NewIssueDialog() {
|
|||
approverValue,
|
||||
projectId,
|
||||
projectWorkspaceId,
|
||||
assigneeModelLane,
|
||||
assigneeModelOverride,
|
||||
assigneeThinkingEffort,
|
||||
assigneeChrome,
|
||||
|
|
@ -663,6 +656,7 @@ export function NewIssueDialog() {
|
|||
approverValue,
|
||||
projectId,
|
||||
projectWorkspaceId,
|
||||
assigneeModelLane,
|
||||
assigneeModelOverride,
|
||||
assigneeThinkingEffort,
|
||||
assigneeChrome,
|
||||
|
|
@ -700,6 +694,7 @@ export function NewIssueDialog() {
|
|||
setProjectId(defaultProjectId);
|
||||
setProjectWorkspaceId(defaultProjectWorkspaceId);
|
||||
setAssigneeValue(assigneeValueFromSelection(newIssueDefaults));
|
||||
setAssigneeModelLane("primary");
|
||||
setAssigneeModelOverride("");
|
||||
setAssigneeThinkingEffort("");
|
||||
setAssigneeChrome(false);
|
||||
|
|
@ -744,6 +739,7 @@ export function NewIssueDialog() {
|
|||
setShowApproverRow(!!(draft.approverValue));
|
||||
setProjectId(restoredProjectId);
|
||||
setProjectWorkspaceId(draft.projectWorkspaceId ?? defaultProjectWorkspaceIdForProject(restoredProject));
|
||||
setAssigneeModelLane(draft.assigneeModelLane ?? "primary");
|
||||
setAssigneeModelOverride(draft.assigneeModelOverride ?? "");
|
||||
setAssigneeThinkingEffort(draft.assigneeThinkingEffort ?? "");
|
||||
setAssigneeChrome(draft.assigneeChrome ?? false);
|
||||
|
|
@ -780,11 +776,15 @@ export function NewIssueDialog() {
|
|||
useEffect(() => {
|
||||
if (!supportsAssigneeOverrides) {
|
||||
setAssigneeOptionsOpen(false);
|
||||
setAssigneeModelLane("primary");
|
||||
setAssigneeModelOverride("");
|
||||
setAssigneeThinkingEffort("");
|
||||
setAssigneeChrome(false);
|
||||
return;
|
||||
}
|
||||
if (!assigneeSupportsCheapLane && assigneeModelLane === "cheap") {
|
||||
setAssigneeModelLane("primary");
|
||||
}
|
||||
|
||||
const validThinkingValues =
|
||||
assigneeAdapterType === "codex_local"
|
||||
|
|
@ -795,7 +795,13 @@ export function NewIssueDialog() {
|
|||
if (!validThinkingValues.some((option) => option.value === assigneeThinkingEffort)) {
|
||||
setAssigneeThinkingEffort("");
|
||||
}
|
||||
}, [supportsAssigneeOverrides, assigneeAdapterType, assigneeThinkingEffort]);
|
||||
}, [
|
||||
supportsAssigneeOverrides,
|
||||
assigneeAdapterType,
|
||||
assigneeThinkingEffort,
|
||||
assigneeSupportsCheapLane,
|
||||
assigneeModelLane,
|
||||
]);
|
||||
|
||||
// Cleanup timer on unmount
|
||||
useEffect(() => {
|
||||
|
|
@ -816,6 +822,7 @@ export function NewIssueDialog() {
|
|||
setProjectId("");
|
||||
setProjectWorkspaceId("");
|
||||
setAssigneeOptionsOpen(false);
|
||||
setAssigneeModelLane("primary");
|
||||
setAssigneeModelOverride("");
|
||||
setAssigneeThinkingEffort("");
|
||||
setAssigneeChrome(false);
|
||||
|
|
@ -841,6 +848,7 @@ export function NewIssueDialog() {
|
|||
setShowApproverRow(false);
|
||||
setProjectId("");
|
||||
setProjectWorkspaceId("");
|
||||
setAssigneeModelLane("primary");
|
||||
setAssigneeModelOverride("");
|
||||
setAssigneeThinkingEffort("");
|
||||
setAssigneeChrome(false);
|
||||
|
|
@ -858,8 +866,14 @@ export function NewIssueDialog() {
|
|||
const currentTitle = titleRef.current.trim();
|
||||
const currentDescription = descriptionRef.current.trim();
|
||||
if (!effectiveCompanyId || !currentTitle || createIssue.isPending) return;
|
||||
const effectiveLane = assigneeSupportsCheapLane
|
||||
? assigneeModelLane
|
||||
: assigneeModelLane === "cheap"
|
||||
? "primary"
|
||||
: assigneeModelLane;
|
||||
const assigneeAdapterOverrides = buildAssigneeAdapterOverrides({
|
||||
adapterType: assigneeAdapterType,
|
||||
lane: effectiveLane,
|
||||
modelOverride: assigneeModelOverride,
|
||||
thinkingEffortOverride: assigneeThinkingEffort,
|
||||
chrome: assigneeChrome,
|
||||
|
|
@ -1557,36 +1571,84 @@ export function NewIssueDialog() {
|
|||
{assigneeOptionsOpen && (
|
||||
<div className="mt-2 rounded-md border border-border p-3 bg-muted/20 space-y-3">
|
||||
<div className="space-y-1.5">
|
||||
<div className="text-xs text-muted-foreground">Model</div>
|
||||
<InlineEntitySelector
|
||||
value={assigneeModelOverride}
|
||||
options={modelOverrideOptions}
|
||||
placeholder="Default model"
|
||||
disablePortal
|
||||
noneLabel="Default model"
|
||||
searchPlaceholder="Search models..."
|
||||
emptyMessage="No models found."
|
||||
onChange={setAssigneeModelOverride}
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-1.5">
|
||||
<div className="text-xs text-muted-foreground">Thinking effort</div>
|
||||
<div className="flex items-center gap-1.5 flex-wrap">
|
||||
{thinkingEffortOptions.map((option) => (
|
||||
<div className="text-xs text-muted-foreground">Model lane</div>
|
||||
<div
|
||||
className="flex w-full overflow-hidden rounded-md border border-border"
|
||||
role="radiogroup"
|
||||
aria-label="Model lane"
|
||||
>
|
||||
{(["primary", ...(assigneeSupportsCheapLane ? (["cheap"] as const) : ([] as const)), "custom"] as const).map((lane) => (
|
||||
<button
|
||||
key={option.value || "default"}
|
||||
key={lane}
|
||||
type="button"
|
||||
role="radio"
|
||||
aria-checked={assigneeModelLane === lane}
|
||||
className={cn(
|
||||
"px-2 py-1 rounded-md text-xs border border-border hover:bg-accent/50 transition-colors",
|
||||
assigneeThinkingEffort === option.value && "bg-accent"
|
||||
"flex-1 px-2 py-1 text-xs capitalize transition-colors hover:bg-accent/40",
|
||||
assigneeModelLane === lane && "bg-accent text-foreground",
|
||||
)}
|
||||
onClick={() => setAssigneeThinkingEffort(option.value)}
|
||||
onClick={() => setAssigneeModelLane(lane)}
|
||||
>
|
||||
{option.label}
|
||||
{lane === "primary"
|
||||
? "Primary"
|
||||
: lane === "cheap"
|
||||
? "Cheap"
|
||||
: "Custom"}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
{assigneeModelLane === "cheap" && (
|
||||
<p className="text-[11px] text-muted-foreground">
|
||||
Sends <code>modelProfile: "cheap"</code>{" "}
|
||||
{assigneeCheapProfile?.adapterConfig && typeof (assigneeCheapProfile.adapterConfig as Record<string, unknown>).model === "string"
|
||||
? <>· adapter default <code>{String((assigneeCheapProfile.adapterConfig as Record<string, unknown>).model)}</code></>
|
||||
: assigneeCheapProfile
|
||||
? <>· uses the agent's configured cheap profile</>
|
||||
: <>· falls back to the primary model if no cheap profile is configured</>}
|
||||
</p>
|
||||
)}
|
||||
{assigneeModelLane === "primary" && (
|
||||
<p className="text-[11px] text-muted-foreground">Runs on the agent's primary model.</p>
|
||||
)}
|
||||
{assigneeModelLane === "custom" && (
|
||||
<p className="text-[11px] text-muted-foreground">Override the model and effort for this issue only.</p>
|
||||
)}
|
||||
</div>
|
||||
{assigneeAdapterType === "claude_local" && (
|
||||
{assigneeModelLane === "custom" && (
|
||||
<div className="space-y-1.5">
|
||||
<div className="text-xs text-muted-foreground">Model</div>
|
||||
<InlineEntitySelector
|
||||
value={assigneeModelOverride}
|
||||
options={modelOverrideOptions}
|
||||
placeholder="Default model"
|
||||
disablePortal
|
||||
noneLabel="Default model"
|
||||
searchPlaceholder="Search models..."
|
||||
emptyMessage="No models found."
|
||||
onChange={setAssigneeModelOverride}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
{assigneeModelLane === "custom" && (
|
||||
<div className="space-y-1.5">
|
||||
<div className="text-xs text-muted-foreground">Thinking effort</div>
|
||||
<div className="flex items-center gap-1.5 flex-wrap">
|
||||
{thinkingEffortOptions.map((option) => (
|
||||
<button
|
||||
key={option.value || "default"}
|
||||
className={cn(
|
||||
"px-2 py-1 rounded-md text-xs border border-border hover:bg-accent/50 transition-colors",
|
||||
assigneeThinkingEffort === option.value && "bg-accent"
|
||||
)}
|
||||
onClick={() => setAssigneeThinkingEffort(option.value)}
|
||||
>
|
||||
{option.label}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{assigneeAdapterType === "claude_local" && assigneeModelLane === "custom" && (
|
||||
<div className="flex items-center justify-between rounded-md border border-border px-2 py-1.5">
|
||||
<div className="text-xs text-muted-foreground">Enable Chrome (--chrome)</div>
|
||||
<ToggleSwitch
|
||||
|
|
|
|||
|
|
@ -77,6 +77,92 @@ describe("buildAgentUpdatePatch", () => {
|
|||
});
|
||||
});
|
||||
|
||||
it("writes the cheap profile under runtimeConfig.modelProfiles, never on primary adapterConfig", () => {
|
||||
const patch = buildAgentUpdatePatch(
|
||||
makeAgent(),
|
||||
makeOverlay({
|
||||
modelProfiles: {
|
||||
cheap: {
|
||||
enabled: true,
|
||||
adapterConfig: { model: "claude-haiku-4-5" },
|
||||
},
|
||||
},
|
||||
}),
|
||||
);
|
||||
|
||||
expect(patch).toEqual({
|
||||
runtimeConfig: {
|
||||
heartbeat: {
|
||||
enabled: true,
|
||||
intervalSec: 300,
|
||||
},
|
||||
modelProfiles: {
|
||||
cheap: {
|
||||
enabled: true,
|
||||
adapterConfig: { model: "claude-haiku-4-5" },
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
// The primary adapterConfig is untouched.
|
||||
expect(patch.adapterConfig).toBeUndefined();
|
||||
});
|
||||
|
||||
it("merges cheap profile changes onto existing runtimeConfig.modelProfiles state", () => {
|
||||
const agent = makeAgent();
|
||||
agent.runtimeConfig = {
|
||||
heartbeat: { enabled: true, intervalSec: 300 },
|
||||
modelProfiles: {
|
||||
cheap: {
|
||||
enabled: false,
|
||||
adapterConfig: { model: "old-cheap" },
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const patch = buildAgentUpdatePatch(
|
||||
agent,
|
||||
makeOverlay({
|
||||
modelProfiles: {
|
||||
cheap: {
|
||||
enabled: true,
|
||||
},
|
||||
},
|
||||
}),
|
||||
);
|
||||
|
||||
expect((patch.runtimeConfig as Record<string, unknown>).modelProfiles).toEqual({
|
||||
cheap: {
|
||||
enabled: true,
|
||||
adapterConfig: { model: "old-cheap" },
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
it("clears the cheap profile when the overlay marks it cleared", () => {
|
||||
const agent = makeAgent();
|
||||
agent.runtimeConfig = {
|
||||
heartbeat: { enabled: true, intervalSec: 300 },
|
||||
modelProfiles: {
|
||||
cheap: {
|
||||
enabled: true,
|
||||
adapterConfig: { model: "claude-haiku-4-5" },
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const patch = buildAgentUpdatePatch(
|
||||
agent,
|
||||
makeOverlay({
|
||||
modelProfiles: { cheap: { cleared: true } },
|
||||
}),
|
||||
);
|
||||
|
||||
expect(patch.runtimeConfig).toEqual({
|
||||
heartbeat: { enabled: true, intervalSec: 300 },
|
||||
});
|
||||
});
|
||||
|
||||
it("preserves adapter-agnostic keys when changing adapter types", () => {
|
||||
const patch = buildAgentUpdatePatch(
|
||||
makeAgent(),
|
||||
|
|
|
|||
|
|
@ -1,11 +1,22 @@
|
|||
import type { Agent } from "@paperclipai/shared";
|
||||
|
||||
export interface AgentModelProfileOverlay {
|
||||
enabled?: boolean;
|
||||
adapterConfig?: Record<string, unknown>;
|
||||
/**
|
||||
* Mark the cheap profile for clearing. When true, the patch removes
|
||||
* `runtimeConfig.modelProfiles.cheap` instead of merging into it.
|
||||
*/
|
||||
cleared?: boolean;
|
||||
}
|
||||
|
||||
export interface AgentConfigOverlay {
|
||||
identity: Record<string, unknown>;
|
||||
adapterType?: string;
|
||||
adapterConfig: Record<string, unknown>;
|
||||
heartbeat: Record<string, unknown>;
|
||||
runtime: Record<string, unknown>;
|
||||
modelProfiles?: { cheap?: AgentModelProfileOverlay };
|
||||
}
|
||||
|
||||
const ADAPTER_AGNOSTIC_KEYS = [
|
||||
|
|
@ -56,10 +67,47 @@ export function buildAgentUpdatePatch(agent: Agent, overlay: AgentConfigOverlay)
|
|||
patch.replaceAdapterConfig = true;
|
||||
}
|
||||
|
||||
if (Object.keys(overlay.heartbeat).length > 0) {
|
||||
const cheapOverlay = overlay.modelProfiles?.cheap;
|
||||
const hasModelProfileChange = cheapOverlay !== undefined;
|
||||
|
||||
if (Object.keys(overlay.heartbeat).length > 0 || hasModelProfileChange) {
|
||||
const existingRc = (agent.runtimeConfig ?? {}) as Record<string, unknown>;
|
||||
const existingHb = (existingRc.heartbeat ?? {}) as Record<string, unknown>;
|
||||
patch.runtimeConfig = { ...existingRc, heartbeat: { ...existingHb, ...overlay.heartbeat } };
|
||||
const nextRuntimeConfig: Record<string, unknown> = (patch.runtimeConfig as Record<string, unknown> | undefined)
|
||||
?? { ...existingRc };
|
||||
|
||||
if (Object.keys(overlay.heartbeat).length > 0) {
|
||||
const existingHb = (existingRc.heartbeat ?? {}) as Record<string, unknown>;
|
||||
nextRuntimeConfig.heartbeat = { ...existingHb, ...overlay.heartbeat };
|
||||
}
|
||||
|
||||
if (hasModelProfileChange) {
|
||||
const existingProfiles = ((existingRc.modelProfiles ?? {}) as Record<string, unknown>);
|
||||
const existingCheap = ((existingProfiles.cheap ?? {}) as Record<string, unknown>);
|
||||
const nextProfiles = { ...existingProfiles };
|
||||
|
||||
if (cheapOverlay?.cleared) {
|
||||
delete nextProfiles.cheap;
|
||||
} else if (cheapOverlay) {
|
||||
const mergedAdapterConfig = {
|
||||
...((existingCheap.adapterConfig ?? {}) as Record<string, unknown>),
|
||||
...(cheapOverlay.adapterConfig ?? {}),
|
||||
};
|
||||
const enabled = cheapOverlay.enabled ?? (existingCheap.enabled !== false);
|
||||
nextProfiles.cheap = {
|
||||
...existingCheap,
|
||||
enabled,
|
||||
adapterConfig: mergedAdapterConfig,
|
||||
};
|
||||
}
|
||||
|
||||
if (Object.keys(nextProfiles).length === 0) {
|
||||
delete nextRuntimeConfig.modelProfiles;
|
||||
} else {
|
||||
nextRuntimeConfig.modelProfiles = nextProfiles;
|
||||
}
|
||||
}
|
||||
|
||||
patch.runtimeConfig = nextRuntimeConfig;
|
||||
}
|
||||
|
||||
if (Object.keys(overlay.runtime).length > 0) {
|
||||
|
|
|
|||
97
ui/src/lib/issue-assignee-overrides.test.ts
Normal file
97
ui/src/lib/issue-assignee-overrides.test.ts
Normal file
|
|
@ -0,0 +1,97 @@
|
|||
// @vitest-environment node
|
||||
|
||||
import { describe, expect, it } from "vitest";
|
||||
import { buildAssigneeAdapterOverrides } from "./issue-assignee-overrides";
|
||||
|
||||
describe("buildAssigneeAdapterOverrides", () => {
|
||||
it("returns null for adapters that do not accept issue overrides", () => {
|
||||
expect(
|
||||
buildAssigneeAdapterOverrides({
|
||||
adapterType: "process",
|
||||
lane: "custom",
|
||||
modelOverride: "anything",
|
||||
thinkingEffortOverride: "high",
|
||||
chrome: true,
|
||||
}),
|
||||
).toBeNull();
|
||||
});
|
||||
|
||||
it("primary lane sends nothing", () => {
|
||||
expect(
|
||||
buildAssigneeAdapterOverrides({
|
||||
adapterType: "claude_local",
|
||||
lane: "primary",
|
||||
modelOverride: "",
|
||||
thinkingEffortOverride: "",
|
||||
chrome: false,
|
||||
}),
|
||||
).toBeNull();
|
||||
});
|
||||
|
||||
it("cheap lane sends modelProfile=cheap and no adapterConfig", () => {
|
||||
expect(
|
||||
buildAssigneeAdapterOverrides({
|
||||
adapterType: "codex_local",
|
||||
lane: "cheap",
|
||||
modelOverride: "ignored",
|
||||
thinkingEffortOverride: "high",
|
||||
chrome: false,
|
||||
}),
|
||||
).toEqual({ modelProfile: "cheap" });
|
||||
});
|
||||
|
||||
it("custom lane preserves explicit model + thinking effort + chrome overrides", () => {
|
||||
expect(
|
||||
buildAssigneeAdapterOverrides({
|
||||
adapterType: "claude_local",
|
||||
lane: "custom",
|
||||
modelOverride: "claude-haiku-4-5",
|
||||
thinkingEffortOverride: "high",
|
||||
chrome: true,
|
||||
}),
|
||||
).toEqual({
|
||||
adapterConfig: {
|
||||
model: "claude-haiku-4-5",
|
||||
effort: "high",
|
||||
chrome: true,
|
||||
},
|
||||
});
|
||||
});
|
||||
|
||||
it("custom lane returns null when no fields are set", () => {
|
||||
expect(
|
||||
buildAssigneeAdapterOverrides({
|
||||
adapterType: "codex_local",
|
||||
lane: "custom",
|
||||
modelOverride: "",
|
||||
thinkingEffortOverride: "",
|
||||
chrome: false,
|
||||
}),
|
||||
).toBeNull();
|
||||
});
|
||||
|
||||
it("custom lane uses adapter-specific keys for thinking effort", () => {
|
||||
expect(
|
||||
buildAssigneeAdapterOverrides({
|
||||
adapterType: "codex_local",
|
||||
lane: "custom",
|
||||
modelOverride: "",
|
||||
thinkingEffortOverride: "minimal",
|
||||
chrome: false,
|
||||
}),
|
||||
).toEqual({
|
||||
adapterConfig: { modelReasoningEffort: "minimal" },
|
||||
});
|
||||
expect(
|
||||
buildAssigneeAdapterOverrides({
|
||||
adapterType: "opencode_local",
|
||||
lane: "custom",
|
||||
modelOverride: "",
|
||||
thinkingEffortOverride: "max",
|
||||
chrome: false,
|
||||
}),
|
||||
).toEqual({
|
||||
adapterConfig: { variant: "max" },
|
||||
});
|
||||
});
|
||||
});
|
||||
60
ui/src/lib/issue-assignee-overrides.ts
Normal file
60
ui/src/lib/issue-assignee-overrides.ts
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
export const ISSUE_OVERRIDE_ADAPTER_TYPES = new Set([
|
||||
"claude_local",
|
||||
"codex_local",
|
||||
"opencode_local",
|
||||
]);
|
||||
|
||||
export type IssueModelLane = "primary" | "cheap" | "custom";
|
||||
|
||||
export interface BuildAssigneeAdapterOverridesInput {
|
||||
adapterType: string | null | undefined;
|
||||
lane: IssueModelLane;
|
||||
modelOverride: string;
|
||||
thinkingEffortOverride: string;
|
||||
chrome: boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* Build the `assigneeAdapterOverrides` payload sent to the issue create API.
|
||||
*
|
||||
* Lane semantics:
|
||||
* - "primary" → no overrides, runs on the agent's primary model.
|
||||
* - "cheap" → `modelProfile: "cheap"` only; the runtime resolves the actual
|
||||
* adapter config from the agent's runtimeConfig + adapter default.
|
||||
* - "custom" → preserves the legacy explicit override path
|
||||
* (`adapterConfig.model`, thinking effort, chrome).
|
||||
*/
|
||||
export function buildAssigneeAdapterOverrides(
|
||||
input: BuildAssigneeAdapterOverridesInput,
|
||||
): Record<string, unknown> | null {
|
||||
const adapterType = input.adapterType ?? null;
|
||||
if (!adapterType || !ISSUE_OVERRIDE_ADAPTER_TYPES.has(adapterType)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (input.lane === "primary") {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (input.lane === "cheap") {
|
||||
return { modelProfile: "cheap" };
|
||||
}
|
||||
|
||||
const adapterConfig: Record<string, unknown> = {};
|
||||
if (input.modelOverride) adapterConfig.model = input.modelOverride;
|
||||
if (input.thinkingEffortOverride) {
|
||||
if (adapterType === "codex_local") {
|
||||
adapterConfig.modelReasoningEffort = input.thinkingEffortOverride;
|
||||
} else if (adapterType === "opencode_local") {
|
||||
adapterConfig.variant = input.thinkingEffortOverride;
|
||||
} else if (adapterType === "claude_local") {
|
||||
adapterConfig.effort = input.thinkingEffortOverride;
|
||||
}
|
||||
}
|
||||
if (adapterType === "claude_local" && input.chrome) {
|
||||
adapterConfig.chrome = true;
|
||||
}
|
||||
|
||||
if (Object.keys(adapterConfig).length === 0) return null;
|
||||
return { adapterConfig };
|
||||
}
|
||||
|
|
@ -32,6 +32,8 @@ export function buildNewAgentHirePayload(input: {
|
|||
runtimeConfig: buildNewAgentRuntimeConfig({
|
||||
heartbeatEnabled: configValues.heartbeatEnabled,
|
||||
intervalSec: configValues.intervalSec,
|
||||
cheapModel: configValues.cheapModel,
|
||||
cheapModelEnabled: configValues.cheapModelEnabled,
|
||||
}),
|
||||
budgetMonthlyCents: 0,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -31,4 +31,35 @@ describe("buildNewAgentRuntimeConfig", () => {
|
|||
},
|
||||
});
|
||||
});
|
||||
|
||||
it("stores cheap model under modelProfiles.cheap, not primary adapterConfig", () => {
|
||||
const config = buildNewAgentRuntimeConfig({
|
||||
heartbeatEnabled: true,
|
||||
intervalSec: 600,
|
||||
cheapModel: "claude-sonnet-4-6",
|
||||
cheapModelEnabled: true,
|
||||
});
|
||||
|
||||
expect(config.modelProfiles).toEqual({
|
||||
cheap: {
|
||||
enabled: true,
|
||||
adapterConfig: { model: "claude-sonnet-4-6" },
|
||||
},
|
||||
});
|
||||
// primary heartbeat config still present
|
||||
expect(config.heartbeat).toMatchObject({ enabled: true, intervalSec: 600 });
|
||||
});
|
||||
|
||||
it("omits modelProfiles when no cheap model is configured", () => {
|
||||
const config = buildNewAgentRuntimeConfig({ heartbeatEnabled: false });
|
||||
expect(config.modelProfiles).toBeUndefined();
|
||||
});
|
||||
|
||||
it("omits modelProfiles when cheap model is set but explicitly disabled", () => {
|
||||
const config = buildNewAgentRuntimeConfig({
|
||||
cheapModel: "claude-sonnet-4-6",
|
||||
cheapModelEnabled: false,
|
||||
});
|
||||
expect(config.modelProfiles).toBeUndefined();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -4,8 +4,10 @@ import { defaultCreateValues } from "../components/agent-config-defaults";
|
|||
export function buildNewAgentRuntimeConfig(input?: {
|
||||
heartbeatEnabled?: boolean;
|
||||
intervalSec?: number;
|
||||
}) {
|
||||
return {
|
||||
cheapModel?: string;
|
||||
cheapModelEnabled?: boolean;
|
||||
}): Record<string, unknown> {
|
||||
const config: Record<string, unknown> = {
|
||||
heartbeat: {
|
||||
enabled: input?.heartbeatEnabled ?? defaultCreateValues.heartbeatEnabled,
|
||||
intervalSec: input?.intervalSec ?? defaultCreateValues.intervalSec,
|
||||
|
|
@ -14,4 +16,17 @@ export function buildNewAgentRuntimeConfig(input?: {
|
|||
maxConcurrentRuns: AGENT_DEFAULT_MAX_CONCURRENT_RUNS,
|
||||
},
|
||||
};
|
||||
|
||||
const cheapModel = input?.cheapModel?.trim() ?? "";
|
||||
const cheapEnabled = input?.cheapModelEnabled ?? false;
|
||||
if (cheapModel && cheapEnabled) {
|
||||
config.modelProfiles = {
|
||||
cheap: {
|
||||
enabled: true,
|
||||
adapterConfig: { model: cheapModel },
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
return config;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -25,6 +25,8 @@ export const queryKeys = {
|
|||
configRevisions: (agentId: string) => ["agents", "config-revisions", agentId] as const,
|
||||
adapterModels: (companyId: string, adapterType: string) =>
|
||||
["agents", companyId, "adapter-models", adapterType] as const,
|
||||
adapterModelProfiles: (companyId: string, adapterType: string) =>
|
||||
["agents", companyId, "adapter-model-profiles", adapterType] as const,
|
||||
detectModel: (companyId: string, adapterType: string) =>
|
||||
["agents", companyId, "detect-model", adapterType] as const,
|
||||
},
|
||||
|
|
|
|||
|
|
@ -615,6 +615,7 @@ export function AdapterManager() {
|
|||
supportsSkills: false,
|
||||
supportsLocalAgentJwt: false,
|
||||
requiresMaterializedRuntimeSkills: false,
|
||||
supportsModelProfiles: false,
|
||||
},
|
||||
}}
|
||||
canRemove={false}
|
||||
|
|
|
|||
|
|
@ -87,6 +87,63 @@ function installStorybookApiFixtures() {
|
|||
});
|
||||
}
|
||||
|
||||
if (url.pathname === "/api/adapters") {
|
||||
return Response.json([
|
||||
{
|
||||
type: "claude_local",
|
||||
label: "Claude Local",
|
||||
source: "builtin",
|
||||
modelsCount: 2,
|
||||
loaded: true,
|
||||
disabled: false,
|
||||
capabilities: {
|
||||
supportsInstructionsBundle: true,
|
||||
supportsSkills: true,
|
||||
supportsLocalAgentJwt: true,
|
||||
requiresMaterializedRuntimeSkills: false,
|
||||
supportsModelProfiles: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "codex_local",
|
||||
label: "Codex Local",
|
||||
source: "builtin",
|
||||
modelsCount: 3,
|
||||
loaded: true,
|
||||
disabled: false,
|
||||
capabilities: {
|
||||
supportsInstructionsBundle: true,
|
||||
supportsSkills: true,
|
||||
supportsLocalAgentJwt: true,
|
||||
requiresMaterializedRuntimeSkills: false,
|
||||
supportsModelProfiles: true,
|
||||
},
|
||||
},
|
||||
]);
|
||||
}
|
||||
|
||||
const adapterModelsMatch = url.pathname.match(
|
||||
/^\/api\/companies\/[^/]+\/adapters\/([^/]+)\/(models|model-profiles)$/,
|
||||
);
|
||||
if (adapterModelsMatch) {
|
||||
const [, , resource] = adapterModelsMatch;
|
||||
if (resource === "models") {
|
||||
return Response.json([
|
||||
{ id: "claude-opus-4-7", label: "Claude Opus 4.7" },
|
||||
{ id: "claude-sonnet-4-6", label: "Claude Sonnet 4.6" },
|
||||
{ id: "claude-haiku-4-5", label: "Claude Haiku 4.5" },
|
||||
]);
|
||||
}
|
||||
return Response.json([
|
||||
{
|
||||
key: "cheap",
|
||||
label: "Cheap",
|
||||
adapterConfig: { model: "claude-sonnet-4-6" },
|
||||
source: "adapter_default",
|
||||
},
|
||||
]);
|
||||
}
|
||||
|
||||
if (url.pathname === "/api/plugins/ui-contributions") {
|
||||
return Response.json([]);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -291,6 +291,7 @@ const adapterFixtures: AdapterInfo[] = [
|
|||
supportsSkills: true,
|
||||
supportsLocalAgentJwt: true,
|
||||
requiresMaterializedRuntimeSkills: true,
|
||||
supportsModelProfiles: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
|
|
@ -305,6 +306,7 @@ const adapterFixtures: AdapterInfo[] = [
|
|||
supportsSkills: true,
|
||||
supportsLocalAgentJwt: true,
|
||||
requiresMaterializedRuntimeSkills: true,
|
||||
supportsModelProfiles: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
|
|
@ -319,6 +321,7 @@ const adapterFixtures: AdapterInfo[] = [
|
|||
supportsSkills: false,
|
||||
supportsLocalAgentJwt: false,
|
||||
requiresMaterializedRuntimeSkills: false,
|
||||
supportsModelProfiles: false,
|
||||
},
|
||||
},
|
||||
];
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@ import { PathInstructionsModal } from "@/components/PathInstructionsModal";
|
|||
import { useCompany } from "@/context/CompanyContext";
|
||||
import { useDialog } from "@/context/DialogContext";
|
||||
import { queryKeys } from "@/lib/queryKeys";
|
||||
import type { Agent } from "@paperclipai/shared";
|
||||
import {
|
||||
storybookAgents,
|
||||
storybookAuthSession,
|
||||
|
|
@ -328,7 +329,7 @@ function DialogBackdropFrame({
|
|||
}
|
||||
|
||||
function hydrateDialogQueries(queryClient: ReturnType<typeof useQueryClient>) {
|
||||
queryClient.setQueryData(queryKeys.companies.all, storybookCompanies);
|
||||
queryClient.setQueryData(queryKeys.companies.all, { companies: storybookCompanies, unauthorized: false });
|
||||
queryClient.setQueryData(queryKeys.auth.session, storybookAuthSession);
|
||||
queryClient.setQueryData(queryKeys.agents.list(COMPANY_ID), storybookAgents);
|
||||
queryClient.setQueryData(queryKeys.projects.list(COMPANY_ID), storybookProjects);
|
||||
|
|
@ -382,6 +383,7 @@ function hydrateDialogQueries(queryClient: ReturnType<typeof useQueryClient>) {
|
|||
supportsSkills: true,
|
||||
supportsLocalAgentJwt: true,
|
||||
requiresMaterializedRuntimeSkills: false,
|
||||
supportsModelProfiles: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
|
|
@ -396,6 +398,7 @@ function hydrateDialogQueries(queryClient: ReturnType<typeof useQueryClient>) {
|
|||
supportsSkills: true,
|
||||
supportsLocalAgentJwt: true,
|
||||
requiresMaterializedRuntimeSkills: false,
|
||||
supportsModelProfiles: true,
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
|
@ -403,8 +406,41 @@ function hydrateDialogQueries(queryClient: ReturnType<typeof useQueryClient>) {
|
|||
{ id: "gpt-5.4", label: "GPT-5.4" },
|
||||
{ id: "gpt-5.4-mini", label: "GPT-5.4 Mini" },
|
||||
]);
|
||||
queryClient.setQueryData(queryKeys.agents.adapterModelProfiles(COMPANY_ID, "codex_local"), [
|
||||
{
|
||||
key: "cheap",
|
||||
label: "Cheap",
|
||||
adapterConfig: { model: "gpt-5.4-mini" },
|
||||
source: "adapter_default",
|
||||
},
|
||||
]);
|
||||
}
|
||||
|
||||
const HERMES_AGENT: Agent = {
|
||||
id: "agent-hermes",
|
||||
companyId: COMPANY_ID,
|
||||
name: "HermesRouter",
|
||||
urlKey: "hermesrouter",
|
||||
role: "engineer",
|
||||
title: "Lightweight Routing",
|
||||
icon: "code",
|
||||
status: "idle",
|
||||
reportsTo: "agent-cto",
|
||||
capabilities: "Hermes-backed assistant on an adapter without the cheap-profile contract.",
|
||||
adapterType: "opencode_local",
|
||||
adapterConfig: {},
|
||||
runtimeConfig: {},
|
||||
budgetMonthlyCents: 60_000,
|
||||
spentMonthlyCents: 9_000,
|
||||
pauseReason: null,
|
||||
pausedAt: null,
|
||||
permissions: { canCreateAgents: false },
|
||||
lastHeartbeatAt: new Date("2026-04-29T08:30:00.000Z"),
|
||||
metadata: null,
|
||||
createdAt: new Date("2026-04-12T08:00:00.000Z"),
|
||||
updatedAt: new Date("2026-04-29T08:30:00.000Z"),
|
||||
};
|
||||
|
||||
function StorybookDialogFixtures({ children }: { children: ReactNode }) {
|
||||
const queryClient = useQueryClient();
|
||||
const [ready] = useState(() => {
|
||||
|
|
@ -655,6 +691,128 @@ function ImageGalleryModalStory() {
|
|||
);
|
||||
}
|
||||
|
||||
type CheapLaneVariant = "primary" | "cheap" | "custom" | "unsupported";
|
||||
|
||||
function clickModelLaneButton(label: "Primary" | "Cheap" | "Custom") {
|
||||
const radiogroup = document.querySelector<HTMLElement>("[aria-label='Model lane']");
|
||||
if (!radiogroup) return false;
|
||||
const buttons = Array.from(radiogroup.querySelectorAll<HTMLButtonElement>("button[role='radio']"));
|
||||
const button = buttons.find((candidate) => candidate.textContent?.trim() === label);
|
||||
if (!button) return false;
|
||||
button.click();
|
||||
return true;
|
||||
}
|
||||
|
||||
function findAssigneeOptionsButton() {
|
||||
const buttons = Array.from(document.querySelectorAll<HTMLButtonElement>("button"));
|
||||
return (
|
||||
buttons.find((candidate) => /(Codex|Claude|OpenCode|Agent) options$/.test(candidate.textContent?.trim() ?? "")) ?? null
|
||||
);
|
||||
}
|
||||
|
||||
function useCheapLaneAdapterOverrides(variant: CheapLaneVariant) {
|
||||
const queryClient = useQueryClient();
|
||||
useLayoutEffect(() => {
|
||||
if (variant !== "unsupported") return;
|
||||
queryClient.setQueryData(
|
||||
queryKeys.agents.list(COMPANY_ID),
|
||||
[...storybookAgents, HERMES_AGENT],
|
||||
);
|
||||
queryClient.setQueryData(queryKeys.adapters.all, [
|
||||
{
|
||||
type: "codex_local",
|
||||
label: "Codex local",
|
||||
source: "builtin",
|
||||
modelsCount: 5,
|
||||
loaded: true,
|
||||
disabled: false,
|
||||
capabilities: {
|
||||
supportsInstructionsBundle: true,
|
||||
supportsSkills: true,
|
||||
supportsLocalAgentJwt: true,
|
||||
requiresMaterializedRuntimeSkills: false,
|
||||
supportsModelProfiles: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "opencode_local",
|
||||
label: "OpenCode local",
|
||||
source: "builtin",
|
||||
modelsCount: 2,
|
||||
loaded: true,
|
||||
disabled: false,
|
||||
capabilities: {
|
||||
supportsInstructionsBundle: true,
|
||||
supportsSkills: true,
|
||||
supportsLocalAgentJwt: true,
|
||||
requiresMaterializedRuntimeSkills: true,
|
||||
supportsModelProfiles: false,
|
||||
},
|
||||
},
|
||||
]);
|
||||
queryClient.setQueryData(queryKeys.agents.adapterModels(COMPANY_ID, "opencode_local"), [
|
||||
{ id: "anthropic/claude-haiku-4-5", label: "Claude Haiku 4.5" },
|
||||
{ id: "openai/gpt-5.4-mini", label: "GPT-5.4 Mini" },
|
||||
]);
|
||||
}, [queryClient, variant]);
|
||||
}
|
||||
|
||||
function CheapLaneIssueDialogOpener({ variant }: { variant: CheapLaneVariant }) {
|
||||
const { openNewIssue } = useDialog();
|
||||
useCheapLaneAdapterOverrides(variant);
|
||||
|
||||
const assigneeAgentId = variant === "unsupported" ? "agent-hermes" : "agent-codex";
|
||||
const title =
|
||||
variant === "unsupported"
|
||||
? "Route research summary to HermesRouter"
|
||||
: "Generate weekly Storybook coverage report";
|
||||
const description =
|
||||
variant === "unsupported"
|
||||
? "HermesRouter runs on an adapter that does not advertise a cheap profile, so the Cheap lane should disappear instead of being greyed."
|
||||
: "Lower-cost runs should still pick up the agent's cheap profile so the model badge can show the requested lane.";
|
||||
|
||||
useOpenWhenCompanyReady(() => {
|
||||
openNewIssue({
|
||||
title,
|
||||
description,
|
||||
status: "todo",
|
||||
priority: "medium",
|
||||
projectId: "project-board-ui",
|
||||
projectWorkspaceId: "workspace-board-ui",
|
||||
assigneeAgentId,
|
||||
});
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
let cancelled = false;
|
||||
const timers: number[] = [];
|
||||
|
||||
timers.push(
|
||||
window.setTimeout(() => {
|
||||
if (cancelled) return;
|
||||
const optionsButton = findAssigneeOptionsButton();
|
||||
optionsButton?.click();
|
||||
}, 300),
|
||||
);
|
||||
|
||||
if (variant === "cheap" || variant === "custom") {
|
||||
timers.push(
|
||||
window.setTimeout(() => {
|
||||
if (cancelled) return;
|
||||
clickModelLaneButton(variant === "cheap" ? "Cheap" : "Custom");
|
||||
}, 600),
|
||||
);
|
||||
}
|
||||
|
||||
return () => {
|
||||
cancelled = true;
|
||||
for (const timer of timers) window.clearTimeout(timer);
|
||||
};
|
||||
}, [variant]);
|
||||
|
||||
return <NewIssueDialog />;
|
||||
}
|
||||
|
||||
function PathInstructionsModalStory() {
|
||||
return (
|
||||
<DialogStory
|
||||
|
|
@ -726,6 +884,62 @@ export const NewIssueValidationError: Story = {
|
|||
),
|
||||
};
|
||||
|
||||
export const NewIssueCheapLanePrimary: Story = {
|
||||
name: "New Issue - Cheap lane (Primary)",
|
||||
render: () => (
|
||||
<DialogStory
|
||||
eyebrow="NewIssueDialog"
|
||||
title="Model lane segmented control - Primary selected"
|
||||
description="Codex assignee with the assignee-options drawer expanded so the Primary | Cheap | Custom segmented control is visible. Default helper copy is shown."
|
||||
badges={["model lane", "primary", "default"]}
|
||||
>
|
||||
<CheapLaneIssueDialogOpener variant="primary" />
|
||||
</DialogStory>
|
||||
),
|
||||
};
|
||||
|
||||
export const NewIssueCheapLaneCheap: Story = {
|
||||
name: "New Issue - Cheap lane (Cheap)",
|
||||
render: () => (
|
||||
<DialogStory
|
||||
eyebrow="NewIssueDialog"
|
||||
title="Model lane segmented control - Cheap selected"
|
||||
description='Codex assignee with the Cheap lane selected so the helper line "Sends modelProfile: \"cheap\" · adapter default …" is visible.'
|
||||
badges={["model lane", "cheap", "modelProfile"]}
|
||||
>
|
||||
<CheapLaneIssueDialogOpener variant="cheap" />
|
||||
</DialogStory>
|
||||
),
|
||||
};
|
||||
|
||||
export const NewIssueCheapLaneCustom: Story = {
|
||||
name: "New Issue - Cheap lane (Custom)",
|
||||
render: () => (
|
||||
<DialogStory
|
||||
eyebrow="NewIssueDialog"
|
||||
title="Model lane segmented control - Custom selected"
|
||||
description="Custom selected so the explicit model picker and thinking-effort sub-fields render the way they did before the cheap lane was added."
|
||||
badges={["model lane", "custom", "regression"]}
|
||||
>
|
||||
<CheapLaneIssueDialogOpener variant="custom" />
|
||||
</DialogStory>
|
||||
),
|
||||
};
|
||||
|
||||
export const NewIssueCheapLaneUnsupported: Story = {
|
||||
name: "New Issue - Cheap lane (Unsupported adapter)",
|
||||
render: () => (
|
||||
<DialogStory
|
||||
eyebrow="NewIssueDialog"
|
||||
title="Model lane on an adapter without supportsModelProfiles"
|
||||
description="HermesRouter runs on opencode_local with supportsModelProfiles disabled, so the Cheap option should be hidden — the segmented control collapses to Primary | Custom rather than showing a greyed Cheap entry."
|
||||
badges={["model lane", "unsupported", "cheap hidden"]}
|
||||
>
|
||||
<CheapLaneIssueDialogOpener variant="unsupported" />
|
||||
</DialogStory>
|
||||
),
|
||||
};
|
||||
|
||||
export const NewAgentRecommendation: Story = {
|
||||
name: "New Agent - Recommendation",
|
||||
render: () => (
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { useEffect, useMemo, useRef, useState } from "react";
|
||||
import type { Meta, StoryObj } from "@storybook/react-vite";
|
||||
import type { Issue } from "@paperclipai/shared";
|
||||
import type { RunForIssue } from "@/api/activity";
|
||||
import { useQueryClient } from "@tanstack/react-query";
|
||||
import {
|
||||
ArrowDownAZ,
|
||||
|
|
@ -83,7 +84,7 @@ function Section({
|
|||
}
|
||||
|
||||
function hydrateStorybookQueries(queryClient: ReturnType<typeof useQueryClient>) {
|
||||
queryClient.setQueryData(queryKeys.companies.all, storybookCompanies);
|
||||
queryClient.setQueryData(queryKeys.companies.all, { companies: storybookCompanies, unauthorized: false });
|
||||
queryClient.setQueryData(queryKeys.auth.session, storybookAuthSession);
|
||||
queryClient.setQueryData(queryKeys.agents.list(companyId), storybookAgents);
|
||||
queryClient.setQueryData(queryKeys.projects.list(companyId), storybookProjects);
|
||||
|
|
@ -334,6 +335,116 @@ function OpenFiltersPopover() {
|
|||
);
|
||||
}
|
||||
|
||||
const modelProfileLedgerRuns: RunForIssue[] = [
|
||||
{
|
||||
runId: "run-cheap-applied",
|
||||
status: "succeeded",
|
||||
agentId: "agent-codex",
|
||||
adapterType: "codex_local",
|
||||
startedAt: "2026-04-29T09:30:00.000Z",
|
||||
finishedAt: "2026-04-29T09:32:14.000Z",
|
||||
createdAt: "2026-04-29T09:29:55.000Z",
|
||||
invocationSource: "manual",
|
||||
usageJson: { costCents: 17, inputTokens: 6400, outputTokens: 480 },
|
||||
resultJson: {
|
||||
stopReason: "completed",
|
||||
modelProfile: {
|
||||
requested: "cheap",
|
||||
applied: "cheap",
|
||||
configSource: "agent_runtime_config",
|
||||
},
|
||||
},
|
||||
livenessState: "advanced",
|
||||
livenessReason: "Cheap-lane summary completed inside the planned scope.",
|
||||
continuationAttempt: 0,
|
||||
lastUsefulActionAt: "2026-04-29T09:32:10.000Z",
|
||||
nextAction: "Hand the routine output back to the operator inbox.",
|
||||
},
|
||||
{
|
||||
runId: "run-cheap-fallback",
|
||||
status: "succeeded",
|
||||
agentId: "agent-codex",
|
||||
adapterType: "codex_local",
|
||||
startedAt: "2026-04-29T08:10:00.000Z",
|
||||
finishedAt: "2026-04-29T08:14:42.000Z",
|
||||
createdAt: "2026-04-29T08:09:50.000Z",
|
||||
invocationSource: "manual",
|
||||
usageJson: { costCents: 91, inputTokens: 21800, outputTokens: 3200 },
|
||||
resultJson: {
|
||||
stopReason: "completed",
|
||||
modelProfile: {
|
||||
requested: "cheap",
|
||||
applied: "primary",
|
||||
configSource: "adapter_default",
|
||||
fallbackReason: "Cheap profile not configured for this agent",
|
||||
},
|
||||
},
|
||||
livenessState: "advanced",
|
||||
livenessReason: "Routine fell back to the primary model after the cheap lookup missed.",
|
||||
continuationAttempt: 0,
|
||||
lastUsefulActionAt: "2026-04-29T08:14:36.000Z",
|
||||
nextAction: "Configure agent-codex with a cheap profile to avoid the fallback.",
|
||||
},
|
||||
{
|
||||
runId: "run-baseline",
|
||||
status: "succeeded",
|
||||
agentId: "agent-codex",
|
||||
adapterType: "codex_local",
|
||||
startedAt: "2026-04-28T18:05:00.000Z",
|
||||
finishedAt: "2026-04-28T18:14:11.000Z",
|
||||
createdAt: "2026-04-28T18:04:50.000Z",
|
||||
invocationSource: "scheduler",
|
||||
usageJson: { costCents: 142, inputTokens: 38400, outputTokens: 7200 },
|
||||
resultJson: { stopReason: "completed" },
|
||||
livenessState: "advanced",
|
||||
livenessReason: "Standard primary-lane run with no profile metadata recorded.",
|
||||
continuationAttempt: 0,
|
||||
lastUsefulActionAt: "2026-04-28T18:13:58.000Z",
|
||||
nextAction: "Continue with the next planned subtask.",
|
||||
},
|
||||
];
|
||||
|
||||
function ModelProfileBadgeLedger() {
|
||||
return (
|
||||
<div className="grid gap-5 xl:grid-cols-[minmax(0,1fr)_360px]">
|
||||
<IssueRunLedgerContent
|
||||
runs={modelProfileLedgerRuns}
|
||||
activeRun={null}
|
||||
liveRuns={[]}
|
||||
issueStatus="in_progress"
|
||||
childIssues={[]}
|
||||
agentMap={storybookAgentMap}
|
||||
/>
|
||||
<Card className="shadow-none">
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<GitBranch className="h-4 w-4" />
|
||||
Model profile metadata
|
||||
</CardTitle>
|
||||
<CardDescription>
|
||||
Profile badges read <code>resultJson.modelProfile</code> on each run. Applied matching the request renders
|
||||
emerald; an applied fallback renders amber and surfaces the inline reason.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3 text-xs text-muted-foreground">
|
||||
<div className="rounded-md border border-border bg-background/70 p-3">
|
||||
<div className="font-mono text-emerald-600 dark:text-emerald-400">Profile: cheap</div>
|
||||
<p className="mt-1">requested + applied both equal cheap → emerald badge.</p>
|
||||
</div>
|
||||
<div className="rounded-md border border-border bg-background/70 p-3">
|
||||
<div className="font-mono text-amber-600 dark:text-amber-400">Profile: cheap → primary</div>
|
||||
<p className="mt-1">cheap requested but primary applied → amber badge plus inline fallback reason.</p>
|
||||
</div>
|
||||
<div className="rounded-md border border-border bg-background/70 p-3">
|
||||
<div className="font-mono text-muted-foreground">No profile badge</div>
|
||||
<p className="mt-1">Run with no <code>modelProfile</code> metadata renders without a badge for visual contrast.</p>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function RunLedgerWithCostColumns() {
|
||||
return (
|
||||
<div className="grid gap-5 xl:grid-cols-[minmax(0,1fr)_380px]">
|
||||
|
|
@ -549,6 +660,10 @@ function IssueManagementStories() {
|
|||
<RunLedgerWithCostColumns />
|
||||
</Section>
|
||||
|
||||
<Section eyebrow="IssueRunLedger" title="Model profile badges for cheap, fallback, and baseline runs">
|
||||
<ModelProfileBadgeLedger />
|
||||
</Section>
|
||||
|
||||
<Section eyebrow="IssueWorkspaceCard" title="Workspace info card with branch, path, and runtime status">
|
||||
<WorkspaceCardWithRuntime />
|
||||
</Section>
|
||||
|
|
@ -599,3 +714,40 @@ export default meta;
|
|||
type Story = StoryObj<typeof meta>;
|
||||
|
||||
export const FullSurfaceMatrix: Story = {};
|
||||
|
||||
function ModelProfileLedgerStandalone() {
|
||||
return (
|
||||
<StorybookData>
|
||||
<div className="paperclip-story">
|
||||
<main className="paperclip-story__inner space-y-6">
|
||||
<section className="paperclip-story__frame p-6">
|
||||
<div className="flex flex-wrap items-start justify-between gap-5">
|
||||
<div>
|
||||
<div className="paperclip-story__label">IssueRunLedger</div>
|
||||
<h1 className="mt-2 text-3xl font-semibold tracking-tight">Model profile badges</h1>
|
||||
<p className="mt-3 max-w-3xl text-sm leading-6 text-muted-foreground">
|
||||
Run ledger isolated to the cheap-lane visual states: an emerald applied=cheap badge, an amber
|
||||
cheap-fell-back-to-primary badge with the inline fallback reason, and a baseline run without a
|
||||
modelProfile so the visual diff stays obvious.
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<Badge variant="outline">cheap applied</Badge>
|
||||
<Badge variant="outline">cheap → primary</Badge>
|
||||
<Badge variant="outline">no profile</Badge>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<Section eyebrow="IssueRunLedger" title="Cheap, fallback, and baseline runs">
|
||||
<ModelProfileBadgeLedger />
|
||||
</Section>
|
||||
</main>
|
||||
</div>
|
||||
</StorybookData>
|
||||
);
|
||||
}
|
||||
|
||||
export const RunLedgerModelProfileBadges: Story = {
|
||||
name: "Run ledger - Model profile badges",
|
||||
render: () => <ModelProfileLedgerStandalone />,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@ function Section({
|
|||
|
||||
function hydrateStorybookQueries(queryClient: ReturnType<typeof useQueryClient>) {
|
||||
queryClient.setQueryData(queryKeys.auth.session, storybookAuthSession);
|
||||
queryClient.setQueryData(queryKeys.companies.all, storybookCompanies);
|
||||
queryClient.setQueryData(queryKeys.companies.all, { companies: storybookCompanies, unauthorized: false });
|
||||
queryClient.setQueryData(queryKeys.agents.list(COMPANY_ID), storybookAgents);
|
||||
queryClient.setQueryData(queryKeys.projects.list(COMPANY_ID), storybookProjects);
|
||||
queryClient.setQueryData(queryKeys.projects.detail(boardProject.id), boardProject);
|
||||
|
|
|
|||
|
|
@ -172,7 +172,7 @@ const viewStateKey = "storybook:sub-issues-workflow:list";
|
|||
const scopedKey = `${viewStateKey}:${companyId}`;
|
||||
|
||||
function hydrateQueries(client: ReturnType<typeof useQueryClient>) {
|
||||
client.setQueryData(queryKeys.companies.all, storybookCompanies);
|
||||
client.setQueryData(queryKeys.companies.all, { companies: storybookCompanies, unauthorized: false });
|
||||
client.setQueryData(queryKeys.auth.session, storybookAuthSession);
|
||||
client.setQueryData(queryKeys.agents.list(companyId), storybookAgents);
|
||||
client.setQueryData(queryKeys.projects.list(companyId), storybookProjects);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue