feat(frontend/copilot): pin interactive tool cards outside reasoning collapse - #12346
Conversation
github-project-automation
Bot
moved this to 🆕 Needs initial review
in AutoGPT development kanban
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (3)
📜 Recent review details⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
🧰 Additional context used📓 Path-based instructions (14)autogpt_platform/frontend/**/*.{ts,tsx,js,jsx}📄 CodeRabbit inference engine (.github/copilot-instructions.md)
Files:
autogpt_platform/frontend/**/*.{tsx,ts}📄 CodeRabbit inference engine (.github/copilot-instructions.md)
Files:
autogpt_platform/frontend/**/*.{ts,tsx}📄 CodeRabbit inference engine (.github/copilot-instructions.md)
Files:
autogpt_platform/frontend/**/*.{js,jsx,ts,tsx}📄 CodeRabbit inference engine (AGENTS.md)
Files:
autogpt_platform/frontend/src/app/(platform)/**/page.tsx📄 CodeRabbit inference engine (AGENTS.md)
Files:
autogpt_platform/frontend/src/**/*.{ts,tsx}📄 CodeRabbit inference engine (AGENTS.md)
Files:
autogpt_platform/frontend/**/*.{js,jsx,ts,tsx,css}📄 CodeRabbit inference engine (AGENTS.md)
Files:
autogpt_platform/frontend/src/**/*.tsx📄 CodeRabbit inference engine (AGENTS.md)
Files:
autogpt_platform/**/*.{ts,tsx}📄 CodeRabbit inference engine (AGENTS.md)
Files:
autogpt_platform/frontend/src/app/(platform)/**/*.tsx📄 CodeRabbit inference engine (AGENTS.md)
Files:
autogpt_platform/frontend/src/**/*.{ts,tsx,js,jsx}📄 CodeRabbit inference engine (autogpt_platform/frontend/CLAUDE.md)
Files:
autogpt_platform/frontend/src/**/components/**/*.{ts,tsx}📄 CodeRabbit inference engine (autogpt_platform/frontend/CLAUDE.md)
Files:
autogpt_platform/frontend/src/**/[A-Z]*/**/*.{ts,tsx}📄 CodeRabbit inference engine (autogpt_platform/frontend/CLAUDE.md)
Files:
autogpt_platform/frontend/src/**/*.ts📄 CodeRabbit inference engine (AGENTS.md)
Files:
🧠 Learnings (20)📓 Common learnings📚 Learning: 2026-02-04T16:49:42.490ZApplied to files:
📚 Learning: 2026-02-04T16:50:51.495ZApplied to files:
📚 Learning: 2026-02-26T21:29:44.105ZApplied to files:
📚 Learning: 2026-01-28T18:29:34.362ZApplied to files:
📚 Learning: 2026-02-27T10:45:49.499ZApplied to files:
📚 Learning: 2026-02-04T16:50:51.495ZApplied to files:
📚 Learning: 2026-02-04T16:50:51.495ZApplied to files:
📚 Learning: 2026-02-26T21:29:44.105ZApplied to files:
📚 Learning: 2026-02-04T16:50:51.495ZApplied to files:
📚 Learning: 2026-02-26T21:29:44.105ZApplied to files:
📚 Learning: 2026-02-26T10:12:58.845ZApplied to files:
📚 Learning: 2026-02-04T16:50:51.495ZApplied to files:
📚 Learning: 2026-02-04T16:50:51.495ZApplied to files:
📚 Learning: 2026-02-26T21:29:44.105ZApplied to files:
📚 Learning: 2026-02-04T16:49:42.490ZApplied to files:
📚 Learning: 2026-02-26T21:29:44.105ZApplied to files:
📚 Learning: 2026-02-26T21:29:44.105ZApplied to files:
📚 Learning: 2026-02-27T10:45:55.700ZApplied to files:
📚 Learning: 2026-03-05T19:50:36.697ZApplied to files:
🔇 Additional comments (13)
WalkthroughThis PR extracts helper functions and type definitions from ChatMessagesContainer into a new shared helpers module. The helpers.ts file introduces utilities for message rendering, tool-part detection, and message segmentation. A styleguide section showcases examples of reasoning collapse and interactive tool pinning patterns. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ 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 |
🔍 PR Overlap DetectionThis check compares your PR against all other open PRs targeting the same branch to detect potential merge conflicts early. 🔴 Merge Conflicts DetectedThe following PRs have been tested and will have merge conflicts if merged after this PR. Consider coordinating with the authors.
🟢 Low Risk — File Overlap OnlyThese PRs touch the same files but different sections (click to expand)
Summary: 2 conflict(s), 0 medium risk, 1 low risk (out of 3 PRs with file overlap) Auto-generated on push. Ignores: |
github-project-automation
Bot
moved this from 🆕 Needs initial review
to 👍🏼 Mergeable
in AutoGPT development kanban
…collapse Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…guide Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
821c396 to
f4266ba
Compare
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@autogpt_platform/frontend/src/app/`(platform)/copilot/components/ChatMessagesContainer/helpers.ts:
- Around line 56-66: The code currently JSON.parses string output and then
checks typeof output === "object" but doesn't guard against output being null
(e.g., JSON.parse("null")), causing a crash when accessing (output as
Record<string, unknown>).type; update the logic in helpers.ts to treat parsed
null as a non-interactive payload by returning false when output === null (i.e.,
ensure you check output !== null before reading the .type property), so the
subsequent const responseType = (output as Record<string, unknown>).type is
safe.
- Around line 123-148: The early-return logic uses hasResponseAfterTools to only
detect trailing text parts, which misses pinned interactive cards (e.g.,
need_login, setup_requirements) and prevents moving reasoning behind the
collapse; update the detection to treat interactive tool parts as response
content by changing the slice check (hasResponseAfterTools) to consider either
p.type === "text" OR isInteractiveToolPart(p), so that when pinned cards follow
the last tool the function proceeds to split rawReasoning/rawResponse and
include pinned parts in the response (referencing variables/functions: parts,
lastToolIndex, hasResponseAfterTools, isInteractiveToolPart, rawReasoning,
rawResponse, pinnedParts).
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 80b93ec6-8060-4233-9857-a33b1957c048
📒 Files selected for processing (2)
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.ts
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)
- GitHub Check: types
- GitHub Check: integration_test
- GitHub Check: end-to-end tests
- GitHub Check: Check PR Status
🧰 Additional context used
📓 Path-based instructions (13)
autogpt_platform/frontend/**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
autogpt_platform/frontend/**/*.{ts,tsx,js,jsx}: Use Node.js 21+ with pnpm package manager for frontend development
Always run 'pnpm format' for formatting and linting code in frontend development
autogpt_platform/frontend/**/*.{ts,tsx,js,jsx}: Runpnpm formatto auto-fix formatting issues before completing work
Runpnpm lintto check for lint errors and fix any that appear before completing work
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/**/*.{tsx,ts}
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
autogpt_platform/frontend/**/*.{tsx,ts}: Use function declarations for components and handlers (not arrow functions) in React components
Only use arrow functions for small inline lambdas (map, filter, etc.) in React components
Use PascalCase for component names and camelCase with 'use' prefix for hook names in React
Use Tailwind CSS utilities only for styling in frontend components
Use design system components from 'src/components/' (atoms, molecules, organisms) in frontend development
Never use 'src/components/legacy/' in frontend code
Only use Phosphor Icons (@phosphor-icons/react) for icons in frontend components
Use generated API hooks from '@/app/api/generated/endpoints/' instead of deprecated 'BackendAPI' or 'src/lib/autogpt-server-api/'
Use React Query for server state (via generated hooks) in frontend development
Default to client components ('use client') in Next.js; only use server components for SEO or extreme TTFB needs
Use '' component for rendering errors in frontend UI; use toast notifications for mutation errors; use 'Sentry.captureException()' for manual exceptions
Separate render logic from data/behavior in React components; keep comments minimal (code should be self-documenting)
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
autogpt_platform/frontend/**/*.{ts,tsx}: No barrel files or 'index.ts' re-exports in frontend code
Regenerate API hooks with 'pnpm generate:api' after backend OpenAPI spec changes in frontend developmentRun
pnpm typesto check for type errors and fix any that appear before completing work
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/**/*.{js,jsx,ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
autogpt_platform/frontend/**/*.{js,jsx,ts,tsx}: Format frontend code usingpnpm format
Never use components fromsrc/components/__legacy__/*
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
autogpt_platform/frontend/src/**/*.{ts,tsx}: Structure components asComponentName/ComponentName.tsx+useComponentName.ts+helpers.tsand use design system components fromsrc/components/(atoms, molecules, organisms)
Use generated API hooks from@/app/api/__generated__/endpoints/with patternuse{Method}{Version}{OperationName}and regenerate withpnpm generate:api
Use function declarations (not arrow functions) for components and handlers
Separate render logic from business logic with component.tsx + useComponent.ts + helpers.ts structure
Colocate state when possible, avoid creating large components, use sub-components in local/componentsfolder
Avoid large hooks, abstract logic intohelpers.tsfiles when sensible
Use arrow functions only for callbacks, not for component declarations
Avoid comments at all times unless the code is very complex
Do not useuseCallbackoruseMemounless asked to optimize a given function
autogpt_platform/frontend/src/**/*.{ts,tsx}: Use function declarations (not arrow functions) for components and handlers
Use type-safe generated API hooks via Orval + React Query for data fetching
Use React Query for server state management and co-locate UI state in components/hooks
Separate render logic (.tsx) from business logic (use*.tshooks)
Use only shadcn/ui (Radix UI primitives) with Tailwind CSS for UI components
Use Phosphor Icons only for all icon implementations
Use ErrorCard component for render errors, toast for mutations, and Sentry for exceptions
Use design system components fromsrc/components/(atoms, molecules, organisms)
Never usesrc/components/__legacy__/*components
Use generated API hooks from@/app/api/__generated__/endpoints/with patternuse{Method}{Version}{OperationName}
Use Tailwind CSS only for styling with design tokens
Do not useuseCallbackoruseMemounless asked to optimize a specific function
Never type withanyunless a variable/attribute can actually be of any type
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/**/*.{js,jsx,ts,tsx,css}
📄 CodeRabbit inference engine (AGENTS.md)
Use Tailwind CSS only for styling, use design tokens, and use Phosphor Icons only
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/src/**/*.ts
📄 CodeRabbit inference engine (AGENTS.md)
Do not type hook returns, let Typescript infer as much as possible
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.ts
autogpt_platform/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
Never type with
any, if no types available useunknown
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/src/**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (autogpt_platform/frontend/CLAUDE.md)
Fully capitalize acronyms in symbols, e.g.
graphID,useBackendAPI
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/src/**/components/**/*.{ts,tsx}
📄 CodeRabbit inference engine (autogpt_platform/frontend/CLAUDE.md)
Put sub-components in a local
components/folder within the feature directory
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/src/**/[A-Z]*/**/*.{ts,tsx}
📄 CodeRabbit inference engine (autogpt_platform/frontend/CLAUDE.md)
Structure components as ComponentName/ComponentName.tsx + useComponentName.ts + helpers.ts
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/src/**/*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
Component props should be
interface Props { ... }(not exported) unless the interface needs to be used outside the componentUse
type Props = { ... }(not exported) for component props unless used outside the component
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
autogpt_platform/frontend/src/app/(platform)/**/*.tsx
📄 CodeRabbit inference engine (AGENTS.md)
If adding protected frontend routes, update
frontend/lib/supabase/middleware.ts
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
🧠 Learnings (14)
📓 Common learnings
Learnt from: majdyz
Repo: Significant-Gravitas/AutoGPT PR: 12213
File: autogpt_platform/frontend/src/app/(platform)/copilot/tools/RunMCPTool/helpers.tsx:23-24
Timestamp: 2026-02-27T10:45:55.700Z
Learning: As of PR `#12213`, MCP tool response types (MCPToolsDiscoveredResponse, MCPToolOutputResponse) are defined in openapi.json and frontend code in autogpt_platform/frontend/src/app/(platform)/copilot/tools/RunMCPTool/helpers.tsx uses the generated types from `@/app/api/__generated__/`. Other tools like RunBlock still use inline TypeScript interfaces (e.g., BlockDetailsResponse) for SSE stream payloads that are not included in openapi.json schemas. The pattern is tool-specific: use generated types when available in openapi.json, use inline types only when the payload schema is truly SSE-stream-only and not exposed via OpenAPI.
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: AGENTS.md:0-0
Timestamp: 2026-02-04T16:50:51.495Z
Learning: Applies to autogpt_platform/frontend/src/**/*.{ts,tsx} : Separate render logic from business logic with component.tsx + useComponent.ts + helpers.ts structure
📚 Learning: 2026-02-27T10:45:55.700Z
Learnt from: majdyz
Repo: Significant-Gravitas/AutoGPT PR: 12213
File: autogpt_platform/frontend/src/app/(platform)/copilot/tools/RunMCPTool/helpers.tsx:23-24
Timestamp: 2026-02-27T10:45:55.700Z
Learning: As of PR `#12213`, MCP tool response types (MCPToolsDiscoveredResponse, MCPToolOutputResponse) are defined in openapi.json and frontend code in autogpt_platform/frontend/src/app/(platform)/copilot/tools/RunMCPTool/helpers.tsx uses the generated types from `@/app/api/__generated__/`. Other tools like RunBlock still use inline TypeScript interfaces (e.g., BlockDetailsResponse) for SSE stream payloads that are not included in openapi.json schemas. The pattern is tool-specific: use generated types when available in openapi.json, use inline types only when the payload schema is truly SSE-stream-only and not exposed via OpenAPI.
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.ts
📚 Learning: 2026-02-04T16:50:51.495Z
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: AGENTS.md:0-0
Timestamp: 2026-02-04T16:50:51.495Z
Learning: Applies to autogpt_platform/frontend/src/**/*.{ts,tsx} : Separate render logic from business logic with component.tsx + useComponent.ts + helpers.ts structure
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-26T21:29:44.105Z
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: autogpt_platform/frontend/CLAUDE.md:0-0
Timestamp: 2026-02-26T21:29:44.105Z
Learning: Applies to autogpt_platform/frontend/src/**/*.{ts,tsx} : Separate render logic (`.tsx`) from business logic (`use*.ts` hooks)
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-04T16:50:51.495Z
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: AGENTS.md:0-0
Timestamp: 2026-02-04T16:50:51.495Z
Learning: Applies to autogpt_platform/frontend/src/**/*.{ts,tsx} : Avoid large hooks, abstract logic into `helpers.ts` files when sensible
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/helpers.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-04T16:49:42.490Z
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: .github/copilot-instructions.md:0-0
Timestamp: 2026-02-04T16:49:42.490Z
Learning: Applies to autogpt_platform/frontend/**/*.{tsx,ts} : Separate render logic from data/behavior in React components; keep comments minimal (code should be self-documenting)
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-04T16:50:51.495Z
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: AGENTS.md:0-0
Timestamp: 2026-02-04T16:50:51.495Z
Learning: Applies to autogpt_platform/frontend/src/**/*.{ts,tsx} : Structure components as `ComponentName/ComponentName.tsx` + `useComponentName.ts` + `helpers.ts` and use design system components from `src/components/` (atoms, molecules, organisms)
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-04T16:50:51.495Z
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: AGENTS.md:0-0
Timestamp: 2026-02-04T16:50:51.495Z
Learning: Applies to autogpt_platform/frontend/src/**/*.{ts,tsx} : Colocate state when possible, avoid creating large components, use sub-components in local `/components` folder
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-04T16:50:51.495Z
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: AGENTS.md:0-0
Timestamp: 2026-02-04T16:50:51.495Z
Learning: Applies to autogpt_platform/frontend/src/**/*.tsx : Component props should be `interface Props { ... }` (not exported) unless the interface needs to be used outside the component
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-26T21:29:44.105Z
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: autogpt_platform/frontend/CLAUDE.md:0-0
Timestamp: 2026-02-26T21:29:44.105Z
Learning: Applies to autogpt_platform/frontend/src/**/use*.ts : Extract component logic into custom hooks grouped by concern, with each hook in its own `.ts` file
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-26T21:29:44.105Z
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: autogpt_platform/frontend/CLAUDE.md:0-0
Timestamp: 2026-02-26T21:29:44.105Z
Learning: Applies to autogpt_platform/frontend/src/**/[A-Z]*/**/*.{ts,tsx} : Structure components as ComponentName/ComponentName.tsx + useComponentName.ts + helpers.ts
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-04T16:49:42.490Z
Learnt from: CR
Repo: Significant-Gravitas/AutoGPT PR: 0
File: .github/copilot-instructions.md:0-0
Timestamp: 2026-02-04T16:49:42.490Z
Learning: Applies to autogpt_platform/frontend/src/components/**/*.{tsx,ts} : Structure React components as: ComponentName/ComponentName.tsx + useComponentName.ts + helpers.ts (exception: small 3-4 line components can be inline; render-only components can be direct files)
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-26T10:12:58.845Z
Learnt from: 0ubbe
Repo: Significant-Gravitas/AutoGPT PR: 12207
File: autogpt_platform/frontend/src/components/ai-elements/conversation.tsx:0-0
Timestamp: 2026-02-26T10:12:58.845Z
Learning: Guideline: Do not apply dark mode CSS classes (e.g., dark:text-*) to copilot UI components until dark mode support is implemented. Applies to all copilot-related components (paths containing /copilot/). When reviewing, search for dark:* class names within copilot components and refactor to use conditional class sets or feature-flag gates, ensuring no dark-mode styles are present in the code paths that render copilot UI unless dark mode support is officially enabled.
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
📚 Learning: 2026-02-27T10:45:49.499Z
Learnt from: majdyz
Repo: Significant-Gravitas/AutoGPT PR: 12213
File: autogpt_platform/frontend/src/app/(platform)/copilot/tools/RunMCPTool/helpers.tsx:23-24
Timestamp: 2026-02-27T10:45:49.499Z
Learning: Prefer using generated OpenAPI types from '@/app/api/__generated__/' for payloads defined in openapi.json (e.g., MCPToolsDiscoveredResponse, MCPToolOutputResponse). Use inline TypeScript interfaces only for payloads that are SSE-stream-only and not exposed via OpenAPI. Apply this pattern to frontend tool components (e.g., RunMCPTool) and related areas where similar SSE/openapi-discrepancies occur; avoid re-implementing types when a generated type is available.
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx
🔇 Additional comments (1)
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatMessagesContainer/ChatMessagesContainer.tsx (1)
11-18: Nice extraction of the render/splitting helpers.Pulling the segmentation and turn-splitting logic into
helpers.tskeeps this component focused on composition.Based on learnings: Applies to autogpt_platform/frontend/src/**/*.{ts,tsx} : Separate render logic from business logic with component.tsx + useComponent.ts + helpers.ts structure
github-project-automation
Bot
moved this from 👍🏼 Mergeable
to ✅ Done
in AutoGPT development kanban
…#12346 ResponseType.clarification_needed, .agent_preview, .agent_saved were renamed to agent_builder_* in the ResponseType refactor; update the new INTERACTIVE_RESPONSE_TYPES set and styleguide to use the correct keys.
…abricated items, add missing links Changes: - Notifications: #12258 → #12364 (correct PR for autopilot notification system) - Reasoning: #12346 → #12282 (collapse repeated tool calls, more accurate) - Improvements: fix pinned tool cards description, add ↗ links to all items - Fixes: replace 6 fabricated/vague items with 6 real PRs from v0.6.51 - Under the hood: fix Mistral model names, add ↗ links to all items
…collapse (Significant-Gravitas#12346) ## Summary <img width="400" height="227" alt="Screenshot 2026-03-09 at 22 43 10" src="https://github.com/user-attachments/assets/0116e260-860d-4466-9763-e02de2766e50" /> <img width="600" height="618" alt="Screenshot 2026-03-09 at 22 43 14" src="https://github.com/user-attachments/assets/beaa6aca-afa8-483f-ac06-439bf162c951" /> - When the copilot stream finishes, tool calls that require user interaction (credentials, inputs, clarification) are now **pinned** outside the "Show reasoning" collapse instead of being hidden - Added `isInteractiveToolPart()` helper that checks tool output's `type` field against a set of interactive response types - Modified `splitReasoningAndResponse()` to extract interactive tools from reasoning into the visible response section - Added styleguide section with 3 demos: `setup_requirements`, `agent_details`, and `agent_saved` pinning scenarios ### Interactive response types kept visible: `setup_requirements`, `agent_details`, `block_details`, `need_login`, `input_validation_error`, `clarification_needed`, `suggested_goal`, `agent_preview`, `agent_saved` Error responses remain in reasoning (LLM explains them in final text). Closes SECRT-2088 ## Test plan - [ ] Verify copilot stream with interactive tool (e.g. run_agent requiring credentials) keeps the tool card visible after stream ends - [ ] Verify non-interactive tools (find_block, bash_exec) still collapse into "Show reasoning" - [ ] Verify styleguide page at `/copilot/styleguide` renders the new "Reasoning Collapse: Interactive Tool Pinning" section correctly - [ ] Verify `pnpm types`, `pnpm lint`, `pnpm format` all pass 🤖 Generated with [Claude Code](https://claude.com/claude-code) ---------
…collapse (Significant-Gravitas#12346) ## Summary <img width="400" height="227" alt="Screenshot 2026-03-09 at 22 43 10" src="https://github.com/user-attachments/assets/0116e260-860d-4466-9763-e02de2766e50" /> <img width="600" height="618" alt="Screenshot 2026-03-09 at 22 43 14" src="https://github.com/user-attachments/assets/beaa6aca-afa8-483f-ac06-439bf162c951" /> - When the copilot stream finishes, tool calls that require user interaction (credentials, inputs, clarification) are now **pinned** outside the "Show reasoning" collapse instead of being hidden - Added `isInteractiveToolPart()` helper that checks tool output's `type` field against a set of interactive response types - Modified `splitReasoningAndResponse()` to extract interactive tools from reasoning into the visible response section - Added styleguide section with 3 demos: `setup_requirements`, `agent_details`, and `agent_saved` pinning scenarios ### Interactive response types kept visible: `setup_requirements`, `agent_details`, `block_details`, `need_login`, `input_validation_error`, `clarification_needed`, `suggested_goal`, `agent_preview`, `agent_saved` Error responses remain in reasoning (LLM explains them in final text). Closes SECRT-2088 ## Test plan - [ ] Verify copilot stream with interactive tool (e.g. run_agent requiring credentials) keeps the tool card visible after stream ends - [ ] Verify non-interactive tools (find_block, bash_exec) still collapse into "Show reasoning" - [ ] Verify styleguide page at `/copilot/styleguide` renders the new "Reasoning Collapse: Interactive Tool Pinning" section correctly - [ ] Verify `pnpm types`, `pnpm lint`, `pnpm format` all pass 🤖 Generated with [Claude Code](https://claude.com/claude-code) ---------
2 participants
Summary
isInteractiveToolPart()helper that checks tool output'stypefield against a set of interactive response typessplitReasoningAndResponse()to extract interactive tools from reasoning into the visible response sectionsetup_requirements,agent_details, andagent_savedpinning scenariosInteractive response types kept visible:
setup_requirements,agent_details,block_details,need_login,input_validation_error,clarification_needed,suggested_goal,agent_preview,agent_savedError responses remain in reasoning (LLM explains them in final text).
Closes SECRT-2088
Test plan
/copilot/styleguiderenders the new "Reasoning Collapse: Interactive Tool Pinning" section correctlypnpm types,pnpm lint,pnpm formatall pass🤖 Generated with Claude Code