diff --git a/apps/portal/src/pages/SubmitRun.stories.tsx b/apps/portal/src/pages/SubmitRun.stories.tsx new file mode 100644 index 000000000..7199e3013 --- /dev/null +++ b/apps/portal/src/pages/SubmitRun.stories.tsx @@ -0,0 +1,68 @@ +// Copyright (c) Microsoft Corporation. +// Licensed under the MIT License. + +import type { Meta, StoryObj } from "@storybook/react-vite"; +import { useEffect } from "react"; +import { http, HttpResponse } from "msw"; +import { expect, userEvent } from "storybook/test"; +import { useProjectContext } from "@/contexts/ProjectContext"; +import { SubmitRun } from "./SubmitRun"; + +function InDemoProject({ children }: { children: React.ReactNode }) { + const { selectedProjectId, setSelectedProjectId } = useProjectContext(); + useEffect(() => setSelectedProjectId("demo-project"), [setSelectedProjectId]); + return selectedProjectId === "demo-project" ? children : null; +} + +const profileVersion = { + _id: "profile-version-1", + profileId: "profile-1", + version: 1, + workerType: "coder-acp-copilot", + model: "gpt-5.6-sol", + createdAt: "2026-01-01T00:00:00.000Z", +}; + +const meta = { + title: "pages/SubmitRun", + component: SubmitRun, + decorators: [ + (Story) => , + ], + parameters: { + msw: { + handlers: [ + http.get("/api/v1/agents", () => HttpResponse.json([{ + _id: "coder-acp-copilot", + name: "GitHub Copilot CLI", + supportedModels: ["gpt-5.6-sol"], + available: true, + versions: [{ agentVersion: "1.0.0", status: "active", queueName: "queue-copilot" }], + createdAt: "2026-01-01T00:00:00.000Z", + }])), + http.get("/api/v1/profiles", () => HttpResponse.json([{ + _id: "profile-1", + name: "Base profile", + latestVersion: 1, + createdAt: "2026-01-01T00:00:00.000Z", + version: profileVersion, + }])), + http.get("/api/v1/profiles/profile-1/versions", () => HttpResponse.json([profileVersion])), + ], + }, + }, +} satisfies Meta; + +export default meta; +type Story = StoryObj; + +/** Profile composition uses the selected base and variation rows without a graph. */ +export const ProfileVariations: Story = { + play: async ({ canvas }) => { + const picker = await canvas.findByPlaceholderText("Search existing profiles…"); + await userEvent.click(picker); + await userEvent.click(await canvas.findByRole("listitem", { name: /Base profile/ })); + await expect(canvas.getByText("Variations")).toBeVisible(); + await expect(canvas.queryByLabelText("Profile composition graph")).not.toBeInTheDocument(); + }, +}; diff --git a/apps/portal/src/pages/SubmitRun.tsx b/apps/portal/src/pages/SubmitRun.tsx index 54beb26ed..dea25b568 100644 --- a/apps/portal/src/pages/SubmitRun.tsx +++ b/apps/portal/src/pages/SubmitRun.tsx @@ -72,8 +72,6 @@ type VariationDraft = { color?: string; }; -type GraphSelection = { kind: "base" } | { kind: "variation"; index: number }; - type GateDraft = { enabled: boolean; promptText: string; @@ -250,7 +248,6 @@ export function SubmitRun() { const [resourcesOpen, setResourcesOpen] = useState(false); const [agentsMdOpen, setAgentsMdOpen] = useState(false); const [extensionsOpen, setExtensionsOpen] = useState(false); - const [graphSelection, setGraphSelection] = useState({ kind: "base" }); // AI generation const [showGenerate, setShowGenerate] = useState(false); @@ -750,53 +747,6 @@ export function SubmitRun() { ? profileList.find((p) => p._id === lastVariationDraft.profileId)?.name : null; - useEffect(() => { - setGraphSelection({ kind: "base" }); - }, [selectedProfileId]); - - useEffect(() => { - setGraphSelection((previous) => { - if (previous.kind === "variation" && previous.index >= variationDrafts.length) { - return { kind: "base" }; - } - return previous; - }); - }, [variationDrafts.length]); - - const selectedGraphPreview = (() => { - if (!selectedProfileId) return null; - - if (graphSelection.kind === "base") { - const versionDocument = - profileVersions.find((version) => version.version === selectedProfileVersion) ?? - selectedBaseProfile?.version ?? - null; - return { - title: "Base Profile", - name: selectedBaseProfile?.name ?? selectedProfileId, - version: selectedProfileVersion ?? selectedBaseProfile?.latestVersion ?? null, - color: "hsl(var(--primary))", - versionDocument, - }; - } - - const draft = variationDrafts[graphSelection.index]; - if (!draft) return null; - const profile = profileList.find((item) => item._id === draft.profileId); - const versionDocument = - (variationProfileVersions[draft.profileId] ?? []).find((version) => version.version === draft.profileVersion) ?? - profile?.version ?? - null; - - return { - title: `Variation #${graphSelection.index + 1}`, - name: profile?.name ?? draft.profileId, - version: draft.profileVersion ?? profile?.latestVersion ?? null, - color: draft.color ?? VARIATION_COLORS[graphSelection.index % VARIATION_COLORS.length], - versionDocument, - }; - })(); - useCommandEnter(doSubmit, canSubmit); // ─── Render helpers ───────────────────────────────────────────────────── @@ -1471,88 +1421,6 @@ export function SubmitRun() { {selectedProfileId && (
-
- - {(() => { - const baseName = selectedBaseProfile?.name ?? selectedProfileId ?? "Base profile"; - return ( - setGraphSelection({ kind: "base" })} - style={{ cursor: "pointer" }} - > - - {truncate(baseName, 28)} - - - ); - })()} - setGraphSelection({ kind: "base" })} - /> - {variationDrafts.map((draft, index) => { - const y = 48 + index * 34; - const color = draft.color ?? VARIATION_COLORS[index % VARIATION_COLORS.length]; - const variationName = profileList.find((p) => p._id === draft.profileId)?.name ?? "Variation"; - return ( - setGraphSelection({ kind: "variation", index })} - style={{ cursor: "pointer" }} - > - - - - - - {truncate(variationName, 28)} - - - ); - })} - -
- - {selectedGraphPreview && ( -
-

{selectedGraphPreview.title}

-

- {selectedGraphPreview.name} {selectedGraphPreview.version ? `v${selectedGraphPreview.version}` : ""} -

-

- {selectedGraphPreview.versionDocument - ? (agentNameById.get(selectedGraphPreview.versionDocument.workerType) ?? "Unknown agent") - : "worker: n/a"}{" "} - · {selectedGraphPreview.versionDocument?.model ?? "model: n/a"} -

-

- {(selectedGraphPreview.versionDocument?.mcpServers?.length ?? 0)} MCP · {(selectedGraphPreview.versionDocument?.skillRevisions?.length ?? 0)} skills · {(selectedGraphPreview.versionDocument?.extensions?.length ?? 0)} extensions - · {(selectedGraphPreview.versionDocument?.resources?.length ?? 0)} resources -

-
- )} -
diff --git a/docs/architecture/app-design.md b/docs/architecture/app-design.md index f1a243262..d2b98f0d1 100644 --- a/docs/architecture/app-design.md +++ b/docs/architecture/app-design.md @@ -470,6 +470,9 @@ Profile fan-out mode is also supported for comparative runs: 3. Each expanded request resolves configuration from its variation profile; unpinned specs resolve to `latestVersion` 4. Expanded requests persist `profileId` and `profileVersionId` on each `RequestDocument` for indexing and traceability +The Portal's Submit Run form shows the base profile and editable variation rows +directly. It omits the former composition graph because it repeated those rows. + ## Runs List Query API `GET /api/v1/requests` powers the Portal **Runs** list and `scope run list`. All