feat(platform): add autopilot notification system - #12364
Conversation
Resolve conflict in ChatSidebar.tsx: keep sound toggle from notification branch, rename editing and animated titles from dev, and clearCompletedSession on session click. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add bell icon popover menu with toggle switches for notifications and sound - Request browser permission when enabling notifications; auto-enable on grant - Send system notifications with click-to-navigate to completed chat - Fix is_processing always false (bytes vs string comparison in Redis check) - Add 10s polling to session list so processing state updates in sidebar - Move status icons (processing/completed) inline with chat title - Fix PulseLoader initial flash and hide when session marked completed - Only notify for background sessions (no sound/badge for active chat) - Reset document title when navigating to completed chat - Add clear local data button for debugging - Hide notification banner when notifications already enabled Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
github-project-automation
Bot
moved this to 🆕 Needs initial review
in AutoGPT development kanban
github-actions
Bot
added
platform/frontend
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
WalkthroughAdds browser notification and sound support for Copilot: backend marks sessions as processing, emits copilot_completion events to Redis, and frontend tracks completed sessions, prompts for notification permission, plays sounds, shows banners/dialogs, and displays processing/completed indicators in session lists. Changes
Sequence Diagram(s)sequenceDiagram
participant Browser as Client Browser
participant Frontend as Frontend App
participant WS as WebSocket/Notification Bus
participant Backend as Backend API
participant Redis as Redis
Note over Backend,Redis: session processing lifecycle
Backend->>Redis: set session:<id>:status = "running"
Backend->>Redis: set session:<id>:status = "completed"
Backend->>AsyncRedisNotificationEventBus: publish "copilot_completion" {session_id, status}
Redis->>WS: deliver pub/sub event
WS->>Frontend: "notification" event (copilot_completion)
Frontend->>Frontend: if not activeSession & unseen -> addCompletedSession(session_id)
Frontend->>Browser: play sound / show browser notification (if enabled/allowed)
Frontend->>UI: update session list indicators (is_processing / completed)
Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 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)
📝 Coding Plan for PR comments
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, 5 low risk (out of 7 PRs with file overlap) Auto-generated on push. Ignores: |
|
@kcze can you add screenshots or a video 🎥 better showcasing how this works? |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 5
🧹 Nitpick comments (5)
autogpt_platform/backend/backend/api/model.py (1)
99-101: Consider constrainingstatusto known values.The
statusfield is used with values"completed"or"failed"instream_registry.py. Using aLiteraltype would provide better type safety and documentation.💡 Optional: Use Literal type for status
+from typing import Literal + +CopilotSessionStatus = Literal["completed", "failed"] + class CopilotCompletionPayload(NotificationPayload): session_id: str - status: str + status: CopilotSessionStatus🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@autogpt_platform/backend/backend/api/model.py` around lines 99 - 101, The CopilotCompletionPayload.status field should be constrained to known values to improve type safety; change the type of status in class CopilotCompletionPayload to a Literal (e.g., Literal["completed", "failed"]) or an Enum so callers and consumers (see uses in stream_registry.py expecting "completed" or "failed") are type-checked against those values; update the import from typing (or create an enum) and adjust any instantiations to use the constrained values.autogpt_platform/backend/backend/api/features/chat/routes.py (1)
194-194: Reuse existingconfiginstance instead of creating a new one.
ChatConfig()is already instantiated at the module level (line 58 asconfig). Creating another instance is redundant.♻️ Reuse module-level config
if sessions: from backend.data.redis_client import get_redis_async redis = await get_redis_async() - chat_config = ChatConfig() pipe = redis.pipeline() for session in sessions: pipe.hget( - f"{chat_config.session_meta_prefix}{session.session_id}", + f"{config.session_meta_prefix}{session.session_id}", "status", )🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@autogpt_platform/backend/backend/api/features/chat/routes.py` at line 194, The code instantiates a new ChatConfig with chat_config = ChatConfig(), but a module-level instance named config already exists; replace the new instantiation by reusing that module-level config (e.g., assign chat_config = config or use config directly) so you don't create a redundant ChatConfig instance and ensure all references in the current function use the existing module-level config variable.autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx (3)
412-421: Document title management is duplicated with the notification hook.The PR objectives mention that
useCopilotNotificationshook "updates document.title unread count" and "resets title on focus." Having document.title manipulation here creates two sources of truth. If the title format or logic changes, both locations need updating, risking inconsistencies.Consider moving this title update logic into a centralized helper or exposing it from the store/hook to avoid duplication.
💡 Suggested approach
onClick={() => { handleSelectSession(session.id); if (completedSessionIDs.has(session.id)) { clearCompletedSession(session.id); - const remaining = completedSessionIDs.size - 1; - document.title = - remaining > 0 - ? `(${remaining}) Otto is ready - AutoGPT` - : "AutoGPT"; } }}Then ensure
clearCompletedSessionin the store (or a derived effect) handles the document.title update centrally.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@autogpt_platform/frontend/src/app/`(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx around lines 412 - 421, The document.title update in the ChatSidebar onClick is duplicated with useCopilotNotifications; remove the title-manipulation from the ChatSidebar and centralize it instead by having clearCompletedSession (or a derived effect inside the sessions store) perform the unread-count title update or call a shared helper (e.g., updateDocumentTitle/unreadTitleHelper) so there's a single source of truth; update clearCompletedSession to compute remaining = completedSessionIDs.size - 1 (or use the store's post-removal count) and set document.title accordingly, and ensure handleSelectSession and completedSessionIDs usages no longer touch document.title.
94-95: Consider disabling polling when the tab is hidden.The 10-second polling interval is appropriate for live updates, but it continues when the browser tab is inactive. Consider adding
refetchIntervalInBackground: falseto avoid unnecessary network requests when the user isn't viewing the page.💡 Suggested optimization
const { data: sessionsResponse, isLoading: isLoadingSessions } = - useGetV2ListSessions({ limit: 50 }, { query: { refetchInterval: 10_000 } }); + useGetV2ListSessions({ limit: 50 }, { query: { refetchInterval: 10_000, refetchIntervalInBackground: false } });🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@autogpt_platform/frontend/src/app/`(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx around lines 94 - 95, The polling for sessions is always active because useGetV2ListSessions is called with { query: { refetchInterval: 10_000 } }; update that call to include refetchIntervalInBackground: false in the query options (i.e., useGetV2ListSessions({ limit: 50 }, { query: { refetchInterval: 10_000, refetchIntervalInBackground: false } })) so polling stops when the tab is hidden while preserving the 10s live updates when the tab is active.
339-341: Avoid usingrelative left-6for layout positioning.Using
relative left-6is a positioning hack that can cause maintenance issues and unexpected overlaps. Since the parent already hasflex items-center gap-1, consider using proper flex spacing or margin utilities.♻️ Suggested fix
- <div className="relative left-6"> + <div className="ml-4"> <SidebarTrigger /> </div>🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@autogpt_platform/frontend/src/app/`(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx around lines 339 - 341, Replace the positioning hack on the SidebarTrigger wrapper: remove the "relative left-6" classes and instead use a proper margin/flex utility (e.g., className="ml-6" on the wrapper) or apply an appropriate margin class directly to SidebarTrigger; update the div that wraps SidebarTrigger (the element with SidebarTrigger) to use margin (ml-*) or adjust the parent flex gap rather than using relative left positioning.
🤖 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/MobileDrawer/MobileDrawer.tsx:
- Around line 163-173: The processing indicator can be shown even after we've
recorded a completion; update the conditional that renders PulseLoader inside
MobileDrawer.tsx so it also checks that the session id is not in
completedSessionIDs (i.e., require session.is_processing &&
!completedSessionIDs.has(session.id) && session.id !== currentSessionId) to
suppress the spinner when a client-side completion (completedSessionIDs) is
present; keep the existing CheckCircle rendering as-is so completed sessions
show the green check instead.
In
`@autogpt_platform/frontend/src/app/`(platform)/copilot/components/NotificationBanner/NotificationBanner.tsx:
- Around line 14-19: The component snapshots dismissed from storage only on
mount (dismissed, setDismissed and storage.get with
Key.COPILOT_NOTIFICATION_BANNER_DISMISSED) so calling clearCopilotLocalData()
leaves the mounted component hidden; change this by adding a useEffect that
re-reads storage when the key changes: on mount read storage.get(...) into
setDismissed, add a window.addEventListener('storage', ...) handler to update
setDismissed when the COPILOT_NOTIFICATION_BANNER_DISMISSED key is
removed/changed, and also respond to a custom event (e.g.
'copilot:localDataCleared') that clearCopilotLocalData() should dispatch; apply
the same pattern to NotificationDialog so both components update state when
local data is cleared.
In
`@autogpt_platform/frontend/src/app/`(platform)/copilot/components/NotificationDialog/NotificationDialog.tsx:
- Around line 30-39: The handleEnable function unconditionally calls
Notification.requestPermission() which throws if the Notification API is
undefined; guard the call by checking typeof Notification !== "undefined" (or
!window) before invoking requestPermission, and handle the unsupported case by
either early-returning and setting permission to "denied" or disabling/hiding
the enable button when isOpen is true but Notification is unavailable; update
the handleEnable function and any UI that renders the Enable button (referencing
handleEnable, isOpen, showNotificationDialog, shouldShowAuto) so the API call is
only attempted when Notification exists.
In `@autogpt_platform/frontend/src/app/`(platform)/copilot/store.ts:
- Around line 76-85: clearCopilotLocalData currently only removes persisted keys
and does not reset the in-memory completedSessionIDs set, leaving UI completion
checkmarks and unread counts stale; update clearCopilotLocalData to also clear
or reinitialize the in-memory completedSessionIDs (the variable/collection that
tracks session completions) and any related in-memory counters (e.g., unread
count or ringing state) so the store state is fully reset when calling
clearCopilotLocalData; locate the function clearCopilotLocalData in the store
and add logic to call completedSessionIDs.clear() or set completedSessionIDs =
new Set() and reset any derived flags (like unreadTitleCount/isRinging)
accordingly.
In
`@autogpt_platform/frontend/src/app/`(platform)/copilot/useCopilotNotifications.ts:
- Around line 44-65: Prevent duplicate side effects by checking if the session
ID is already in state.completedSessionIDs and returning early; only call
state.addCompletedSession(sessionID) and run the sound/notification/title update
logic when !state.completedSessionIDs.has(sessionID). Locate the block handling
the session_completed event where state.addCompletedSession, audioRef.current
playback, document.title mutation (using ORIGINAL_TITLE), and the new
Notification are invoked, and move the dedupe check above these side-effects to
bail out on duplicates.
---
Nitpick comments:
In `@autogpt_platform/backend/backend/api/features/chat/routes.py`:
- Line 194: The code instantiates a new ChatConfig with chat_config =
ChatConfig(), but a module-level instance named config already exists; replace
the new instantiation by reusing that module-level config (e.g., assign
chat_config = config or use config directly) so you don't create a redundant
ChatConfig instance and ensure all references in the current function use the
existing module-level config variable.
In `@autogpt_platform/backend/backend/api/model.py`:
- Around line 99-101: The CopilotCompletionPayload.status field should be
constrained to known values to improve type safety; change the type of status in
class CopilotCompletionPayload to a Literal (e.g., Literal["completed",
"failed"]) or an Enum so callers and consumers (see uses in stream_registry.py
expecting "completed" or "failed") are type-checked against those values; update
the import from typing (or create an enum) and adjust any instantiations to use
the constrained values.
In
`@autogpt_platform/frontend/src/app/`(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx:
- Around line 412-421: The document.title update in the ChatSidebar onClick is
duplicated with useCopilotNotifications; remove the title-manipulation from the
ChatSidebar and centralize it instead by having clearCompletedSession (or a
derived effect inside the sessions store) perform the unread-count title update
or call a shared helper (e.g., updateDocumentTitle/unreadTitleHelper) so there's
a single source of truth; update clearCompletedSession to compute remaining =
completedSessionIDs.size - 1 (or use the store's post-removal count) and set
document.title accordingly, and ensure handleSelectSession and
completedSessionIDs usages no longer touch document.title.
- Around line 94-95: The polling for sessions is always active because
useGetV2ListSessions is called with { query: { refetchInterval: 10_000 } };
update that call to include refetchIntervalInBackground: false in the query
options (i.e., useGetV2ListSessions({ limit: 50 }, { query: { refetchInterval:
10_000, refetchIntervalInBackground: false } })) so polling stops when the tab
is hidden while preserving the 10s live updates when the tab is active.
- Around line 339-341: Replace the positioning hack on the SidebarTrigger
wrapper: remove the "relative left-6" classes and instead use a proper
margin/flex utility (e.g., className="ml-6" on the wrapper) or apply an
appropriate margin class directly to SidebarTrigger; update the div that wraps
SidebarTrigger (the element with SidebarTrigger) to use margin (ml-*) or adjust
the parent flex gap rather than using relative left positioning.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 3849b1d0-223b-4bf2-ad0a-f5335903b10e
📒 Files selected for processing (14)
autogpt_platform/backend/backend/api/features/chat/routes.pyautogpt_platform/backend/backend/api/model.pyautogpt_platform/backend/backend/copilot/stream_registry.pyautogpt_platform/frontend/src/app/(platform)/copilot/CopilotPage.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/PulseLoader/PulseLoader.module.cssautogpt_platform/frontend/src/app/(platform)/copilot/store.tsautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.tsautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/api/openapi.jsonautogpt_platform/frontend/src/services/storage/local-storage.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). (9)
- GitHub Check: types
- GitHub Check: Seer Code Review
- GitHub Check: end-to-end tests
- GitHub Check: test (3.12)
- GitHub Check: test (3.13)
- GitHub Check: test (3.11)
- GitHub Check: Analyze (python)
- GitHub Check: Analyze (typescript)
- GitHub Check: Check PR Status
🧰 Additional context used
📓 Path-based instructions (20)
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/CopilotPage.tsxautogpt_platform/frontend/src/services/storage/local-storage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/store.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/CopilotPage.tsxautogpt_platform/frontend/src/services/storage/local-storage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/store.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/CopilotPage.tsxautogpt_platform/frontend/src/services/storage/local-storage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/store.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/CopilotPage.tsxautogpt_platform/frontend/src/services/storage/local-storage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/store.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/CopilotPage.tsxautogpt_platform/frontend/src/services/storage/local-storage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/store.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/CopilotPage.tsxautogpt_platform/frontend/src/services/storage/local-storage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/store.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/PulseLoader/PulseLoader.module.cssautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/CopilotPage.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx
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/CopilotPage.tsxautogpt_platform/frontend/src/services/storage/local-storage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/store.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/CopilotPage.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/CopilotPage.tsxautogpt_platform/frontend/src/services/storage/local-storage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/store.tsautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/services/storage/local-storage.tsautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.tsautogpt_platform/frontend/src/app/(platform)/copilot/store.ts
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/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx
autogpt_platform/frontend/src/**/use*.ts
📄 CodeRabbit inference engine (autogpt_platform/frontend/CLAUDE.md)
autogpt_platform/frontend/src/**/use*.ts: Extract component logic into custom hooks grouped by concern, with each hook in its own.tsfile
Do not type hook returns; let TypeScript infer types as much as possible
Files:
autogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.ts
autogpt_platform/backend/**/*.py
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
autogpt_platform/backend/**/*.py: Use Python 3.11 (required; managed by Poetry via pyproject.toml) for backend development
Always run 'poetry run format' (Black + isort) before linting in backend development
Always run 'poetry run lint' (ruff) after formatting in backend development
Files:
autogpt_platform/backend/backend/api/features/chat/routes.pyautogpt_platform/backend/backend/api/model.pyautogpt_platform/backend/backend/copilot/stream_registry.py
autogpt_platform/backend/backend/api/features/**/*.py
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
Update routes in '/backend/backend/api/features/' and add/update Pydantic models in the same directory for API development
When modifying API routes, update corresponding Pydantic models in the same directory and write tests alongside the route file
Files:
autogpt_platform/backend/backend/api/features/chat/routes.py
autogpt_platform/backend/**/*.{py,txt}
📄 CodeRabbit inference engine (autogpt_platform/backend/CLAUDE.md)
Use
poetry runprefix for all Python commands, including testing, linting, formatting, and migrations
Files:
autogpt_platform/backend/backend/api/features/chat/routes.pyautogpt_platform/backend/backend/api/model.pyautogpt_platform/backend/backend/copilot/stream_registry.py
autogpt_platform/backend/backend/api/**/*.py
📄 CodeRabbit inference engine (autogpt_platform/backend/CLAUDE.md)
autogpt_platform/backend/backend/api/**/*.py: Use FastAPI for building REST and WebSocket endpoints
Use JWT-based authentication with Supabase integration
Files:
autogpt_platform/backend/backend/api/features/chat/routes.pyautogpt_platform/backend/backend/api/model.py
autogpt_platform/backend/backend/**/*.py
📄 CodeRabbit inference engine (autogpt_platform/backend/CLAUDE.md)
Use Prisma ORM for database operations in PostgreSQL with pgvector for embeddings
Files:
autogpt_platform/backend/backend/api/features/chat/routes.pyautogpt_platform/backend/backend/api/model.pyautogpt_platform/backend/backend/copilot/stream_registry.py
autogpt_platform/**/*.py
📄 CodeRabbit inference engine (AGENTS.md)
Format Python code with
poetry run format
Files:
autogpt_platform/backend/backend/api/features/chat/routes.pyautogpt_platform/backend/backend/api/model.pyautogpt_platform/backend/backend/copilot/stream_registry.py
🧠 Learnings (25)
📚 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} : Use '<ErrorCard />' component for rendering errors in frontend UI; use toast notifications for mutation errors; use 'Sentry.captureException()' for manual exceptions
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/CopilotPage.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.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} : Use ErrorCard component for render errors, toast for mutations, and Sentry for exceptions
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/CopilotPage.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.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/CopilotPage.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx
📚 Learning: 2026-02-26T10:13:22.013Z
Learnt from: 0ubbe
Repo: Significant-Gravitas/AutoGPT PR: 12207
File: autogpt_platform/frontend/src/components/ai-elements/message.tsx:48-49
Timestamp: 2026-02-26T10:13:22.013Z
Learning: The copilot frontend (autogpt_platform/frontend/src/app/(platform)/copilot) does not currently support dark mode. Dark mode CSS variants in copilot components are unnecessary until dark mode support is explicitly added to the copilot feature.
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/CopilotPage.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.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/app/(platform)/**/page.tsx : Create pages in `src/app/(platform)/feature-name/page.tsx` with a `usePageName.ts` hook for logic and sub-components in local `components/` folder
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/CopilotPage.tsxautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.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/**/*.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/CopilotPage.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/app/(platform)/*/page.tsx : Create pages in `src/app/(platform)/feature-name/page.tsx`
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/CopilotPage.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/CopilotPage.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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} : Use generated API hooks from `@/app/api/__generated__/endpoints/` with pattern `use{Method}{Version}{OperationName}`
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.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} : Use generated API hooks from `@/app/api/__generated__/endpoints/` with pattern `use{Method}{Version}{OperationName}` and regenerate with `pnpm generate:api`
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.ts
📚 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} : Use generated API hooks from '@/app/api/__generated__/endpoints/' instead of deprecated 'BackendAPI' or 'src/lib/autogpt-server-api/*'
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.ts
📚 Learning: 2026-02-26T10:13:08.051Z
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:13:08.051Z
Learning: The copilot feature in autogpt_platform/frontend/src/app/(platform)/copilot does not currently support dark mode, so dark mode CSS classes (like dark:text-neutral-400) should not be added to copilot components until dark mode support is implemented.
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.ts
📚 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} : Use PascalCase for component names and camelCase with 'use' prefix for hook names in React
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/useCopilotPage.tsautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.ts
📚 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} : Only use Phosphor Icons (phosphor-icons/react) for icons in frontend components
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.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} : Use design system components from 'src/components/' (atoms, molecules, organisms) in frontend development
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.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} : Use design system components from `src/components/` (atoms, molecules, organisms)
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.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/useCopilotNotifications.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} : 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/store.ts
📚 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/backend/backend/api/features/**/*.py : Update routes in '/backend/backend/api/features/' and add/update Pydantic models in the same directory for API development
Applied to files:
autogpt_platform/backend/backend/api/features/chat/routes.py
📚 Learning: 2026-02-26T17:02:22.448Z
Learnt from: Pwuts
Repo: Significant-Gravitas/AutoGPT PR: 12211
File: .pre-commit-config.yaml:160-179
Timestamp: 2026-02-26T17:02:22.448Z
Learning: Keep the pre-commit hook pattern broad for autogpt_platform/backend to ensure OpenAPI schema changes are captured. Do not narrow to backend/api/ alone, since the generated schema depends on Pydantic models across multiple directories (backend/data/, backend/blocks/, backend/copilot/, backend/integrations/, backend/util/). Narrowing could miss schema changes and cause frontend type desynchronization.
Applied to files:
autogpt_platform/backend/backend/api/features/chat/routes.pyautogpt_platform/backend/backend/api/model.pyautogpt_platform/backend/backend/copilot/stream_registry.py
📚 Learning: 2026-03-05T15:42:08.207Z
Learnt from: ntindle
Repo: Significant-Gravitas/AutoGPT PR: 12297
File: .claude/skills/backend-check/SKILL.md:14-16
Timestamp: 2026-03-05T15:42:08.207Z
Learning: In Python files under autogpt_platform/backend (recursively), rely on poetry run format to perform formatting (Black + isort) and linting (ruff). Do not run poetry run lint as a separate step after poetry run format, since format already includes linting checks.
Applied to files:
autogpt_platform/backend/backend/api/features/chat/routes.pyautogpt_platform/backend/backend/api/model.pyautogpt_platform/backend/backend/copilot/stream_registry.py
📚 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/**/*.{js,jsx,ts,tsx,css} : Use Tailwind CSS only for styling, use design tokens, and use Phosphor Icons only
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/PulseLoader/PulseLoader.module.css
📚 Learning: 2026-03-04T08:04:35.881Z
Learnt from: majdyz
Repo: Significant-Gravitas/AutoGPT PR: 12273
File: autogpt_platform/backend/backend/copilot/tools/workspace_files.py:216-220
Timestamp: 2026-03-04T08:04:35.881Z
Learning: In the AutoGPT Copilot backend, ensure that SVG images are not treated as vision image types by excluding 'image/svg+xml' from INLINEABLE_MIME_TYPES and MULTIMODAL_TYPES in tool_adapter.py; the Claude API supports PNG, JPEG, GIF, and WebP for vision. SVGs (XML text) should be handled via the text path instead, not the vision path.
Applied to files:
autogpt_platform/backend/backend/copilot/stream_registry.py
📚 Learning: 2026-03-01T07:58:56.207Z
Learnt from: majdyz
Repo: Significant-Gravitas/AutoGPT PR: 12213
File: autogpt_platform/frontend/src/app/api/openapi.json:10030-10037
Timestamp: 2026-03-01T07:58:56.207Z
Learning: When a backend field represents sensitive data, use a secret type (e.g., Pydantic SecretStr with length constraints) so OpenAPI marks it as a password/writeOnly field. Apply this pattern to similar sensitive request fields across API schemas so generated TypeScript clients and docs treat them as secrets and do not mishandle sensitivity. Review all openapi.jsons where sensitive inputs are defined and replace plain strings with SecretStr-like semantics with appropriate minLength constraints.
Applied to files:
autogpt_platform/frontend/src/app/api/openapi.json
📚 Learning: 2026-03-07T07:43:09.871Z
Learnt from: kcze
Repo: Significant-Gravitas/AutoGPT PR: 12328
File: autogpt_platform/frontend/src/app/api/openapi.json:1116-1118
Timestamp: 2026-03-07T07:43:09.871Z
Learning: For autogpt_platform/frontend/src/app/api/openapi.json, preserve the existing behavior: HTTPBearerJWT is declared at the router level with Depends(auth.get_user_id) returning None for unauthenticated users; treat as optional auth. Do not change per-operation security descriptions unless you plan a repo-wide OpenAPI update. If you change this file, prefer clarifying operation descriptions rather than altering security requirements.
Applied to files:
autogpt_platform/frontend/src/app/api/openapi.json
🔇 Additional comments (11)
autogpt_platform/frontend/src/app/(platform)/copilot/components/PulseLoader/PulseLoader.module.css (1)
18-34: Animation refinements look good.The changes improve the ripple animation by:
- Initializing pseudo-elements at
scale(0)andopacity: 0to prevent a flash on mount.- Adding a 50% keyframe with
opacity: 0.3for a smoother fade-out effect.While the coding guidelines specify "Tailwind CSS only for styling," CSS modules are a reasonable exception for complex keyframe animations with pseudo-elements, which are difficult to express purely in Tailwind utility classes.
autogpt_platform/backend/backend/copilot/stream_registry.py (2)
748-752: LGTM on the conditional checks.The guard conditions properly ensure:
metaexists before parsing (avoids errors on expired/missing sessions).parsed.user_idis truthy before publishing (anonymous sessions correctly excluded from notifications).The non-blocking error handling with warning-level logging is appropriate for this optional notification feature.
760-771: No resource leak concern for publish-only usage.The
AsyncRedisNotificationEventBus.close()method only closes PubSub subscriptions created bylisten(), not the connection used bypublish(). Thepublish()method uses a pooled global Redis connection that is managed separately. Callingclose()after a singlepublish()operation would be a no-op sinceself._pubsubwould beNone. The cleanup pattern shown inws_api.pyis necessary there because it uses bothlisten()(which creates a persistent PubSub connection) andpublish(), but it is not required for publish-only operations like this one.> Likely an incorrect or invalid review comment.autogpt_platform/backend/backend/api/features/chat/routes.py (2)
188-206: Batch Redis lookup for processing status is well implemented.The pipeline approach efficiently checks all session statuses in a single round-trip. The set-based lookup on line 215 provides O(1) membership testing.
One minor note: if
statusescontainsNonefor sessions without metadata (TTL expired), those will correctly be excluded fromprocessing_setsinceNone != "running".
129-129: LGTM on the newis_processingfield.The default value of
Falseis appropriate, ensuring backward compatibility for clients that don't yet handle this field.autogpt_platform/frontend/src/app/api/openapi.json (1)
11803-11808: Looks good.Adding
is_processingtoSessionSummaryResponsekeeps the generated schema aligned with the new session-list processing indicator flow.autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx (5)
26-47: LGTM!Imports follow the coding guidelines: Phosphor Icons for icons, design system components from
src/components/, and generated API hooks.
53-64: LGTM!Store destructuring aligns with the MobileDrawer component pattern and provides the necessary state for notification features.
66-90: LGTM!The notification toggle handler correctly checks for browser support, requests permission, and provides appropriate user feedback via toasts. The function declaration style aligns with coding guidelines.
453-464: LGTM!The indicator logic correctly prevents showing both PulseLoader and CheckCircle simultaneously, and hides indicators for the active session. The pattern is consistent with MobileDrawer.
449-451: Theupdated_atfield is a required field onSessionSummaryResponse(defined inautogpt_platform/backend/backend/api/features/chat/routes.py:127asupdated_at: str). No fallback or null-checking is needed; the code is correct.
…ations - Deduplicate session_completed events to prevent duplicate sounds/notifications on WS replay - Hide PulseLoader in MobileDrawer when session already marked completed - Guard NotificationDialog handleEnable against missing Notification API - Clear completedSessionIDs and reset document title in clearCopilotLocalData - Re-read dismissed state in Banner/Dialog when notifications are toggled off Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
There was a problem hiding this comment.
🧹 Nitpick comments (1)
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsx (1)
82-96: UseButtoncomponent for consistency with the adjacent close button.The sound toggle uses a plain
<button>element while the close button (lines 97-104) uses the design system<Button variant="icon" size="icon">. For UI consistency and maintainability, use the sameButtoncomponent.♻️ Proposed fix
- <button + <Button + variant="icon" + size="icon" onClick={toggleSound} - className="rounded p-1.5 text-zinc-400 transition-colors hover:text-zinc-600" aria-label={ isSoundEnabled ? "Disable notification sound" : "Enable notification sound" } > {isSoundEnabled ? ( - <SpeakerHigh className="h-4 w-4" /> + <SpeakerHigh width="1rem" height="1rem" /> ) : ( - <SpeakerSlash className="h-4 w-4" /> + <SpeakerSlash width="1rem" height="1rem" /> )} - </button> + </Button>As per coding guidelines: "Use design system components from
src/components/(atoms, molecules, organisms) in frontend development."🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@autogpt_platform/frontend/src/app/`(platform)/copilot/components/MobileDrawer/MobileDrawer.tsx around lines 82 - 96, Replace the plain <button> used for sound toggling with the design-system Button component to match the adjacent close button: use Button with variant="icon" and size="icon", wire its onClick to the existing toggleSound handler, keep the aria-label logic based on isSoundEnabled, and render SpeakerHigh / SpeakerSlash inside the Button so the visual and accessibility behavior (toggleSound, isSoundEnabled, SpeakerHigh, SpeakerSlash) remains unchanged.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In
`@autogpt_platform/frontend/src/app/`(platform)/copilot/components/MobileDrawer/MobileDrawer.tsx:
- Around line 82-96: Replace the plain <button> used for sound toggling with the
design-system Button component to match the adjacent close button: use Button
with variant="icon" and size="icon", wire its onClick to the existing
toggleSound handler, keep the aria-label logic based on isSoundEnabled, and
render SpeakerHigh / SpeakerSlash inside the Button so the visual and
accessibility behavior (toggleSound, isSoundEnabled, SpeakerHigh, SpeakerSlash)
remains unchanged.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 82803b87-2623-4175-9a5f-95f7a2850f4c
📒 Files selected for processing (5)
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsxautogpt_platform/frontend/src/app/(platform)/copilot/store.tsautogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.ts
🚧 Files skipped from review as they are similar to previous changes (4)
- autogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationBanner/NotificationBanner.tsx
- autogpt_platform/frontend/src/app/(platform)/copilot/useCopilotNotifications.ts
- autogpt_platform/frontend/src/app/(platform)/copilot/store.ts
- autogpt_platform/frontend/src/app/(platform)/copilot/components/NotificationDialog/NotificationDialog.tsx
📜 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). (8)
- GitHub Check: types
- GitHub Check: Seer Code Review
- GitHub Check: end-to-end tests
- GitHub Check: test (3.13)
- GitHub Check: test (3.11)
- GitHub Check: test (3.12)
- GitHub Check: Analyze (python)
- GitHub Check: Check PR Status
🧰 Additional context used
📓 Path-based instructions (12)
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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.tsx
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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.tsx
🧠 Learnings (6)
📓 Common learnings
Learnt from: Pwuts
Repo: Significant-Gravitas/AutoGPT PR: 12284
File: autogpt_platform/frontend/src/app/api/openapi.json:11897-11900
Timestamp: 2026-03-04T23:58:18.476Z
Learning: Repo: Significant-Gravitas/AutoGPT — PR `#12284`
Backend/frontend OpenAPI codegen convention: In backend/api/features/store/model.py, the StoreSubmission and StoreSubmissionAdminView models define submitted_at: datetime | None, changes_summary: str | None, and instructions: str | None with no default. This is intentional to produce “required but nullable” fields in OpenAPI (properties appear in required[] and use anyOf [type, null]). This matches Prisma’s submittedAt DateTime? and changesSummary String?. Do not flag this as a required/nullable mismatch.
📚 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} : Only use Phosphor Icons (phosphor-icons/react) for icons in frontend components
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.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} : Use design system components from 'src/components/' (atoms, molecules, organisms) in frontend development
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.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} : Use design system components from `src/components/` (atoms, molecules, organisms)
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.tsx
🔇 Additional comments (4)
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsx (4)
6-16: LGTM!Imports are well-organized and correctly use Phosphor Icons as required by the coding guidelines.
64-70: LGTM!Store integration is clean and extracts only the needed state and actions.
137-142: LGTM!The click handler correctly selects the session first, then clears the completion status only when applicable. The conditional check avoids unnecessary store updates.
151-175: LGTM!The processing and completion indicator logic is correct. The conditions are mutually exclusive and properly handle the polling delay by using client-side completion state (
completedSessionIDs) to suppress the staleis_processingindicator. Current session correctly shows no indicators.
majdyz
left a comment
majdyz
left a comment
There was a problem hiding this comment.
🤖 Code review — several code-style violations and logic bugs below.
…5-autopilot-notifications
…5-autopilot-notifications
There was a problem hiding this comment.
Actionable comments posted: 2
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
autogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx (1)
100-107:⚠️ Potential issue | 🟡 MinorClear deleted sessions out of the local completion set.
If a background chat completes and the user deletes it from the overflow menu, this success path removes it from the list but leaves its ID in
completedSessionIDs. That makes the unread/completion state drift from the sessions that still exist.Proposed fix
onSuccess: () => { + if (sessionToDelete?.id) { + clearCompletedSession(sessionToDelete.id); + } queryClient.invalidateQueries({ queryKey: getGetV2ListSessionsQueryKey(), }); if (sessionToDelete?.id === sessionId) { setSessionId(null); } setSessionToDelete(null); },🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@autogpt_platform/frontend/src/app/`(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx around lines 100 - 107, The onSuccess handler must also remove the deleted session ID from the local completed sessions set to keep completion/unread state in sync: update the handler in ChatSidebar.tsx (the function containing getGetV2ListSessionsQueryKey, setSessionId, setSessionToDelete) to, when a session is deleted (sessionToDelete?.id), call the completedSessionIDs setter (e.g., setCompletedSessionIDs) to filter out that ID from the array/set (remove any entries equal to sessionToDelete.id or sessionId), then continue clearing sessionId and sessionToDelete as before.
🧹 Nitpick comments (1)
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsx (1)
82-104: Consider using the design systemButtonfor the sound toggle.The sound toggle uses a plain
<button>with custom Tailwind classes, while the adjacent close button uses<Button variant="icon" size="icon">. Using the same component for both would improve consistency and ensure unified styling/behavior.Suggested fix
- <button + <Button + variant="icon" + size="icon" onClick={toggleSound} - className="rounded p-1.5 text-zinc-400 transition-colors hover:text-zinc-600" aria-label={ isSoundEnabled ? "Disable notification sound" : "Enable notification sound" } > {isSoundEnabled ? ( - <SpeakerHigh className="h-4 w-4" /> + <SpeakerHigh width="1rem" height="1rem" /> ) : ( - <SpeakerSlash className="h-4 w-4" /> + <SpeakerSlash width="1rem" height="1rem" /> )} - </button> + </Button>As per coding guidelines: "Use design system components from 'src/components/' (atoms, molecules, organisms) in frontend development."
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@autogpt_platform/frontend/src/app/`(platform)/copilot/components/MobileDrawer/MobileDrawer.tsx around lines 82 - 104, Replace the plain <button> sound toggle with the design-system Button component to match the close button: use Button (variant="icon", size="icon") instead of the raw element, wire its onClick to toggleSound, set the aria-label based on isSoundEnabled ("Disable notification sound" / "Enable notification sound"), and render SpeakerHigh or SpeakerSlash as the Button child (same icons already used); remove the custom Tailwind classes currently applied to the raw button so the Button's styling/behavior is used consistently with the existing close Button.
🤖 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/backend/backend/api/features/chat/routes.py`:
- Around line 189-207: The Redis probe for active stream status (using
get_redis_async, ChatConfig, redis.pipeline(), pipe.execute()) must be made
resilient: move the import of get_redis_async to the top of the module, then
wrap the entire block that obtains redis, builds the pipeline, executes
pipe.execute(), and computes processing_set in a try/except; on any exception
set processing_set = set() (leaving the rest of list_sessions behavior intact)
and log the exception for diagnostics so the endpoint still returns sessions
without processing indicators when Redis is down or slow.
In
`@autogpt_platform/frontend/src/app/`(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx:
- Around line 416-425: The click handler on the sidebar row
(handleSelectSession) currently calls clearCompletedSession(session.id) and
updates document.title, which misses other navigation paths that set
?sessionId=...; remove the clearCompletedSession and title-updating logic from
the onClick and instead add a single effect that watches the active sessionId
(from the router/search params or the prop/state used by ChatSidebar) and when
it changes to an id present in completedSessionIDs call
clearCompletedSession(sessionId) and update document.title based on
completedSessionIDs.size; reference the existing symbols handleSelectSession,
clearCompletedSession, completedSessionIDs and document.title and implement the
new behavior in a useEffect (or equivalent) that reacts to sessionId changes so
all navigation flows behave the same.
---
Outside diff comments:
In
`@autogpt_platform/frontend/src/app/`(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx:
- Around line 100-107: The onSuccess handler must also remove the deleted
session ID from the local completed sessions set to keep completion/unread state
in sync: update the handler in ChatSidebar.tsx (the function containing
getGetV2ListSessionsQueryKey, setSessionId, setSessionToDelete) to, when a
session is deleted (sessionToDelete?.id), call the completedSessionIDs setter
(e.g., setCompletedSessionIDs) to filter out that ID from the array/set (remove
any entries equal to sessionToDelete.id or sessionId), then continue clearing
sessionId and sessionToDelete as before.
---
Nitpick comments:
In
`@autogpt_platform/frontend/src/app/`(platform)/copilot/components/MobileDrawer/MobileDrawer.tsx:
- Around line 82-104: Replace the plain <button> sound toggle with the
design-system Button component to match the close button: use Button
(variant="icon", size="icon") instead of the raw element, wire its onClick to
toggleSound, set the aria-label based on isSoundEnabled ("Disable notification
sound" / "Enable notification sound"), and render SpeakerHigh or SpeakerSlash as
the Button child (same icons already used); remove the custom Tailwind classes
currently applied to the raw button so the Button's styling/behavior is used
consistently with the existing close Button.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 59ecd6a0-88df-4aa4-b377-2e286be42ebd
📒 Files selected for processing (4)
autogpt_platform/backend/backend/api/features/chat/routes.pyautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/api/openapi.json
📜 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). (9)
- GitHub Check: types
- GitHub Check: Seer Code Review
- GitHub Check: test (3.13)
- GitHub Check: test (3.11)
- GitHub Check: test (3.12)
- GitHub Check: Analyze (python)
- GitHub Check: Check PR Status
- GitHub Check: Analyze (typescript)
- GitHub Check: end-to-end tests
🧰 Additional context used
📓 Path-based instructions (18)
autogpt_platform/backend/**/*.py
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
autogpt_platform/backend/**/*.py: Use Python 3.11 (required; managed by Poetry via pyproject.toml) for backend development
Always run 'poetry run format' (Black + isort) before linting in backend development
Always run 'poetry run lint' (ruff) after formatting in backend development
Files:
autogpt_platform/backend/backend/api/features/chat/routes.py
autogpt_platform/backend/backend/api/features/**/*.py
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
Update routes in '/backend/backend/api/features/' and add/update Pydantic models in the same directory for API development
When modifying API routes, update corresponding Pydantic models in the same directory and write tests alongside the route file
Files:
autogpt_platform/backend/backend/api/features/chat/routes.py
autogpt_platform/backend/**/*.{py,txt}
📄 CodeRabbit inference engine (autogpt_platform/backend/CLAUDE.md)
Use
poetry runprefix for all Python commands, including testing, linting, formatting, and migrations
Files:
autogpt_platform/backend/backend/api/features/chat/routes.py
autogpt_platform/backend/backend/api/**/*.py
📄 CodeRabbit inference engine (autogpt_platform/backend/CLAUDE.md)
autogpt_platform/backend/backend/api/**/*.py: Use FastAPI for building REST and WebSocket endpoints
Use JWT-based authentication with Supabase integration
Files:
autogpt_platform/backend/backend/api/features/chat/routes.py
autogpt_platform/backend/backend/**/*.py
📄 CodeRabbit inference engine (autogpt_platform/backend/CLAUDE.md)
Use Prisma ORM for database operations in PostgreSQL with pgvector for embeddings
Files:
autogpt_platform/backend/backend/api/features/chat/routes.py
autogpt_platform/**/*.py
📄 CodeRabbit inference engine (AGENTS.md)
Format Python code with
poetry run format
Files:
autogpt_platform/backend/backend/api/features/chat/routes.py
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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx
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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx
🧠 Learnings (15)
📓 Common learnings
Learnt from: Pwuts
Repo: Significant-Gravitas/AutoGPT PR: 12284
File: autogpt_platform/frontend/src/app/api/openapi.json:11897-11900
Timestamp: 2026-03-04T23:58:18.476Z
Learning: Repo: Significant-Gravitas/AutoGPT — PR `#12284`
Backend/frontend OpenAPI codegen convention: In backend/api/features/store/model.py, the StoreSubmission and StoreSubmissionAdminView models define submitted_at: datetime | None, changes_summary: str | None, and instructions: str | None with no default. This is intentional to produce “required but nullable” fields in OpenAPI (properties appear in required[] and use anyOf [type, null]). This matches Prisma’s submittedAt DateTime? and changesSummary String?. Do not flag this as a required/nullable mismatch.
📚 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/backend/backend/api/features/**/*.py : Update routes in '/backend/backend/api/features/' and add/update Pydantic models in the same directory for API development
Applied to files:
autogpt_platform/backend/backend/api/features/chat/routes.py
📚 Learning: 2026-02-26T17:02:22.448Z
Learnt from: Pwuts
Repo: Significant-Gravitas/AutoGPT PR: 12211
File: .pre-commit-config.yaml:160-179
Timestamp: 2026-02-26T17:02:22.448Z
Learning: Keep the pre-commit hook pattern broad for autogpt_platform/backend to ensure OpenAPI schema changes are captured. Do not narrow to backend/api/ alone, since the generated schema depends on Pydantic models across multiple directories (backend/data/, backend/blocks/, backend/copilot/, backend/integrations/, backend/util/). Narrowing could miss schema changes and cause frontend type desynchronization.
Applied to files:
autogpt_platform/backend/backend/api/features/chat/routes.py
📚 Learning: 2026-03-05T15:42:08.207Z
Learnt from: ntindle
Repo: Significant-Gravitas/AutoGPT PR: 12297
File: .claude/skills/backend-check/SKILL.md:14-16
Timestamp: 2026-03-05T15:42:08.207Z
Learning: In Python files under autogpt_platform/backend (recursively), rely on poetry run format to perform formatting (Black + isort) and linting (ruff). Do not run poetry run lint as a separate step after poetry run format, since format already includes linting checks.
Applied to files:
autogpt_platform/backend/backend/api/features/chat/routes.py
📚 Learning: 2026-03-11T08:40:53.404Z
Learnt from: kcze
Repo: Significant-Gravitas/AutoGPT PR: 12328
File: autogpt_platform/frontend/src/app/(platform)/copilot/useLoadMoreMessages.ts:49-61
Timestamp: 2026-03-11T08:40:53.404Z
Learning: In `autogpt_platform/frontend/src/app/(platform)/copilot/useLoadMoreMessages.ts`, clearing `olderMessages` (and resetting `oldestSequence`/`hasMore`) when `initialOldestSequence` shifts on the same session is intentional. Pages already fetched were based on a now-stale cursor; retaining them risks sequence gaps or duplicates. `ScrollPreserver` keeps the currently visible viewport intact, so only unvisited older pages are dropped. This is a deliberate safe-refetch design tradeoff.
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsx
📚 Learning: 2026-03-04T23:58:18.476Z
Learnt from: Pwuts
Repo: Significant-Gravitas/AutoGPT PR: 12284
File: autogpt_platform/frontend/src/app/api/openapi.json:11897-11900
Timestamp: 2026-03-04T23:58:18.476Z
Learning: Repo: Significant-Gravitas/AutoGPT — PR `#12284`
Backend/frontend OpenAPI codegen convention: In backend/api/features/store/model.py, the StoreSubmission and StoreSubmissionAdminView models define submitted_at: datetime | None, changes_summary: str | None, and instructions: str | None with no default. This is intentional to produce “required but nullable” fields in OpenAPI (properties appear in required[] and use anyOf [type, null]). This matches Prisma’s submittedAt DateTime? and changesSummary String?. Do not flag this as a required/nullable mismatch.
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/api/openapi.json
📚 Learning: 2026-03-10T08:39:13.707Z
Learnt from: majdyz
Repo: Significant-Gravitas/AutoGPT PR: 12356
File: autogpt_platform/backend/backend/copilot/constants.py:9-12
Timestamp: 2026-03-10T08:39:13.707Z
Learning: In Significant-Gravitas/AutoGPT PR `#12356`, the `COPILOT_SYNTHETIC_ID_PREFIX = "copilot-"` check in `create_auto_approval_record` (human_review.py) is intentional and safe. The `graph_exec_id` passed to this function comes from server-side `PendingHumanReview` DB records (not from user input); the API only accepts `node_exec_id` from users. Synthetic `copilot-*` IDs are only ever created server-side in `run_block.py`. The prefix skip avoids a DB lookup for a `AgentGraphExecution` record that legitimately does not exist for CoPilot sessions, while `user_id` scoping is enforced at the auth layer and on the resulting auto-approval record.
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsx
📚 Learning: 2026-03-10T08:38:30.834Z
Learnt from: majdyz
Repo: Significant-Gravitas/AutoGPT PR: 12356
File: autogpt_platform/backend/backend/copilot/tools/run_block.py:349-370
Timestamp: 2026-03-10T08:38:30.834Z
Learning: In the AutoGPT CoPilot HITL (Human-In-The-Loop) flow (`autogpt_platform/backend/backend/copilot/tools/run_block.py`), the review card presented to users sets `editable: false`, meaning reviewers cannot modify the input payload. Therefore, credentials resolved before `is_block_exec_need_review()` remain valid and do not need to be recomputed after the review step — the original `input_data` is unchanged through the review lifecycle.
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.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} : Only use Phosphor Icons (phosphor-icons/react) for icons in frontend components
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.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} : Use design system components from 'src/components/' (atoms, molecules, organisms) in frontend development
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.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} : Use design system components from `src/components/` (atoms, molecules, organisms)
Applied to files:
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.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/MobileDrawer/MobileDrawer.tsxautogpt_platform/frontend/src/app/(platform)/copilot/components/ChatSidebar/ChatSidebar.tsx
📚 Learning: 2026-03-01T07:58:56.207Z
Learnt from: majdyz
Repo: Significant-Gravitas/AutoGPT PR: 12213
File: autogpt_platform/frontend/src/app/api/openapi.json:10030-10037
Timestamp: 2026-03-01T07:58:56.207Z
Learning: When a backend field represents sensitive data, use a secret type (e.g., Pydantic SecretStr with length constraints) so OpenAPI marks it as a password/writeOnly field. Apply this pattern to similar sensitive request fields across API schemas so generated TypeScript clients and docs treat them as secrets and do not mishandle sensitivity. Review all openapi.jsons where sensitive inputs are defined and replace plain strings with SecretStr-like semantics with appropriate minLength constraints.
Applied to files:
autogpt_platform/frontend/src/app/api/openapi.json
📚 Learning: 2026-03-07T07:43:09.871Z
Learnt from: kcze
Repo: Significant-Gravitas/AutoGPT PR: 12328
File: autogpt_platform/frontend/src/app/api/openapi.json:1116-1118
Timestamp: 2026-03-07T07:43:09.871Z
Learning: For autogpt_platform/frontend/src/app/api/openapi.json, preserve the existing behavior: HTTPBearerJWT is declared at the router level with Depends(auth.get_user_id) returning None for unauthenticated users; treat as optional auth. Do not change per-operation security descriptions unless you plan a repo-wide OpenAPI update. If you change this file, prefer clarifying operation descriptions rather than altering security requirements.
Applied to files:
autogpt_platform/frontend/src/app/api/openapi.json
🔇 Additional comments (7)
autogpt_platform/frontend/src/app/(platform)/copilot/components/MobileDrawer/MobileDrawer.tsx (3)
6-16: LGTM!Imports are correctly structured — Phosphor Icons are used exclusively, and the store/PulseLoader imports are appropriately added.
64-70: LGTM!Store hook usage is clean — destructuring
completedSessionIDs,clearCompletedSession,isSoundEnabled, andtoggleSoundfromuseCopilotUIStoreis appropriate for the feature requirements.
139-144: LGTM!The onClick handler correctly clears the completed session state when a user navigates to that chat. The processing/completion indicators now properly guard against showing both the loader and checkmark simultaneously — the
!completedSessionIDs.has(session.id)condition suppresses the stale loader when a client-side completion is recorded.Also applies to: 165-176
autogpt_platform/backend/backend/api/features/chat/routes.py (3)
130-130: LGTM!Clean addition of the
is_processingfield with a sensible default value ofFalse, ensuring backward compatibility.
192-196: Previously flagged issues remain unaddressed.The following issues were already raised in prior reviews:
- Line 192: Move
from backend.data.redis_client import get_redis_asyncto top-level imports- Line 195: Use existing
config.session_meta_prefixinstead of instantiating a newChatConfig()- Line 196: Use
redis.pipeline(transaction=False)for read-only batch operations to avoid unnecessary MULTI/EXEC overhead
216-216: LGTM!Set membership check correctly populates the new
is_processingfield for each session.autogpt_platform/frontend/src/app/api/openapi.json (1)
11833-11837: Looks good.This schema addition cleanly exposes the new processing-state contract needed by the session list response and matches the PR’s backend/frontend integration.
Backend: - Move local imports to top-level in routes.py and stream_registry.py - Use module-level `config` instead of re-instantiating ChatConfig per request - Use transaction=False for read-only Redis pipeline - Use Literal["completed", "failed"] for CopilotCompletionPayload.status Frontend: - Read fresh Zustand state after addCompletedSession for accurate title count - Only reset document.title on tab focus when completedSessionIDs is empty Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
…5-autopilot-notifications
- Move addCompletedSession + title update before the isNotificationsEnabled gate so checkmark and tab title always reflect completion status regardless of notification preference. Sound and browser notifications remain gated. - Remove default value from is_processing response field so it's required in the JSON schema and generated types. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
github-project-automation
Bot
moved this from 🆕 Needs initial review
to 👍🏼 Mergeable
in AutoGPT development kanban
github-project-automation
Bot
moved this from 👍🏼 Mergeable
to ✅ Done
in AutoGPT development kanban
Issues attributed to commits in this pull requestThis pull request was merged and Sentry observed the following issues:
|
…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
Adds a notification system for the Copilot (AutoPilot) so users know when background chats finish processing — via in-app indicators, sounds, browser notifications, and document title badges. ### Changes 🏗️ **Backend** - Add `is_processing` field to `SessionSummaryResponse` — batch-checks Redis for active stream status on each session in the list endpoint - Fix `is_processing` always returning `false` due to bytes vs string comparison (`b"running"` → `"running"`) with `decode_responses=True` Redis client - Add `CopilotCompletionPayload` model for WebSocket notification events - Publish `copilot_completion` notification via WebSocket when a session completes in `stream_registry.mark_session_completed` **Frontend — Notification UI** - Add `NotificationBanner` component — amber banner prompting users to enable browser notifications (auto-hides when already enabled or dismissed) - Add `NotificationDialog` component — modal dialog for enabling notifications, supports force-open from sidebar menu for testing - Fix repeated word "response" in dialog copy **Frontend — Sidebar** - Add bell icon in sidebar header with popover menu containing: - Notifications toggle (requests browser permission on enable; shows toast if denied) - Sound toggle (disabled when notifications are off) - "Show notification popup" button (for testing the dialog) - "Clear local data" button (resets all copilot localStorage keys) - Bell icon states: `BellSlash` (disabled), `Bell` (enabled, no sound), `BellRinging` (enabled + sound) - Add processing indicator (PulseLoader) and completion checkmark (CheckCircle) inline with chat title, to the left of the hamburger menu - Processing indicator hides immediately when completion arrives (no overlap with checkmark) - Fix PulseLoader initial flash — start at `scale(0); opacity: 0` with smoother keyframes - Add 10s polling (`refetchInterval`) to session list so `is_processing` updates automatically - Clear document title badge when navigating to a completed chat - Remove duplicate "Your chats" heading that appeared in both SidebarHeader and SidebarContent **Frontend — Notification Hook (`useCopilotNotifications`)** - Listen for `copilot_completion` WebSocket events - Track completed sessions in Zustand store - Play notification sound (only for background sessions, not active chat) - Update `document.title` with unread count badge - Send browser `Notification` when tab is hidden, with click-to-navigate to the completed chat - Reset document title on tab focus **Frontend — Store & Storage** - Add `completedSessionIDs`, `isNotificationsEnabled`, `isSoundEnabled`, `showNotificationDialog`, `clearCopilotLocalData` to Zustand store - Persist notification and sound preferences in localStorage - On init, validate `isNotificationsEnabled` against actual `Notification.permission` - Add localStorage keys: `COPILOT_NOTIFICATIONS_ENABLED`, `COPILOT_SOUND_ENABLED`, `COPILOT_NOTIFICATION_BANNER_DISMISSED`, `COPILOT_NOTIFICATION_DIALOG_DISMISSED` **Mobile** - Add processing/completion indicators and sound toggle to MobileDrawer ### Checklist 📋 #### For code changes: - [x] I have clearly listed my changes in the PR description - [x] I have made a test plan - [x] I have tested my changes according to the test plan: - [x] Open copilot, start a chat, switch to another chat — verify processing indicator appears on the background chat - [x] Wait for background chat to complete — verify checkmark appears, processing indicator disappears - [x] Enable notifications via bell menu — verify browser permission prompt appears - [x] With notifications enabled, complete a background chat while on another tab — verify system notification appears with sound - [x] Click system notification — verify it navigates to the completed chat - [x] Verify document title shows unread count and resets when navigating to the chat or focusing the tab - [x] Toggle sound off — verify no sound plays on completion - [x] Toggle notifications off — verify no sound, no system notification, no badge - [x] Clear local data — verify all preferences reset - [x] Verify notification banner hides when notifications already enabled - [x] Verify dialog auto-shows for first-time users and can be force-opened from menu --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
…as#12364) Adds a notification system for the Copilot (AutoPilot) so users know when background chats finish processing — via in-app indicators, sounds, browser notifications, and document title badges. ### Changes 🏗️ **Backend** - Add `is_processing` field to `SessionSummaryResponse` — batch-checks Redis for active stream status on each session in the list endpoint - Fix `is_processing` always returning `false` due to bytes vs string comparison (`b"running"` → `"running"`) with `decode_responses=True` Redis client - Add `CopilotCompletionPayload` model for WebSocket notification events - Publish `copilot_completion` notification via WebSocket when a session completes in `stream_registry.mark_session_completed` **Frontend — Notification UI** - Add `NotificationBanner` component — amber banner prompting users to enable browser notifications (auto-hides when already enabled or dismissed) - Add `NotificationDialog` component — modal dialog for enabling notifications, supports force-open from sidebar menu for testing - Fix repeated word "response" in dialog copy **Frontend — Sidebar** - Add bell icon in sidebar header with popover menu containing: - Notifications toggle (requests browser permission on enable; shows toast if denied) - Sound toggle (disabled when notifications are off) - "Show notification popup" button (for testing the dialog) - "Clear local data" button (resets all copilot localStorage keys) - Bell icon states: `BellSlash` (disabled), `Bell` (enabled, no sound), `BellRinging` (enabled + sound) - Add processing indicator (PulseLoader) and completion checkmark (CheckCircle) inline with chat title, to the left of the hamburger menu - Processing indicator hides immediately when completion arrives (no overlap with checkmark) - Fix PulseLoader initial flash — start at `scale(0); opacity: 0` with smoother keyframes - Add 10s polling (`refetchInterval`) to session list so `is_processing` updates automatically - Clear document title badge when navigating to a completed chat - Remove duplicate "Your chats" heading that appeared in both SidebarHeader and SidebarContent **Frontend — Notification Hook (`useCopilotNotifications`)** - Listen for `copilot_completion` WebSocket events - Track completed sessions in Zustand store - Play notification sound (only for background sessions, not active chat) - Update `document.title` with unread count badge - Send browser `Notification` when tab is hidden, with click-to-navigate to the completed chat - Reset document title on tab focus **Frontend — Store & Storage** - Add `completedSessionIDs`, `isNotificationsEnabled`, `isSoundEnabled`, `showNotificationDialog`, `clearCopilotLocalData` to Zustand store - Persist notification and sound preferences in localStorage - On init, validate `isNotificationsEnabled` against actual `Notification.permission` - Add localStorage keys: `COPILOT_NOTIFICATIONS_ENABLED`, `COPILOT_SOUND_ENABLED`, `COPILOT_NOTIFICATION_BANNER_DISMISSED`, `COPILOT_NOTIFICATION_DIALOG_DISMISSED` **Mobile** - Add processing/completion indicators and sound toggle to MobileDrawer ### Checklist 📋 #### For code changes: - [x] I have clearly listed my changes in the PR description - [x] I have made a test plan - [x] I have tested my changes according to the test plan: - [x] Open copilot, start a chat, switch to another chat — verify processing indicator appears on the background chat - [x] Wait for background chat to complete — verify checkmark appears, processing indicator disappears - [x] Enable notifications via bell menu — verify browser permission prompt appears - [x] With notifications enabled, complete a background chat while on another tab — verify system notification appears with sound - [x] Click system notification — verify it navigates to the completed chat - [x] Verify document title shows unread count and resets when navigating to the chat or focusing the tab - [x] Toggle sound off — verify no sound plays on completion - [x] Toggle notifications off — verify no sound, no system notification, no badge - [x] Clear local data — verify all preferences reset - [x] Verify notification banner hides when notifications already enabled - [x] Verify dialog auto-shows for first-time users and can be force-opened from menu --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
4 participants
Adds a notification system for the Copilot (AutoPilot) so users know when background chats finish processing — via in-app indicators, sounds, browser notifications, and document title badges.
Changes 🏗️
Backend
is_processingfield toSessionSummaryResponse— batch-checks Redis for active stream status on each session in the list endpointis_processingalways returningfalsedue to bytes vs string comparison (b"running"→"running") withdecode_responses=TrueRedis clientCopilotCompletionPayloadmodel for WebSocket notification eventscopilot_completionnotification via WebSocket when a session completes instream_registry.mark_session_completedFrontend — Notification UI
NotificationBannercomponent — amber banner prompting users to enable browser notifications (auto-hides when already enabled or dismissed)NotificationDialogcomponent — modal dialog for enabling notifications, supports force-open from sidebar menu for testingFrontend — Sidebar
BellSlash(disabled),Bell(enabled, no sound),BellRinging(enabled + sound)scale(0); opacity: 0with smoother keyframesrefetchInterval) to session list sois_processingupdates automaticallyFrontend — Notification Hook (
useCopilotNotifications)copilot_completionWebSocket eventsdocument.titlewith unread count badgeNotificationwhen tab is hidden, with click-to-navigate to the completed chatFrontend — Store & Storage
completedSessionIDs,isNotificationsEnabled,isSoundEnabled,showNotificationDialog,clearCopilotLocalDatato Zustand storeisNotificationsEnabledagainst actualNotification.permissionCOPILOT_NOTIFICATIONS_ENABLED,COPILOT_SOUND_ENABLED,COPILOT_NOTIFICATION_BANNER_DISMISSED,COPILOT_NOTIFICATION_DIALOG_DISMISSEDMobile
Checklist 📋
For code changes: