Square onboarding starter cards with Choose your own adventure - #806
Merged
Merged
Conversation
Remove the separate setup-prompt step; focus step 2 on a denser card grid of featured packages plus a trailing Choose your own adventure card that copies the open-ended agent prompt. Raise the featured cap to 12 so more starters fit.
📝 WalkthroughWalkthroughOnboarding now supports up to 12 featured starter packages in a responsive card grid, adds a persistent DIY prompt card with clipboard feedback, updates starter-card styling and route flow, and revises documentation and end-to-end expectations. ChangesFeatured onboarding flow
Estimated code review effort: 3 (Moderate) | ~20 minutes Sequence Diagram(s)sequenceDiagram
participant Member
participant OnboardingRoute
participant OnboardingStarterCard
participant OnboardingDiyCard
participant Clipboard
Member->>OnboardingRoute: Open onboarding
OnboardingRoute->>OnboardingStarterCard: Render featured listings
OnboardingRoute->>OnboardingDiyCard: Render setup prompt
Member->>OnboardingStarterCard: Install or copy prompt
Member->>OnboardingDiyCard: Copy DIY prompt
OnboardingDiyCard->>Clipboard: Write setup prompt
Clipboard-->>OnboardingDiyCard: Return copy result
Possibly related PRs
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 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 |
kody-bot
marked this pull request as ready for review
July 20, 2026 18:54
Contributor
|
🔎 Preview deployed: https://kody-pr-806.kody-a99.workers.dev Worker: Mocks:
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
🧹 Nitpick comments (1)
packages/worker/client/routes/onboarding-diy-card.tsx (1)
168-178: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low valueExport and reuse
tooltipSurfaceCssto avoid duplication.This object is an exact duplicate of
tooltipSurfaceCssinonboarding-starter-card.tsx. Consider exporting it from there and importing it here to ensure the tooltip styling remains consistent across onboarding cards.🛠️ Proposed refactor
In
packages/worker/client/routes/onboarding-starter-card.tsx, export the style object:-const tooltipSurfaceCss = { +export const tooltipSurfaceCss = {Then, update the imports in this file:
import { starterCardCss, starterCardItemCss, + tooltipSurfaceCss, } from '`#client/routes/onboarding-starter-card.tsx`'And remove the duplicated block from this file:
-const tooltipSurfaceCss = { - maxWidth: '16rem', - padding: `${spacing.xs} ${spacing.sm}`, - borderRadius: radius.md, - backgroundColor: colors.surface, - color: colors.text, - fontSize: typography.fontSize.sm, - lineHeight: 1.4, - boxShadow: shadows.md, - border: `1px solid ${colors.border}`, -}🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/worker/client/routes/onboarding-diy-card.tsx` around lines 168 - 178, Export the existing tooltipSurfaceCss object from onboarding-starter-card.tsx, import and reuse that symbol in onboarding-diy-card.tsx, and remove the duplicate local definition while preserving all current styling behavior.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@packages/worker/client/routes/onboarding-diy-card.tsx`:
- Around line 168-178: Export the existing tooltipSurfaceCss object from
onboarding-starter-card.tsx, import and reuse that symbol in
onboarding-diy-card.tsx, and remove the duplicate local definition while
preserving all current styling behavior.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 16260061-4ed9-4aa7-8021-b8493087d987
📒 Files selected for processing (8)
docs/contributing/community-packages.mddocs/use/community-packages.mddocs/use/connect-your-agent.mde2e/community-featured.spec.tspackages/worker/client/routes/onboarding-diy-card.tsxpackages/worker/client/routes/onboarding-starter-card.tsxpackages/worker/client/routes/onboarding.tsxpackages/worker/src/app/community-data.ts
2 of 3 tasks
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
3 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.
Summary
Tightens the onboarding install step: denser square cards for featured packages, removes the separate setup-prompt step, and adds a trailing Choose your own adventure card that copies the open-ended agent prompt (what used to be step 2).
Changes
buildOnboardingSetupPrompt()for custom exploration/buildSystem recap — composes existing primitives (low risk)
Mode: recap · Base:
main@49680f32· Head:56345528Classification: composes — UI/layout and copy for onboarding starters; reuses existing install API and setup prompt.
Primitives touched
app-uiSystem map
Onboarding step 2 focuses on starter install cards; DIY copies the former setup prompt.
Legend: green = composes (wiring only) · amber = extended by this PR · red = new primitive · gray = context (unchanged, included only when an edge crosses it).
Change flow
Summary by CodeRabbit