feat(frontend): redesign agent-playground tool + workflow-reference selection - #4994
Conversation
…er drawers Move the trigger-drawer building blocks up to drawers/shared so the agent drawers can reuse them (no duplication): - DrawerFooter, MasterDetailRail, useDraftMasterDetail moved out of gatewayTrigger/drawers/shared. - New shared primitives: SectionRail ([rail | content]), RailField, CatalogChooser + CatalogAppCard (the 2-col app grid), AddItemMenu (grouped add popover), GatewayCatalogDrawer. - TriggerSubscriptionDrawer's SourceChooser reduced to CatalogChooser; RunVersionField now renders through SectionRail so every drawer rail looks the same.
Rebuild the "reference a workflow" drawer's detail into a ConfigAccordionSection stack (Exposed as / Schema / Configuration / Reference by), reusing SectionRail and the trigger-drawer section shell. - New SchemaTree: read-only recursive JSON-schema viewer (nesting + descriptions). - Bridge (WorkflowReferenceBridge) gains resolveOutputSchema, resolveConfigPayload and useWorkflowTypes; WorkflowConfigPart/Message + an "evaluator" reference type. - OSS provider: inputs resolve via the molecule's inputPorts (declared schema → prompt template variables), plus local recovery for curly/jinja JSONPath inputs the shared extractor drops; output from response_format; Configuration built from the full prompt (grouped Messages, model, tools, response_format). - Workflow type badges classify via the molecule's workflowType on a hydrated revision (agents get a tag); evaluators are labelled by their template kind.
…menu Redesign the agent-playground "+ Tool" selection (no built-in tools in agent context): - Tool definition form: split into ParameterTree + ParameterNodeEditor over pure, tested schemaPaths helpers. Per-parameter Allowed values (enum) + Default (scalar-only, type-coerced) and a tool-level additionalProperties toggle; JSON stays the lossless escape hatch. - AddItemMenu-based tool picker (Add existing / Create new): AgentToolSelectorPopover, AgentIntegrationDrawer (third-party via CatalogChooser), ReferenceToolFormView, ToolManagementList, sectionGroups. - Wire-up: AgentTemplateControl, ConfigItemDrawer, ToolSelectorPopover, useAgentTools, ItemRow, item descriptors/kinds, TriggerManagementSection.
dosubot
Bot
added
the
size:XXL
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
dosubot
Bot
added
enhancement
📝 WalkthroughSummary by CodeRabbit
WalkthroughThis PR expands workflow-reference tooling, adds a schema-tree/parameter-editor flow for agent tools, and refactors trigger drawers onto shared catalog, rail, menu, and footer primitives. ChangesWorkflow Reference & Tool Editor Feature
Trigger Management and Shared Catalog/Drawer Refactor
Estimated code review effort: 5 (Critical) | ~120 minutes Sequence Diagram(s)sequenceDiagram
participant WorkflowReferenceSelector
participant OSSdrillInUIProvider
participant WorkflowMolecule
WorkflowReferenceSelector->>OSSdrillInUIProvider: useWorkflowReferenceTypes(slugs)
OSSdrillInUIProvider->>WorkflowMolecule: hydrate revision, read workflowType
OSSdrillInUIProvider-->>WorkflowReferenceSelector: typeBySlug, labelBySlug
WorkflowReferenceSelector->>OSSdrillInUIProvider: resolveInputSchema(workflow)
OSSdrillInUIProvider->>WorkflowMolecule: derive ports schema if no declared schema
OSSdrillInUIProvider-->>WorkflowReferenceSelector: merged input schema
sequenceDiagram
participant User
participant GatewayCatalogDrawer
participant IntegrationsView
participant ItemsView
participant CatalogAdapter
User->>GatewayCatalogDrawer: open drawer
GatewayCatalogDrawer->>IntegrationsView: render integrations and connections
User->>IntegrationsView: select integration
IntegrationsView->>ItemsView: show items for integration
ItemsView->>CatalogAdapter: useItems(integration)
User->>ItemsView: pick item
ItemsView->>CatalogAdapter: config.onPickItem(connection, item, integration)
Possibly related PRs
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Warning Tools execution failed with the following error: Failed to run tools: 13 INTERNAL: Received RST_STREAM with code 2 (Internal server error) Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
@coderabbitai review |
✅ Action performedReview finished.
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 13
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
web/packages/agenta-ui/src/drill-in/index.ts (1)
77-89: 🗄️ Data Integrity & Integration | 🟠 Major | ⚡ Quick winRe-export
WorkflowConfigMessagefrom the public barrel.
WorkflowConfigPart.messagesnow exposes a nested message type, but this entrypoint still only exports the wrapper types. That leaves@agenta/ui/drill-in— and the@agenta/entity-uimirror that re-exports it — with an incomplete workflow-config contract.Suggested fix
export type { DrillInUIComponents, DrillInUIProviderProps, GatewayToolsBridge, WorkflowReferenceBridge, WorkflowReferenceUI, WorkflowReferenceType, WorkflowRevisionUI, WorkflowEnvironmentUI, WorkflowReferencePayload, + WorkflowConfigMessage, WorkflowConfigPart, WorkflowConfigPayload, } from "./context"web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/useAgentTools.ts (1)
42-68: 🗄️ Data Integrity & Integration | 🟠 Major | ⚡ Quick winAppend from
configRef.current, not the capturedtoolsarray.This callback is now reached from the async gateway-action flow, but Line 66 still appends with the render-time
toolssnapshot. If the user adds/removes anything while the schema fetch is in flight, this write can clobber those newer edits.Suggested fix
const handleAddTool = useCallback( (tool: ToolObj, meta?: ToolSelectionMeta) => { // `needsConfig` is a transient routing flag — never persist it in the tool metadata. const {needsConfig, ...toolMeta} = meta ?? ({} as ToolSelectionMeta) const hasMeta = Object.keys(toolMeta).length > 0 @@ if (toolMeta.source === "custom" || needsConfig) { openCreate("tool", next as Record<string, unknown>, "form") return } - setTools([...tools, next]) + const latest = configRef.current + const latestTools = Array.isArray(latest.tools) ? (latest.tools as unknown[]) : [] + onChange({...latest, tools: [...latestTools, next]}) }, - [tools, setTools, openCreate], + [configRef, onChange, openCreate], )
🧹 Nitpick comments (6)
web/packages/agenta-entity-ui/src/drawers/shared/GatewayCatalogDrawer.tsx (1)
207-213: 🚀 Performance & Scalability | 🔵 Trivial | ⚡ Quick winDebounce server-backed catalog searches.
These setters drive paginated catalog queries; firing them on every keystroke can over-fetch compared with the debounced
CatalogChooserpath. As per coding guidelines, optimize React performance by “debouncing or throttling heavy handlers.”Also applies to: 404-410
Source: Coding guidelines
web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ItemRow.tsx (1)
94-99: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winTrim this docblock to the repo’s one-line comment style.
This reads like PR context rather than in-code guidance. Please collapse it to a short one-liner or move the extra rationale to the PR description. As per coding guidelines, "Keep in-code comments to one short line maximum unless a genuinely surprising constraint requires a brief exception."
Source: Coding guidelines
web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ToolManagementList.tsx (1)
1-13: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winTrim the new long-form comments to the repo’s one-line style.
These blocks are much more verbose than the repo convention allows. Please shorten them or move the extra rationale into the PR description. As per coding guidelines, "Keep in-code comments to one short line maximum unless a genuinely surprising constraint requires a brief exception."
Also applies to: 56-62, 103-106, 214-215
Source: Coding guidelines
web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/sectionGroups.tsx (2)
1-13: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winTrim these docblocks to the repo’s one-line comment style.
They are much more detailed than the local convention for in-code comments. Please keep only the surprising bit inline and move the rest to the PR description. As per coding guidelines, "Keep in-code comments to one short line maximum unless a genuinely surprising constraint requires a brief exception."
Also applies to: 48-51
Source: Coding guidelines
58-71: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winRequire
addLabelwheneveronAddis provided.This shared component can currently render an icon-only add button with an undefined tooltip and
aria-label. Tightening the prop type here will prevent future unlabeled usages outside the current callers.Also applies to: 103-114
web/packages/agenta-entity-ui/src/drawers/shared/AddItemMenu.tsx (1)
83-86: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winNarrow
triggerto a single element.
Dropdownis rendered aroundtrigger, but this prop is typed asReactNode, which also allows strings, fragments, and arrays. Tightening it to a singleReactElementwill prevent shared-component misuse from turning into a runtime failure later.Proposed fix
-import {memo, useCallback, useState, type ReactNode} from "react" +import {memo, useCallback, useState, type ReactElement, type ReactNode} from "react" ... - trigger?: ReactNode + trigger?: ReactElementAlso applies to: 131-139
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: 9ceab18b-24ad-48a1-a53f-6a1c17584252
📒 Files selected for processing (39)
web/oss/src/components/DrillInView/OSSdrillInUIProvider.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/AgentTemplateControl.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/ConfigItemDrawer.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/ReferenceToolFormView.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/SchemaTree.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/ToolFormView.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/ToolSelectorPopover.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/TriggerManagementSection.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/WorkflowReferenceSelector.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/AgentIntegrationDrawer.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/AgentToolSelectorPopover.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ItemRow.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ParameterNodeEditor.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ParameterTree.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ToolManagementList.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/itemDescriptors.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/itemKinds.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/schemaPaths.tsweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/useAgentTools.tsweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/sectionGroups.tsxweb/packages/agenta-entity-ui/src/DrillInView/index.tsweb/packages/agenta-entity-ui/src/drawers/shared/AddItemMenu.tsxweb/packages/agenta-entity-ui/src/drawers/shared/CatalogAppCard.tsxweb/packages/agenta-entity-ui/src/drawers/shared/CatalogChooser.tsxweb/packages/agenta-entity-ui/src/drawers/shared/DrawerFooter.tsxweb/packages/agenta-entity-ui/src/drawers/shared/GatewayCatalogDrawer.tsxweb/packages/agenta-entity-ui/src/drawers/shared/MasterDetailRail.tsxweb/packages/agenta-entity-ui/src/drawers/shared/RailField.tsxweb/packages/agenta-entity-ui/src/drawers/shared/SectionRail.tsxweb/packages/agenta-entity-ui/src/drawers/shared/useDraftMasterDetail.tsweb/packages/agenta-entity-ui/src/gatewayTrigger/drawers/TriggerCatalogDrawer.tsxweb/packages/agenta-entity-ui/src/gatewayTrigger/drawers/TriggerScheduleDrawer.tsxweb/packages/agenta-entity-ui/src/gatewayTrigger/drawers/TriggerSubscriptionDrawer.tsxweb/packages/agenta-entity-ui/src/gatewayTrigger/drawers/shared/RunVersionField.tsxweb/packages/agenta-entity-ui/tests/unit/schemaPaths.test.tsweb/packages/agenta-ui/src/drill-in/context.tsweb/packages/agenta-ui/src/drill-in/context/DrillInUIContext.tsxweb/packages/agenta-ui/src/drill-in/context/index.tsweb/packages/agenta-ui/src/drill-in/index.ts
- ReferenceToolFormView: group exposed-name/description under a Details section, make the description editable, and make Reference-by a collapsible section with a binding summary - WorkflowReferenceSelector: add an editable Description to the create flow, threaded through WorkflowReferencePayload - RailField: cap content at max-w-prose so section-panel inputs keep a readable width
- Agent workflow references now render a structured Configuration rail: recognize
agent-shaped configs (`instructions: {agents_md}`, flat `tools`/`skills`, `llm`),
not just string instructions, so they no longer collapse to the raw JSON blob.
- Fold recovered `{{$.inputs.*}}` JSONPath keys into a non-empty declared input
schema too (mixed templates no longer publish an incomplete schema).
- Tool param `integer` enum/default rejects fractional values instead of silently
truncating; `buildObjectSchema` preserves a declared `additionalProperties`
(boolean OR schema object) instead of normalizing to `false`.
- Drawer polish: tooltip on a disabled add-menu row (span wrapper), clear the shared
catalog searches on unmount / external close, drop the double `p-4` in the JSON
view, and don't persist tool-group expand state under a shared `null:*` key.
- Catalog item cards: block the pick when a connection is pending or missing (only the rail path guarded it before; the full items view called handlePick unconditionally and silently no-oped without a connection). - Trigger connect: resolve the full catalog integration (with auth_schemes) by key before opening TriggerConnectDrawer, so connecting from a connection-derived (synthetic) integration no longer opens with empty auth modes. - Workflow reference: persist the selected variant id on the payload/tool (`variant_id`), so "follow a variant's latest" (no pinned version) keeps a variant identity instead of collapsing to a bare-slug reference. Threaded through the selector, useAgentTools, and the editable ReferenceToolFormView.
|
@coderabbitai review |
✅ Action performedReview finished.
|
There was a problem hiding this comment.
🧹 Nitpick comments (2)
web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/useAgentTools.ts (2)
93-101: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low valueConsider consolidating the duplicated
refBy === "variant"checks.
payload.refBy === "variant"is checked twice back-to-back forvariant_idandversion. Could be combined into a single conditional block to reduce duplication.♻️ Proposed consolidation
- ...(payload.refBy === "variant" && payload.variant - ? {variant_id: payload.variant} - : {}), - ...(payload.refBy === "variant" && payload.version - ? {version: payload.version} - : {}), + ...(payload.refBy === "variant" + ? { + ...(payload.variant ? {variant_id: payload.variant} : {}), + ...(payload.version ? {version: payload.version} : {}), + } + : {}),
31-32: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low valueA few comments span multiple lines.
Lines 31-32, 59-61, and 71-73 each use 2-3 line comments. Per guidelines, comments should be one short line unless a genuinely surprising constraint justifies an exception; the 59-61 and 71-73 blocks arguably qualify (explaining non-obvious routing/dedup behavior), but worth trimming where possible. As per coding guidelines, "Keep in-code comments to one short line maximum unless a genuinely surprising constraint requires a brief exception."
Also applies to: 59-61, 71-73
Source: Coding guidelines
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: f8e3b84f-92fc-408b-a53e-f927a48b07c1
📒 Files selected for processing (15)
web/oss/src/components/DrillInView/OSSdrillInUIProvider.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/ConfigItemDrawer.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/ReferenceToolFormView.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/WorkflowReferenceSelector.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ItemRow.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ParameterNodeEditor.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ToolManagementList.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/schemaPaths.tsweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/useAgentTools.tsweb/packages/agenta-entity-ui/src/drawers/shared/AddItemMenu.tsxweb/packages/agenta-entity-ui/src/drawers/shared/CatalogChooser.tsxweb/packages/agenta-entity-ui/src/drawers/shared/GatewayCatalogDrawer.tsxweb/packages/agenta-entity-ui/src/drawers/shared/RailField.tsxweb/packages/agenta-entity-ui/src/gatewayTrigger/drawers/TriggerCatalogDrawer.tsxweb/packages/agenta-ui/src/drill-in/context/DrillInUIContext.tsx
🚧 Files skipped from review as they are similar to previous changes (14)
- web/packages/agenta-entity-ui/src/drawers/shared/RailField.tsx
- web/packages/agenta-entity-ui/src/drawers/shared/AddItemMenu.tsx
- web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/ConfigItemDrawer.tsx
- web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ToolManagementList.tsx
- web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ItemRow.tsx
- web/packages/agenta-entity-ui/src/drawers/shared/GatewayCatalogDrawer.tsx
- web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/ReferenceToolFormView.tsx
- web/packages/agenta-entity-ui/src/gatewayTrigger/drawers/TriggerCatalogDrawer.tsx
- web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/WorkflowReferenceSelector.tsx
- web/packages/agenta-ui/src/drill-in/context/DrillInUIContext.tsx
- web/packages/agenta-entity-ui/src/drawers/shared/CatalogChooser.tsx
- web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ParameterNodeEditor.tsx
- web/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/schemaPaths.ts
- web/oss/src/components/DrillInView/OSSdrillInUIProvider.tsx
1 participant
What
Redesigns agent-playground tool / workflow-reference selection (agent-playground scoped — never the legacy prompt playground). Split into three review-oriented commits, in dependency order.
1. Shared drawer primitives (
refactor)Moves the trigger-drawer building blocks up to
drawers/sharedso the agent drawers reuse them instead of duplicating:DrawerFooter,MasterDetailRail,useDraftMasterDetailmoved out ofgatewayTrigger/.SectionRail([rail | content]),RailField,CatalogChooser+CatalogAppCard(2-col app grid),AddItemMenu,GatewayCatalogDrawer.SourceChooser→CatalogChooser;RunVersionField→SectionRail), so every drawer rail looks the same.2. Workflow-reference drawer detail (
feat)Rebuilds the "reference a workflow" detail into a
ConfigAccordionSectionstack (Exposed as / Schema / Configuration / Reference by):SchemaTree(read-only recursive schema viewer).resolveOutputSchema,resolveConfigPayload,useWorkflowTypes;WorkflowConfigPart/Message+ anevaluatorreference type.inputPorts(declared schema → prompt template variables) with local recovery for curly/jinja JSONPath inputs the shared extractor drops; output fromresponse_format; Configuration from the full prompt (grouped Messages, model, tools, response_format).workflowTypeon a hydrated revision (agents get a tag); evaluators labelled by their template kind.3. Tool selection: definition form + catalog + add-menu (
feat)ParameterTree+ParameterNodeEditorover pure, unit-testedschemaPathshelpers. Per-parameter Allowed values (enum) + Default (scalar-only, type-coerced) and a tool-leveladditionalPropertiestoggle; JSON stays the lossless escape hatch.AddItemMenu-based picker (Add existing / Create new):AgentToolSelectorPopover,AgentIntegrationDrawer(third-party viaCatalogChooser),ReferenceToolFormView,ToolManagementList.Notes
--ag-color*tokens).tscerror remains inuseModelHarness.tsx(predates this branch).{{$.inputs.x}}inputs are recovered locally here; the underlying shared extractor gap is a separate playground ticket.