Skip to content

refactor(site): restructure AgentsPage folder#23750

Closed
DanielleMaywood wants to merge 1 commit intomainfrom
restructure-agents-page
Closed

refactor(site): restructure AgentsPage folder#23750
DanielleMaywood wants to merge 1 commit intomainfrom
restructure-agents-page

Conversation

@DanielleMaywood
Copy link
Copy Markdown
Contributor

🤖 This PR was written by Coder Agent on behalf of Danielle Maywood 🤖

Restructure site/src/pages/AgentsPage/ to enforce consistent conventions and improve maintainability.

Changes

Moves

  • UserCompactionThresholdSettings + stories → components/
  • useAgentChime + test → utils/chime (pure functions, not a hook)
  • pasteHelpers.test.tsChatMessageInput/ (co-locate with source)
  • DateRangePicker/ + Calendar/site/src/components/ (shared, used by TemplatePage)
  • ai-elements/ChatElements/ with PascalCase renames, tool/tools/

Splits

  • AttachmentPreview + ImageThumbnail + UploadState extracted from AgentChatInput.tsx
  • ContextUsageIndicator + ring constants + token helpers extracted from AgentChatInput.tsx
  • ScrollAnchoredContainer + isNearBottom + SCROLL_THRESHOLD extracted from AgentDetailView.tsx
  • StreamingOutput + hasTransientLiveStatus extracted from ConversationTimeline.tsx
  • useChatStore hook + private helpers extracted from ChatContext.ts

Settings page-per-tab extraction

  • Deleted monolithic AgentSettingsPageView.tsx (1144 lines)
  • Rewrote AgentSettingsPage.tsx as layout with <Outlet />
  • Created 8 child route pages: behavior, providers, models, mcp-servers, limits, usage, insights, templates
  • Extracted AdminBadge to shared component
  • Created PageView files for behavior, usage, templates tabs
  • Lifted queries/mutations into pages per Page/PageView convention

Renames

  • AgentDetailAgentChatPage
  • components/AgentDetail/components/ChatConversation/
  • TopBarChatTopBar (moved up one level, page chrome not conversation)
  • ChatContextchatStore
  • AgentDetailViewAgentChatPageView
  • AgentDetailContentChatPageContent
  • AgentDetailSkeletonAgentChatPageSkeleton
  • chatStore.test.tschatStore.createStore.test.ts

Config updates

  • Simplified vite.config.mts React Compiler regex (ChatElements now inside AgentsPage)
  • Updated site/AGENTS.md to reflect new paths
  • Updated router.tsx with lazy imports and nested settings routes

All 125 files changed, zero type errors (pnpm check clean).

Implementation notes
  • All file moves used git mv to preserve history (84 renames tracked by git)
  • Re-exports added at original locations for all splits to avoid breaking consumers
  • Admin-only settings pages wrap content in <RequirePermission isFeatureVisible={permissions.editDeploymentConfig}>
  • Mutations use full object form (saveSystemPromptMutation.mutate(...)) with Mutation suffix
  • Thin pages (Providers, Models, MCP, Limits, Insights) skip PageViews since they just render a single child component
  • UserCompactionThresholdSettings updated to receive lifted query/mutation data as props

Restructure the AgentsPage directory for consistent conventions:

Moves:
- UserCompactionThresholdSettings → components/
- useAgentChime → utils/chime (pure functions, not a hook)
- pasteHelpers.test.ts → ChatMessageInput/ (co-locate with source)
- DateRangePicker/ + Calendar/ → site/src/components/ (shared)
- ai-elements/ → ChatElements/ with PascalCase renames

Splits:
- AttachmentPreview + ImageThumbnail + UploadState from AgentChatInput
- ContextUsageIndicator from AgentChatInput
- ScrollAnchoredContainer from AgentDetailView
- StreamingOutput from ConversationTimeline
- useChatStore from ChatContext

Settings page-per-tab:
- Delete monolithic AgentSettingsPageView (1144 lines)
- Rewrite AgentSettingsPage as layout with Outlet
- Create 8 child route pages with lazy imports
- Extract AdminBadge to shared component
- Create PageView files for behavior, usage, templates tabs
- Lift queries into pages, pass data as props

Renames:
- AgentDetail → AgentChatPage
- components/AgentDetail/ → components/ChatConversation/
- TopBar → ChatTopBar (moved up, page chrome not conversation)
- ChatContext → chatStore
- AgentDetailView → AgentChatPageView
- AgentDetailContent → ChatPageContent
- AgentDetailSkeleton → AgentChatPageSkeleton
- chatStore.test.ts → chatStore.createStore.test.ts
@github-actions github-actions bot added the community Pull Requests and issues created by the community. label Mar 28, 2026
@DanielleMaywood DanielleMaywood changed the title refactor(site/src/pages/AgentsPage): restructure AgentsPage folder refactor(site): restructure AgentsPage folder Mar 28, 2026
@github-actions github-actions bot locked and limited conversation to collaborators Mar 28, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

community Pull Requests and issues created by the community.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant