[feat] Agent home/onboarding polish + unresolved-tool marking - #5222
Merged
Conversation
…ig panel Tool rows in the agent template's Tools section now surface resolution problems without opening each drawer: a catalog action that 404s (renamed/ removed) or a missing connection shows a red Unresolved tag; a connection with is_valid=false shows an amber Reconnect tag. Collapsed provider groups roll up their worst child status, and the section header tooltip reflects it. The probe reuses the drawer's action-detail query family (shared cache, 5-min staleTime) with a low-priority fetch so playground load is unaffected; 404s skip retries and transient errors never mark a row. GatewayToolsBridge gains connectionsErrored so a failed connections fetch reads as unknown rather than "all connections removed".
…ject dropdown During pre-commit onboarding the sidebar now pins Home as selected and inert, and disables the dead-end links (Agents, Evaluation runs, Annotation Queues) while keeping app-less surfaces (Prompts, Test sets, Evaluators, Observability) live. State lives in a new oss/src/state/onboarding module: useAgentOnboarding mirrors its lifecycle into onboardingSessionAtom and consumers read named selectors. The session bar/rail's New session (+) stays disabled after the commit until the founding conversation's first run settles (finishes, awaits the user, or errors), latched off permanently once it does. The project dropdown's pinned New project footer (AGE-3939) gets a filled band + Plus icon so it reads as an action, and the list caps at max-h-60.
The counter assumed a fixed 3-card window, so on wide viewports (e.g. the 960px home column showing ~3.7 cards) the end-of-scroll label read "3-5 of 6" while card 6 was fully visible. Compute the visible-card count from clientWidth, clamp the first index to the true last window, and hide the pager whenever every card already fits. Adds wide-viewport regression tests.
…onboarding composer Extract the 'Use my coding agent' + 'Create agent' trailing cluster into AgentIntentActions and render it from both StripComposer (home hero) and the strip-mode playground onboarding composer, so the two surfaces can't drift apart. The hero composer now matches the onboarding RichChatInput config (Enter submits, shortcut hints show) and the 'describe an agent' placeholder moves to STRIP_COPY as the single source. Enter-submit passes the submitted markdown through onCreate since the editor clears itself before a ref read.
Add a 'grid' layout to TemplateStrip: exactly one PAGE_SIZE window of full-width cards with stateful arrow paging, so the wide home surface never shows a clipped fourth card and the window always matches the 'X-Y of N' counter. StripCard grows a 'fluid' prop to fill its grid cell. StripHome adopts it and re-centers the page on a 1040px column with an 840px hero measure and larger vertical rhythm.
…home page Dark-mode template cards had no elevation (card and page are both #141414 via colorBgContainer) and leaned on a strong #303030 border for shape. Adds strip-card surface roles to the templateStrip palette family (cardBg/cardBorder/cardBorderHover; light values unchanged) and points the card and the usage bar at them, so dark gets a subtle lifted surface with a near-bg border. theme-variables.css regenerated, not hand-edited. Grid-mode cards get the designer's roomier interior (p-5, 40px icon badge, larger gaps, 15px title); the compact scroll-strip metrics on playground surfaces are untouched. RichChatInput gains a size="comfortable" density prop (padded editor, placeholder offset, footer row) so the home hero can scale up without forking the shared composer; chat surfaces keep the compact default. Also: the provenance chip is absolutely positioned into the hero gap (bottom-full) so its invisible zero-shift slot no longer inflates the subtitle-to-composer distance past 44px, pager counters use an en-dash, and the hero title-to-subtitle gap goes to 16px.
dosubot
Bot
added
the
size:XL
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
📝 WalkthroughWalkthroughThe PR adds onboarding session state and navigation gating, updates agent-home and TemplateStrip composition, introduces gateway-tool availability validation, improves loading and project-selector presentation, and adds responsive strip layouts with new theme tokens. ChangesOnboarding and agent home
Template strip experience
Gateway tool availability validation
Sidebar and loading presentation
Estimated code review effort: 4 (Complex) | ~60 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
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 |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Member
|
Thanks @ardaerzin . I mean the clipped card was intended :D It is a signifier that there is more to scroll. But I'm alright with this change, I don't think it's worth iterating again on it for now. |
Extract PlaygroundLoadingShell into its own module and give it an `agent` override and a `children` slot. The onboarding loader now renders the real agent playground shell (forced agent header + live chat skeleton) instead of a bare centered spinner, so the ephemeral onboarding flow shows one continuous screen that morphs straight into the live panel. Onboarding always targets an agent, so the header is forced without waiting for the early app-id signal. Mint failure still swaps the body for an error + Retry so the flow never dead-ends.
…ding-improvements
The onboarding loader's body now mirrors the live PlaygroundMainView geometry: a 440px raised config panel with its Configuration header + AgentConfigSkeleton rows alongside the recessed chat canvas, instead of a lone chat skeleton. The loader morphs into the real two-pane layout without a shift. Only the splitter frame + header are static markup; both skeletons are provider-free.
…ding-improvements
Contributor
Author
|
@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: 3
🧹 Nitpick comments (1)
web/oss/src/components/PlaygroundRouter/PlaygroundLoadingShell.tsx (1)
34-35: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse
--ag-colorFillSecondaryhere instead of the raw Ant token.web/oss/src/styles/theme-variables.cssexposes the generated variable, andweb/oss/tailwind.config.tsmapscolorFillSecondaryto it for theme consistency.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: cbd2f5c9-85f2-44ff-903e-71a1da59db01
📒 Files selected for processing (47)
web/oss/src/components/AgentChatSlice/AgentChatPanel.tsxweb/oss/src/components/AgentChatSlice/AgentConversation.tsxweb/oss/src/components/AgentChatSlice/components/SessionRail.tsxweb/oss/src/components/AgentChatSlice/components/SessionTagBar.tsxweb/oss/src/components/DrillInView/OSSdrillInUIProvider.tsxweb/oss/src/components/PlaygroundRouter/PlaygroundLoadingShell.tsxweb/oss/src/components/PlaygroundRouter/index.tsxweb/oss/src/components/Sidebar/components/ListOfProjects.tsxweb/oss/src/components/Sidebar/engine/SidebarMenu.tsxweb/oss/src/components/Sidebar/engine/SidebarShell.tsxweb/oss/src/components/Sidebar/engine/types.tsweb/oss/src/components/Sidebar/hooks/useSidebarConfig/index.tsxweb/oss/src/components/Sidebar/scopes/constants.tsweb/oss/src/components/Sidebar/scopes/mainScope.tsxweb/oss/src/components/TemplateStrip/assets/constants.tsweb/oss/src/components/TemplateStrip/assets/pagerMath.test.tsweb/oss/src/components/TemplateStrip/assets/pagerMath.tsweb/oss/src/components/TemplateStrip/components/AgentIntentActions.tsxweb/oss/src/components/TemplateStrip/components/StripCard.tsxweb/oss/src/components/TemplateStrip/components/StripComposer.tsxweb/oss/src/components/TemplateStrip/index.tsxweb/oss/src/components/pages/agent-home/PlaygroundOnboarding/OnboardingContext.tsxweb/oss/src/components/pages/agent-home/PlaygroundOnboarding/OnboardingLoader.tsxweb/oss/src/components/pages/agent-home/PlaygroundOnboarding/useAgentOnboarding.tsweb/oss/src/components/pages/agent-home/StripHome.tsxweb/oss/src/components/pages/agent-home/assets/constants.tsweb/oss/src/components/pages/agent-home/components/UsageSummary/index.tsxweb/oss/src/components/pages/agent-home/components/YourAgentsTable/index.tsxweb/oss/src/components/pages/agent-home/hooks/useAgentHomeActions.tsweb/oss/src/state/onboarding/atoms.tsweb/oss/src/state/onboarding/index.tsweb/oss/src/state/onboarding/selectors.tsweb/oss/src/styles/theme-variables.cssweb/oss/src/styles/theme/palette.tsweb/packages/agenta-entities/src/gatewayTool/api/api.tsweb/packages/agenta-entities/src/gatewayTool/hooks/index.tsweb/packages/agenta-entities/src/gatewayTool/hooks/useToolActionAvailability.tsweb/packages/agenta-entities/src/gatewayTool/hooks/useToolActionDetail.tsweb/packages/agenta-entities/src/gatewayTool/index.tsweb/packages/agenta-entities/tests/unit/gatewayTool-action-availability.test.tsweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/AgentTemplateControl.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ItemRow.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/agentTemplate/ToolManagementList.tsxweb/packages/agenta-entity-ui/src/DrillInView/SchemaControls/sectionGroups.tsxweb/packages/agenta-ui/src/RichChatInput/RichChatInput.tsxweb/packages/agenta-ui/src/drill-in/context/DrillInUIContext.tsxweb/scripts/generate-tailwind-tokens.ts
Comment on lines
+218
to
+228
| <Tooltip | ||
| title={ | ||
| addDisabled ? "Available after your agent's first response" : "New session" | ||
| } | ||
| > | ||
| <Button | ||
| type="text" | ||
| aria-label="New session" | ||
| icon={<Plus size={14} />} | ||
| onClick={() => addSession()} | ||
| disabled={addDisabled} |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
set -euo pipefail
# Map the relevant component files first
ast-grep outline web/oss/src/components/AgentChatSlice/components/SessionRail.tsx --view expanded
printf '\n====\n'
ast-grep outline web/oss/src/components/AgentChatSlice/components/SessionTagBar.tsx --view expanded
printf '\n==== SessionRail excerpt ====\n'
sed -n '180,255p' web/oss/src/components/AgentChatSlice/components/SessionRail.tsx
printf '\n==== SessionTagBar excerpt ====\n'
sed -n '190,260p' web/oss/src/components/AgentChatSlice/components/SessionTagBar.tsx
printf '\n==== Search for similar tooltip-disabled button patterns in agent chat slice ====\n'
rg -n "Tooltip[\\s\\S]{0,120}disabled=\\{addDisabled\\}|disabled=\\{addDisabled\\}[\\s\\S]{0,120}Tooltip" web/oss/src/components/AgentChatSlice -URepository: Agenta-AI/agenta
Length of output: 7862
🏁 Script executed:
#!/bin/bash
set -euo pipefail
# If the component files are small enough, inspect exact nearby structure and imports
printf '\n==== SessionRail top imports ====\n'
sed -n '1,80p' web/oss/src/components/AgentChatSlice/components/SessionRail.tsx
printf '\n==== SessionTagBar top imports ====\n'
sed -n '1,90p' web/oss/src/components/AgentChatSlice/components/SessionTagBar.tsxRepository: Agenta-AI/agenta
Length of output: 6431
Wrap the disabled buttons in a non-disabled tooltip trigger.
Ant Design tooltips won’t reliably fire on a disabled Button, so the “Available after your agent's first response” hint can be missed.
web/oss/src/components/AgentChatSlice/components/SessionRail.tsx#L218-L228web/oss/src/components/AgentChatSlice/components/SessionTagBar.tsx#L224-L236
📍 Affects 2 files
web/oss/src/components/AgentChatSlice/components/SessionRail.tsx#L218-L228(this comment)web/oss/src/components/AgentChatSlice/components/SessionTagBar.tsx#L224-L236
Source: MCP tools
- New session (+) tooltip: antd v6 dropped the disabled-child auto-wrap its
Tooltip had in v4/v5, so the disabled-state hint ("Available after your
agent's first response") never fired on the disabled Button. Wrap the button
in a non-disabled span trigger in SessionRail and SessionTagBar.
- Sidebar inert items: the <Link> onClick handlers still ran item.onClick after
preventDefault, unlike navigateToItem which early-returns. Guard both handlers
so an inert item suppresses onClick on every path (latent; Home has none today).
- Pager counter: floor 'first' at 1 so a transient negative scrollLeft from
Safari elastic overscroll can't label "0-2 of 6". Adds a regression test.
- PlaygroundLoadingShell: use the mapped colorFillSecondary utility instead of
the raw --ant-color-fill-secondary token.
Contributor
Author
|
@coderabbitai review |
✅ Action performedReview finished.
|
This was referenced Jul 24, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Context
This branch polishes the agent home/onboarding surfaces that ship behind the onboarding flow, and adds resolution-state feedback to the agent config Tools section. Before this, the home template strip clipped a partial fourth card and its "X-Y of N" counter disagreed with what was on screen, dark-mode cards had no elevation, the hero composer and the onboarding composer drifted apart, the sidebar let a mid-onboarding user click into dead-end app screens, and connected-app tools gave no signal when their catalog action or connection had gone stale.
Changes
Home template strip: grid layout and viewport-aware paging. TemplateStrip gains a
gridlayout that renders exactly onePAGE_SIZEwindow of full-width cards with stateful arrow paging, so the wide home surface never shows a clipped card and the window always matches the counter. The pager now computes the visible-card count fromclientWidth, clamps the first index to the true last window, and hides itself when every card already fits. Previously a 960px column showing ~3.7 cards read "3-5 of 6" while card 6 was fully visible.Elevated cards and a hero-scale composer. Added strip-card surface roles (
cardBg/cardBorder/cardBorderHover) to thetemplateStrippalette family so dark mode gets a subtly lifted surface with a near-bg border instead of leaning on a strong#303030outline (light values unchanged;theme-variables.cssregenerated, not hand-edited). Grid cards get roomier interiors (p-5, 40px icon badge, 15px title); the compact playground scroll-strip metrics are untouched. RichChatInput gains asize="comfortable"density prop so the home hero can scale up without forking the shared composer.Shared agent-intent actions. Extracted the "Use my coding agent" + "Create agent" trailing cluster into
AgentIntentActions, rendered from both the home hero (StripComposer) and the strip-mode playground onboarding composer, so the two can't drift. The hero composer now matches the onboarding config (Enter submits, shortcut hints visible) and the "describe an agent" placeholder lives once inSTRIP_COPY.Onboarding app chrome. During pre-commit onboarding the sidebar pins Home as selected and inert and disables dead-end links (Agents, Evaluation runs, Annotation Queues) while keeping app-less surfaces (Prompts, Test sets, Evaluators, Observability) live. New
oss/src/state/onboardingmodule:useAgentOnboardingmirrors its lifecycle intoonboardingSessionAtomand consumers read named selectors. The session bar/rail's New session (+) stays disabled after commit until the founding conversation's first run settles (finishes, awaits the user, or errors), then latches on permanently. The project dropdown's pinned New project footer gets a filled band + Plus icon so it reads as an action, and the list caps atmax-h-60.Mark unresolved connected-app tools. Tool rows in the agent template's Tools section now surface resolution problems without opening each drawer. A catalog action that 404s (renamed/removed) or a missing connection shows a red Unresolved tag; a connection with
is_valid=falseshows an amber Reconnect tag. Collapsed provider groups roll up their worst child status and the section header tooltip reflects it. The probe reuses the drawer's action-detail query family (shared cache, 5-min staleTime) with a low-priority fetch so playground load is unaffected; 404s skip retries and transient errors never mark a row.GatewayToolsBridgegainsconnectionsErroredso a failed connections fetch reads as "unknown" rather than "all connections removed".Tests / notes
pagerMath.test.ts) and a unit test for the tool action-availability probe (gatewayTool-action-availability.test.ts).web/oss/src/styles/theme/palette.ts+pnpm generate:tailwind-tokens; the regeneratedtheme-variables.cssis committed, not hand-edited.What to QA