Remove obsolete CLAUDE.md documentation files from main, preload, renderer, and services directories to streamline project structure and eliminate outdated information.
This commit is contained in:
iliya
parent
9319189ff9
commit
34d2929a0b
10 changed files with 1 additions and 491 deletions
|
|
@ -1,31 +0,0 @@
|
||||||
# src/ Structure
|
|
||||||
|
|
||||||
Three-process Electron architecture:
|
|
||||||
|
|
||||||
## Processes
|
|
||||||
- `main/` - Node.js runtime (file system, IPC, lifecycle)
|
|
||||||
- `preload/` - Secure bridge (contextBridge API)
|
|
||||||
- `renderer/` - React/Chromium (UI, state, visualization)
|
|
||||||
- `shared/` - Cross-process types and utilities
|
|
||||||
|
|
||||||
## Import Pattern
|
|
||||||
Use barrel exports from domain folders:
|
|
||||||
```typescript
|
|
||||||
import { ChunkBuilder, ProjectScanner } from './services';
|
|
||||||
```
|
|
||||||
|
|
||||||
## IPC Communication
|
|
||||||
Exposed API via `window.electronAPI`, organized by domain:
|
|
||||||
|
|
||||||
| Domain | Methods | Examples |
|
|
||||||
|--------|---------|---------|
|
|
||||||
| Sessions | 10 | `getProjects()`, `getSessions()`, `getSessionsPaginated()`, `getSessionDetail()`, `getSessionMetrics()`, `getWaterfallData()`, `getSubagentDetail()`, `searchSessions()`, `getAppVersion()` |
|
|
||||||
| Repository | 2 | `getRepositoryGroups()`, `getWorktreeSessions()` |
|
|
||||||
| Validation | 2 | `validatePath()`, `validateMentions()` |
|
|
||||||
| CLAUDE.md | 3 | `readClaudeMdFiles()`, `readDirectoryClaudeMd()`, `readMentionedFile()` |
|
|
||||||
| Config | 16 | `config.get()`, `config.update()`, `config.addTrigger()`, `config.openInEditor()`, `config.pinSession()`, `config.unpinSession()`, etc. |
|
|
||||||
| Notifications | 9 | `notifications.get()`, `notifications.markRead()`, `notifications.onNew()`, etc. |
|
|
||||||
| Utilities | 7 | `openPath()`, `openExternal()`, `onFileChange()`, `onTodoChange()`, `getZoomFactor()`, `onZoomFactorChanged()` |
|
|
||||||
| Session | 1 | `session.scrollToLine()` |
|
|
||||||
|
|
||||||
Full API signatures in `src/preload/index.ts`, channel constants in `src/preload/constants/ipcChannels.ts`.
|
|
||||||
|
|
@ -1,32 +0,0 @@
|
||||||
# Main Process
|
|
||||||
|
|
||||||
Node.js runtime handling file system, IPC, and app lifecycle.
|
|
||||||
|
|
||||||
## Structure
|
|
||||||
- `index.ts` - App entry point, lifecycle management
|
|
||||||
- `ipc/` - IPC handlers organized by domain
|
|
||||||
- `services/` - Business logic by domain
|
|
||||||
- `types/` - Type definitions
|
|
||||||
- `utils/` - Utility functions
|
|
||||||
- `constants/` - Shared constants (messageTags, worktreePatterns)
|
|
||||||
|
|
||||||
## IPC Organization
|
|
||||||
Handlers in `ipc/` by domain:
|
|
||||||
- `projects.ts` - Project listing
|
|
||||||
- `sessions.ts` - Session operations
|
|
||||||
- `search.ts` - Search functionality
|
|
||||||
- `subagents.ts` - Subagent details
|
|
||||||
- `validation.ts` - Path validation
|
|
||||||
- `utility.ts` - Shell & file operations
|
|
||||||
- `config.ts` - Configuration
|
|
||||||
- `notifications.ts` - Notifications
|
|
||||||
|
|
||||||
## Adding IPC Handler
|
|
||||||
1. Add to domain file in `ipc/`
|
|
||||||
2. If new domain, create file and register in `handlers.ts`
|
|
||||||
3. Add type in `preload/index.ts`
|
|
||||||
4. Implement in appropriate service
|
|
||||||
|
|
||||||
## File Watching
|
|
||||||
FileWatcher service monitors session files with 100ms debounce.
|
|
||||||
Notifies renderer of changes via IPC events.
|
|
||||||
|
|
@ -1,57 +0,0 @@
|
||||||
# IPC Handlers
|
|
||||||
|
|
||||||
Domain-organized IPC request handlers for main process.
|
|
||||||
|
|
||||||
## Structure
|
|
||||||
```
|
|
||||||
ipc/
|
|
||||||
├── handlers.ts # Initialization and registration
|
|
||||||
├── config.ts # App configuration handlers
|
|
||||||
├── configValidation.ts # Config input validation/sanitization
|
|
||||||
├── guards.ts # IPC argument type guards
|
|
||||||
├── notifications.ts # Notification management
|
|
||||||
├── projects.ts # Project listing, repository grouping
|
|
||||||
├── search.ts # Session content search
|
|
||||||
├── sessions.ts # Session operations, pagination
|
|
||||||
├── subagents.ts # Subagent detail drill-down
|
|
||||||
├── utility.ts # Shell operations, file reading
|
|
||||||
└── validation.ts # Path validation, file mentioning
|
|
||||||
```
|
|
||||||
|
|
||||||
## Handler Pattern
|
|
||||||
Each domain module exports:
|
|
||||||
```typescript
|
|
||||||
// Setup with services
|
|
||||||
initialize{Domain}Handlers(services)
|
|
||||||
|
|
||||||
// Register with ipcMain
|
|
||||||
register{Domain}Handlers(ipcMain)
|
|
||||||
|
|
||||||
// Cleanup on app quit
|
|
||||||
remove{Domain}Handlers(ipcMain)
|
|
||||||
```
|
|
||||||
|
|
||||||
## Service Dependencies
|
|
||||||
`initializeIpcHandlers()` receives service instances:
|
|
||||||
- `ProjectScanner` - File system scanning
|
|
||||||
- `SessionParser` - JSONL parsing
|
|
||||||
- `SubagentResolver` - Subagent linking
|
|
||||||
- `ChunkBuilder` - Chunk analysis
|
|
||||||
- `DataCache` - Result caching
|
|
||||||
|
|
||||||
## Response Pattern
|
|
||||||
Config handlers use `IpcResult<T>` wrapper:
|
|
||||||
```typescript
|
|
||||||
return { success: true, data: result };
|
|
||||||
return { success: false, error: message };
|
|
||||||
```
|
|
||||||
|
|
||||||
Other handlers return data directly or `null` on error.
|
|
||||||
|
|
||||||
## Adding New Handler
|
|
||||||
1. Add to existing domain file or create new file
|
|
||||||
2. Call `initialize{Domain}Handlers()` if new domain
|
|
||||||
3. Add `register/remove{Domain}Handlers` in `handlers.ts`
|
|
||||||
4. Add channel constant in `preload/constants/ipcChannels.ts`
|
|
||||||
5. Add method to ElectronAPI in `preload/index.ts`
|
|
||||||
6. Implement service logic in `src/main/services/`
|
|
||||||
|
|
@ -1,59 +0,0 @@
|
||||||
# Services
|
|
||||||
|
|
||||||
Business logic organized by domain.
|
|
||||||
|
|
||||||
## Domains
|
|
||||||
- `analysis/` - Chunk building, semantic steps, tool execution
|
|
||||||
- `discovery/` - Project/session scanning, subagent resolution
|
|
||||||
- `error/` - Error detection, trigger checking
|
|
||||||
- `infrastructure/` - Cache, file watching, config, notifications
|
|
||||||
- `parsing/` - JSONL parsing, message classification
|
|
||||||
|
|
||||||
## Key Services
|
|
||||||
|
|
||||||
### Analysis
|
|
||||||
- **ChunkBuilder** - Orchestrates chunk building
|
|
||||||
- **ChunkFactory** - Creates chunk objects
|
|
||||||
- **ConversationGroupBuilder** - Builds conversation groups
|
|
||||||
- **ProcessLinker** - Links subagents to chunks
|
|
||||||
- **SemanticStepExtractor** - Extracts steps
|
|
||||||
- **SemanticStepGrouper** - Groups semantic steps
|
|
||||||
- **SubagentDetailBuilder** - Builds subagent detail views
|
|
||||||
- **ToolExecutionBuilder** - Builds tool execution tracking
|
|
||||||
- **ToolResultExtractor** - Extracts tool results
|
|
||||||
- **ToolSummaryFormatter** - Formats tool summaries
|
|
||||||
|
|
||||||
### Discovery
|
|
||||||
- **ProjectPathResolver** - Resolves project paths
|
|
||||||
- **ProjectScanner** - Scans ~/.claude/projects/
|
|
||||||
- **SessionContentFilter** - Filters session content
|
|
||||||
- **SessionSearcher** - Searches session content
|
|
||||||
- **SubagentLocator** - Locates subagent files
|
|
||||||
- **SubagentResolver** - Parses subagent files, detects parallel execution, enriches team metadata/colors
|
|
||||||
- **SubprojectRegistry** - Tracks subproject associations
|
|
||||||
- **WorktreeGrouper** - Groups projects by git worktree
|
|
||||||
|
|
||||||
### Parsing
|
|
||||||
- **SessionParser** - Parses JSONL files
|
|
||||||
- **MessageClassifier** - Categorizes messages (user, system, AI, noise)
|
|
||||||
- **ClaudeMdReader** - Reads CLAUDE.md configuration
|
|
||||||
- **GitIdentityResolver** - Resolves git identities
|
|
||||||
|
|
||||||
### Error
|
|
||||||
- **ErrorDetector** - Per-tool-use token counting, returns `DetectedError[]`
|
|
||||||
- **ErrorMessageBuilder** - Builds error notification messages
|
|
||||||
- **ErrorTriggerChecker** - Matches against notification triggers
|
|
||||||
- **ErrorTriggerTester** - Tests triggers against historical data
|
|
||||||
- **TriggerMatcher** - Pattern matching for triggers
|
|
||||||
|
|
||||||
### Infrastructure
|
|
||||||
- **DataCache** - LRU cache (50 entries, 10min TTL)
|
|
||||||
- **FileWatcher** - 100ms debounced file watching
|
|
||||||
- **ConfigManager** - App configuration
|
|
||||||
- **NotificationManager** - Notification handling
|
|
||||||
- **TriggerManager** - Notification trigger management
|
|
||||||
|
|
||||||
## Adding Service
|
|
||||||
1. Create in appropriate domain folder
|
|
||||||
2. Export from domain's index.ts
|
|
||||||
3. Re-export from services/index.ts
|
|
||||||
|
|
@ -97,7 +97,7 @@ async function collectNvmWindowsCandidates(): Promise<string[]> {
|
||||||
|
|
||||||
const exts = getWindowsExecutableExtensions();
|
const exts = getWindowsExecutableExtensions();
|
||||||
return versions
|
return versions
|
||||||
.sort((a, b) => b.localeCompare(a, undefined, { numeric: true, sensitivity: 'base' }))
|
.toSorted((a, b) => b.localeCompare(a, undefined, { numeric: true, sensitivity: 'base' }))
|
||||||
.flatMap((version) => exts.map((ext) => path.join(nvmRoot, version, `claude${ext}`)));
|
.flatMap((version) => exts.map((ext) => path.join(nvmRoot, version, `claude${ext}`)));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,61 +0,0 @@
|
||||||
# Preload Process
|
|
||||||
|
|
||||||
Secure bridge between main and renderer processes via Electron's contextBridge.
|
|
||||||
|
|
||||||
## Structure
|
|
||||||
- `index.ts` - ElectronAPI implementation
|
|
||||||
- `constants/ipcChannels.ts` - IPC channel name constants
|
|
||||||
|
|
||||||
## ElectronAPI Organization
|
|
||||||
Groups exposed methods by domain:
|
|
||||||
|
|
||||||
### Session APIs
|
|
||||||
- `getProjects()`, `getSessions()`, `getSessionsPaginated()`
|
|
||||||
- `getSessionDetail()`, `getSessionMetrics()`, `getWaterfallData()`
|
|
||||||
- `getSessionGroups()`, `searchSessions()`, `getAppVersion()`
|
|
||||||
|
|
||||||
### Repository APIs
|
|
||||||
- `getRepositoryGroups()`, `getWorktreeSessions()`
|
|
||||||
|
|
||||||
### Validation APIs
|
|
||||||
- `validatePath()`, `validateMentions()`
|
|
||||||
|
|
||||||
### CLAUDE.md APIs
|
|
||||||
- `readClaudeMdFiles()`, `readDirectoryClaudeMd()`, `readMentionedFile()`
|
|
||||||
|
|
||||||
### Notifications
|
|
||||||
- `notifications.{get,markRead,markAllRead,delete,clear,getUnreadCount}`
|
|
||||||
- `notifications.{onNew,onUpdated,onClicked}` - Event listeners
|
|
||||||
|
|
||||||
### Config API
|
|
||||||
- `config.{get,update}` - Read/write config
|
|
||||||
- `config.{addTrigger,updateTrigger,removeTrigger,getTriggers,testTrigger}`
|
|
||||||
- `config.{addIgnoreRegex,removeIgnoreRegex,addIgnoreRepository,removeIgnoreRepository}`
|
|
||||||
- `config.{snooze,clearSnooze,selectFolders}`
|
|
||||||
- `config.{openInEditor,pinSession,unpinSession}`
|
|
||||||
|
|
||||||
### Utilities
|
|
||||||
- `openPath()` - Shell operations
|
|
||||||
- `openExternal()` - Open URLs in browser
|
|
||||||
- `onFileChange()` - File watcher events
|
|
||||||
- `getZoomFactor()` - Get current zoom level
|
|
||||||
- `onZoomFactorChanged()` - Zoom change listener
|
|
||||||
- `session.scrollToLine()` - Deep link navigation
|
|
||||||
|
|
||||||
## IPC Pattern
|
|
||||||
Config operations use `IpcResult<T>` wrapper pattern:
|
|
||||||
```typescript
|
|
||||||
interface IpcResult<T> {
|
|
||||||
success: boolean;
|
|
||||||
data?: T;
|
|
||||||
error?: string;
|
|
||||||
}
|
|
||||||
```
|
|
||||||
The `invokeIpcWithResult<T>()` helper unwraps and throws on failure.
|
|
||||||
|
|
||||||
## Adding New IPC Methods
|
|
||||||
1. Define channel constant in `constants/ipcChannels.ts`
|
|
||||||
2. Implement handler in `src/main/ipc/{domain}.ts`
|
|
||||||
3. Register in `handlers.ts` via `register{Domain}Handlers()`
|
|
||||||
4. Add method to ElectronAPI in `preload/index.ts`
|
|
||||||
5. Update `@shared/types/ElectronAPI` if cross-process type needed
|
|
||||||
|
|
@ -1,82 +0,0 @@
|
||||||
# Renderer Process
|
|
||||||
|
|
||||||
React application running in Chromium.
|
|
||||||
|
|
||||||
## Structure
|
|
||||||
- `App.tsx` - Root layout
|
|
||||||
- `main.tsx` - React entry point
|
|
||||||
- `index.css` - Global styles with Tailwind
|
|
||||||
- `components/` - UI components by feature
|
|
||||||
- `store/` - Zustand state (slices pattern)
|
|
||||||
- `hooks/` - Custom React hooks
|
|
||||||
- `utils/` - Renderer utilities
|
|
||||||
- `types/` - Renderer type definitions
|
|
||||||
- `constants/` - CSS variables (`cssVariables.ts`), layout constants (`layout.ts`), team colors (`teamColors.ts`)
|
|
||||||
- `contexts/` - React contexts (`TabUIContext.tsx`, `useTabUIContext.ts`)
|
|
||||||
|
|
||||||
## Component Organization
|
|
||||||
```
|
|
||||||
components/
|
|
||||||
├── chat/ # Chat display, message items, viewers, context panel
|
|
||||||
├── common/ # Shared components (badges, dropdowns, token display)
|
|
||||||
├── dashboard/ # Dashboard views
|
|
||||||
├── layout/ # Layout components (headers, shells)
|
|
||||||
├── notifications/ # Notification panels and badges
|
|
||||||
├── search/ # Search UI and results
|
|
||||||
├── settings/ # Settings UI
|
|
||||||
└── sidebar/ # Sidebar navigation
|
|
||||||
```
|
|
||||||
|
|
||||||
## Types (`types/`)
|
|
||||||
- `data.ts` - Core data types (ParsedMessage, SemanticStep, SessionMetrics)
|
|
||||||
- `groups.ts` - Chat groups (UserGroup, AIGroup, SystemGroup, AIGroupDisplayItem union)
|
|
||||||
- `contextInjection.ts` - Context tracking (ContextInjection union, ContextStats, ContextPhaseInfo)
|
|
||||||
- `claudeMd.ts` - CLAUDE.md injection types
|
|
||||||
- `panes.ts` - Pane layout types
|
|
||||||
- `tabs.ts` - Tab management types
|
|
||||||
- `notifications.ts` - Notification types
|
|
||||||
- `api.ts` - API types
|
|
||||||
|
|
||||||
## Utils (`utils/`)
|
|
||||||
- `contextTracker.ts` - Visible context tracking (computeContextStats, processSessionContextWithPhases)
|
|
||||||
- `claudeMdTracker.ts` - CLAUDE.md injection detection
|
|
||||||
- `aiGroupEnhancer.ts` - AI group enrichment (linkToolCallsToResults, buildDisplayItems)
|
|
||||||
- `aiGroupHelpers.ts` - AI group utility functions
|
|
||||||
- `displayItemBuilder.ts` - Display item construction
|
|
||||||
- `displaySummary.ts` - Display summary generation
|
|
||||||
- `formatters.ts` - Display formatting
|
|
||||||
- `groupTransformer.ts` - Chat item grouping
|
|
||||||
- `lastOutputDetector.ts` - Last output detection
|
|
||||||
- `modelExtractor.ts` - Model name extraction
|
|
||||||
- `pathDisplay.ts` - Path display formatting
|
|
||||||
- `pathUtils.ts` - Path utility functions
|
|
||||||
- `slashCommandExtractor.ts` - Slash command extraction
|
|
||||||
- `stringUtils.ts` - String utility functions
|
|
||||||
- `toolLinkingEngine.ts` - Tool call/result linking
|
|
||||||
- `toolRendering/` - Tool rendering helpers
|
|
||||||
- `toolContentChecks.ts` - Tool content validation
|
|
||||||
- `toolSummaryHelpers.ts` - Tool summary formatting
|
|
||||||
- `toolTokens.ts` - Tool token utilities
|
|
||||||
|
|
||||||
## Hooks
|
|
||||||
- `useAutoScrollBottom` - Auto-scroll chat to bottom
|
|
||||||
- `useKeyboardShortcuts` - Keyboard shortcuts
|
|
||||||
- `useTabNavigationController` - Turn navigation with highlighting
|
|
||||||
- `useTabUI` - Per-tab UI state access
|
|
||||||
- `useTheme` - Dark/light theme toggle
|
|
||||||
- `useVisibleAIGroup` - Viewport-aware AI group tracking
|
|
||||||
- `useZoomFactor` - Zoom level management
|
|
||||||
- `navigation/utils.ts` - Navigation utility functions
|
|
||||||
|
|
||||||
## Contexts
|
|
||||||
- `contexts/TabUIContext.tsx` - Per-tab UI state isolation
|
|
||||||
- `contexts/useTabUIContext.ts` - Context consumer hook
|
|
||||||
|
|
||||||
## State Management
|
|
||||||
Zustand store with slices pattern:
|
|
||||||
- Each domain has data, selectedId, loading, error
|
|
||||||
- Actions grouped by domain
|
|
||||||
- Selectors for derived state
|
|
||||||
|
|
||||||
## Virtual Scrolling
|
|
||||||
Use `@tanstack/react-virtual` for large lists (sessions, messages).
|
|
||||||
|
|
@ -1,81 +0,0 @@
|
||||||
# Components
|
|
||||||
|
|
||||||
UI components organized by feature domain.
|
|
||||||
|
|
||||||
## Structure
|
|
||||||
```
|
|
||||||
components/
|
|
||||||
├── chat/ # Session message display
|
|
||||||
│ ├── items/ # Individual message/tool items
|
|
||||||
│ │ ├── linkedTool/ # Tool call/result display helpers
|
|
||||||
│ │ ├── BaseItem # Base item wrapper
|
|
||||||
│ │ ├── baseItemHelpers # Base item utility functions
|
|
||||||
│ │ ├── ExecutionTrace # Execution trace display
|
|
||||||
│ │ ├── LinkedToolItem # Tool call with linked result
|
|
||||||
│ │ ├── MetricsPill # Metrics badge display
|
|
||||||
│ │ ├── SlashItem # Slash command display
|
|
||||||
│ │ ├── SubagentItem # Subagent execution display
|
|
||||||
│ │ ├── TeammateMessageItem # Team message cards
|
|
||||||
│ │ ├── ThinkingItem # Extended thinking display
|
|
||||||
│ │ └── TextItem # Text output display
|
|
||||||
│ ├── viewers/ # Content viewers (JSON, code, diff)
|
|
||||||
│ ├── SessionContextPanel/ # Visible context tracking panel
|
|
||||||
│ │ ├── components/ # Section wrappers (ClaudeMdFilesSection, ToolOutputsSection, UserMessagesSection, etc.)
|
|
||||||
│ │ ├── items/ # Per-injection item renderers (ClaudeMdItem, ToolOutputItem, UserMessageItem, etc.)
|
|
||||||
│ │ ├── DirectoryTree/ # CLAUDE.md directory navigation
|
|
||||||
│ │ ├── utils/ # Formatting helpers
|
|
||||||
│ │ ├── index.tsx # Main panel component
|
|
||||||
│ │ └── types.ts # SectionType constants, panel props
|
|
||||||
│ ├── AIChatGroup.tsx # AI response group display
|
|
||||||
│ ├── ChatHistory.tsx # Chat timeline container
|
|
||||||
│ ├── ChatHistoryEmptyState.tsx # Empty state display
|
|
||||||
│ ├── ChatHistoryItem.tsx # Individual history item
|
|
||||||
│ ├── ChatHistoryLoadingState.tsx # Loading state display
|
|
||||||
│ ├── CompactBoundary.tsx # Compaction event boundary marker
|
|
||||||
│ ├── ContextBadge.tsx # Per-turn context injection popover badge
|
|
||||||
│ ├── DisplayItemList.tsx # Display item list rendering
|
|
||||||
│ ├── LastOutputDisplay.tsx # Last output display
|
|
||||||
│ ├── SystemChatGroup.tsx # System message group display
|
|
||||||
│ ├── UserChatGroup.tsx # User message display
|
|
||||||
│ ├── markdownComponents.tsx # Custom markdown renderers
|
|
||||||
│ └── searchHighlightUtils.ts # Search highlight utilities
|
|
||||||
├── common/ # Shared UI primitives
|
|
||||||
│ ├── CopyButton # Copy to clipboard button
|
|
||||||
│ ├── CopyablePath # Clickable, copyable file path
|
|
||||||
│ ├── ErrorBoundary # React error boundary
|
|
||||||
│ ├── OngoingIndicator # Session in-progress indicator
|
|
||||||
│ ├── RepositoryDropdown # Repository selector dropdown
|
|
||||||
│ ├── TokenUsageDisplay # Token breakdown with context stats hover
|
|
||||||
│ └── WorktreeBadge # Git worktree badge
|
|
||||||
├── dashboard/ # Overview and listing pages
|
|
||||||
├── layout/ # App shell, sidebars, headers
|
|
||||||
├── notifications/ # Notification panels and badges
|
|
||||||
├── search/ # Search UI and results
|
|
||||||
├── settings/ # Settings pages and controls
|
|
||||||
│ ├── components/ # Reusable setting controls (SettingRow, SettingsToggle, etc.)
|
|
||||||
│ ├── hooks/ # Settings-specific hooks
|
|
||||||
│ ├── sections/ # Setting sections (General, Notifications, Advanced)
|
|
||||||
│ └── NotificationTriggerSettings/ # Trigger config UI
|
|
||||||
│ ├── components/ # Trigger form components
|
|
||||||
│ ├── hooks/ # Trigger form hooks
|
|
||||||
│ └── utils/ # Trigger utilities
|
|
||||||
└── sidebar/ # Project/session navigation
|
|
||||||
```
|
|
||||||
|
|
||||||
## Adding Components
|
|
||||||
1. Choose appropriate parent directory by feature
|
|
||||||
2. If used across features, place in `common/`
|
|
||||||
3. Use Tailwind with theme-aware CSS variables
|
|
||||||
4. Connect to store via `useStore()` hook if needed
|
|
||||||
5. Colocate related hooks/utils in same directory
|
|
||||||
|
|
||||||
## Component Guidelines
|
|
||||||
- One component per file, PascalCase naming
|
|
||||||
- Use functional components with hooks
|
|
||||||
- Prefer composition over prop drilling
|
|
||||||
- Use `TabUIContext` for per-tab UI state
|
|
||||||
|
|
||||||
## Virtual Scrolling
|
|
||||||
Use `@tanstack/react-virtual` for lists > 100 items:
|
|
||||||
- Session lists in sidebar
|
|
||||||
- Message lists in chat view
|
|
||||||
|
|
@ -1,52 +0,0 @@
|
||||||
# Store (Zustand)
|
|
||||||
|
|
||||||
State management with slices pattern for domain organization.
|
|
||||||
|
|
||||||
## Structure
|
|
||||||
- `index.ts` - Store creation, combines all slices
|
|
||||||
- `types.ts` - AppState type definition
|
|
||||||
- `slices/` - Individual domain slices
|
|
||||||
- `utils/` - Store utilities (`paneHelpers.ts`, `pathResolution.ts`)
|
|
||||||
|
|
||||||
## Slices (12 total)
|
|
||||||
| Slice | Purpose |
|
|
||||||
|-------|---------|
|
|
||||||
| `projectSlice` | Projects list, selectedProjectId |
|
|
||||||
| `repositorySlice` | Repository grouping, worktrees |
|
|
||||||
| `sessionSlice` | Sessions list, pagination, selectedSessionId |
|
|
||||||
| `sessionDetailSlice` | Session detail, chunks, metrics |
|
|
||||||
| `subagentSlice` | Subagent data, selectedSubagentId |
|
|
||||||
| `conversationSlice` | Messages, conversation metadata |
|
|
||||||
| `tabSlice` | Tabs list, activeTabId, tab ordering |
|
|
||||||
| `tabUISlice` | Per-tab UI state (expansions, scroll) |
|
|
||||||
| `paneSlice` | Pane layout, split views |
|
|
||||||
| `uiSlice` | UI flags (sidebar visible, etc.) |
|
|
||||||
| `notificationSlice` | Notifications, unreadCount |
|
|
||||||
| `configSlice` | App config, triggers |
|
|
||||||
|
|
||||||
## Slice Pattern
|
|
||||||
Each slice follows:
|
|
||||||
```typescript
|
|
||||||
data: T[]
|
|
||||||
selectedId: string | null
|
|
||||||
loading: boolean
|
|
||||||
error: string | null
|
|
||||||
```
|
|
||||||
|
|
||||||
## Key Pattern: Per-Tab UI Isolation
|
|
||||||
`tabUISlice` maintains independent UI state per tab using tabId:
|
|
||||||
- `expandedAIGroupIds`, `expandedDisplayItemIds`, `expandedSubagentTraceIds`
|
|
||||||
- Ensures expanding a group in tab A doesn't affect tab B
|
|
||||||
|
|
||||||
## Store Initialization
|
|
||||||
Call `initializeNotificationListeners()` once in App.tsx useEffect:
|
|
||||||
- Subscribes to file change events
|
|
||||||
- Auto-refreshes sessions on new files
|
|
||||||
- Updates session detail on content change
|
|
||||||
- Uses `refreshSessionInPlace` to prevent flickering
|
|
||||||
|
|
||||||
## Adding a Slice
|
|
||||||
1. Create `slices/{domain}Slice.ts`
|
|
||||||
2. Export `create{Domain}Slice` function
|
|
||||||
3. Add to store composition in `index.ts`
|
|
||||||
4. Update `AppState` type in `types.ts`
|
|
||||||
|
|
@ -1,35 +0,0 @@
|
||||||
# Shared
|
|
||||||
|
|
||||||
Cross-process code used by main and renderer.
|
|
||||||
|
|
||||||
## What Goes Here
|
|
||||||
- Types shared between processes
|
|
||||||
- Pure utility functions (no Node/DOM APIs)
|
|
||||||
- Constants used across processes
|
|
||||||
|
|
||||||
## What Doesn't Go Here
|
|
||||||
- Node.js APIs → main/
|
|
||||||
- DOM/React APIs → renderer/
|
|
||||||
- Process-specific logic
|
|
||||||
|
|
||||||
## Structure
|
|
||||||
- `types/` - Shared type definitions (`api.ts`, `notifications.ts`, `visualization.ts`)
|
|
||||||
- `utils/` - Pure utility functions
|
|
||||||
- `tokenFormatting.ts` - Token formatting and estimation (`estimateTokens`, `formatTokensCompact`)
|
|
||||||
- `modelParser.ts` - Model name/family parsing
|
|
||||||
- `teammateMessageParser.ts` - `<teammate-message>` XML parsing
|
|
||||||
- `markdownTextSearch.ts` - Markdown-aware text search
|
|
||||||
- `contentSanitizer.ts` - Content sanitization
|
|
||||||
- `errorHandling.ts` - Error helpers
|
|
||||||
- `logger.ts` - Logging utility
|
|
||||||
- `constants/` - Shared constants
|
|
||||||
- `cache.ts` - Cache configuration
|
|
||||||
- `trafficLights.ts` - macOS traffic light constants
|
|
||||||
- `triggerColors.ts` - Trigger color palette
|
|
||||||
- `window.ts` - Window configuration
|
|
||||||
|
|
||||||
## Import
|
|
||||||
```typescript
|
|
||||||
import { SomeType } from '@shared/types';
|
|
||||||
import { estimateTokens } from '@shared/utils/tokenFormatting';
|
|
||||||
```
|
|
||||||
Loading…
Reference in a new issue