Chat-based onboarding and project overview (experimental)#42
Merged
Conversation
When the `new_project_overview_page` experimental flag is enabled, replace the form-based onboarding and the static overview with a chat-driven experience: - Onboarding (Dashboard): after entering an app/GitHub URL, an agent walks the user through setup conversationally, records settings via tool calls, lists what they can provide, and — once the user approves — creates the project with the same createProject payload the classic form produces. - Project overview: a collapsible QA chat sidebar on the left shows what QA has been doing (a live activity timeline from the task history/queue) alongside the user's conversation, and can answer questions or change project settings. The agent runs server-side in a new `project-chat` Netlify function using the existing Anthropic (lib/llm.ts) tool-calling infra. The chat client model and components (message model, merge-by-id, message list, input) are adapted from replayio/nut.new. Everything is gated behind the experimental flag; the classic form and overview are unchanged when it's off. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Replay QA🚫 Cancelled — the pull request was closed. |
|
🔎 Loop QA preview (all-k8s backend): https://pr-42--loop-qa-j63k5x.netlify.app |
…idance Addresses three follow-ups to the experimental chat onboarding/overview: 1. Inline forms for global variables (logins). The agent can call a `request_login_form` tool; the client renders an inline form (reusing LoginsEditor) so credentials are entered in masked fields instead of typed into the chat transcript. Onboarding stores them in the draft config; the project chat saves them as login global variables via update-global-variables. 2. Streaming responses. The `project-chat` function is now a native Netlify Functions 2.0 handler that streams newline-delimited JSON (adapted from nut.new's ChatResponse model): assistant text arrives as incremental `delta` events accumulated client-side by message id, with side-band events for config/settings/form/ready. Adds callLlmStreaming() to lib/llm.ts using the Anthropic streaming API. 3. Budget guidance. The onboarding/project system prompts now explain what a budget buys (~10 credits = smoke test, 20-50 = thorough, 50+ = broad coverage) so the agent clarifies it when budget comes up. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
1. chat should be able to provide forms for ...
Previously the running-project QA chat rendered as its own column inside the project overview. Move it into the app's main sidebar instead: when the new_project_overview_page experiment is on and a project overview is open, the sidebar switches to a chat-focused layout — the user / Help / Discord cluster relocates to the top and the QA chat fills the lower ~3/4 of the sidebar. The sidebar widens and its own collapse toggle hides the chat (falling back to the normal icon nav), so no separate chat collapse control is needed. - AppShell: detect the /projects/:id/overview route + flag, render ProjectChat in a chat-mode sidebar; factor the footer (user/Help/Discord) into a shared block reused at top or bottom. - ProjectChat: simplified to fill its container (no self-collapse/rail). - ProjectOverview: reverted to a single column (chat no longer lives here). All rendering changes are gated on the experimental flag; with it off the sidebar and overview are unchanged. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
All changes gated on the new_project_overview_page experimental flag. Chat fixes: - Login form: password fields are masked with a per-row show/hide (eye) button (LoginsEditor maskPassword prop). The "let agents register their own test accounts" toggle is hidden for chat and that setting is always on (agents may self-register but prefer any provided login) — LoginsEditor hideAutoCreate prop. - Sidebar chat: the top now shows a user info row followed by four icon-only buttons (Projects, New project, Help, Discord). When the sidebar is collapsed, those icons sit at the top of the rail in the same (expanded) order. Overview redesign — the experimental ProjectOverview now mirrors the classic overview instead of collapsible sections: - A live QA-activity banner (reused StatusSentence). - The active / most recent exploration's rrweb replay, with prev/next to cycle through all explorations (new OverviewExplorations). - If there are bugs: bug breakdown chart + top open bugs (reused from OverviewTab) with a Copy bug reports button and a "Load all bugs" control that expands the full paginated bug list. - The full grid of journey cards (reused JourneyCard). StatusSentence / TopOpenBugs / BugBreakdownChart are now exported from OverviewTab. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
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
1 participant
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
Behind the existing
new_project_overview_pageexperimental flag, this reworks onboarding and the project overview to be chat-based. When the flag is off, the classic form and overview are completely unchanged.Chat-based onboarding (Dashboard)
createProjectpayload the classic form produces (reusing theqaConfighelpers), then navigates to the overview.Chat sidebar on the project overview
updateProject.Backend
project-chatNetlify function runs the agent server-side with a bounded tool-calling loop using the existing Anthropic integration (netlify/functions/lib/llm.ts).Reuse from nut.new
Per the request, the chat interface incorporates logic from replayio/nut.new rather than writing a new one from scratch: the flat
{ id, role, content }message model, the merge-by-id accumulation (mergeResponseMessage), and the message-list / message-input component structure are adapted from its chat implementation. (nut.new keeps its agent on a closed backend, so the server-side agent loop itself is implemented here against the app's Anthropic infra.)Files
netlify/functions/project-chat.ts,netlify/functions/lib/project-chat-types.ts— server agent + shared typessrc/components/chat/*— reusable chat model + UI (adapted from nut.new)src/components/OnboardingChat.*— chat onboardingsrc/components/ProjectChat.*— overview chat sidebarsrc/pages/Dashboard.tsx,src/pages/ProjectOverview.*— flag-gated wiringTesting
tsc --noEmitclean; ESLint clean on all changed/new files. (One pre-existing lint failure in the unrelatedscripts/lib/replay-node-preload.cjsshim is untouched.)vite buildsucceeds (no server code leaks into the client bundle).dev:mock: URL entry → chat greeting → conversation → "start" → config summary → project creation → overview with chat sidebar, activity timeline, send, and collapse/expand.🤖 Generated with Claude Code