mirror of
https://github.com/catlog22/Claude-Code-Workflow.git
synced 2026-03-07 16:41:06 +08:00
- Added role specifications for explorer, implementer, scanner, tester, and diagnoser. - Created dispatch and monitor commands for orchestrating task execution. - Defined team configuration for the UX improvement pipeline, including roles and responsibilities. - Established structured task descriptions for scanning, diagnosing, designing, implementing, and testing UI components. - Introduced caching mechanisms for exploration results and context accumulation for implementer tasks. - Enhanced error handling and validation processes across roles.
97 lines
3.3 KiB
Markdown
97 lines
3.3 KiB
Markdown
---
|
|
prefix: DIAG
|
|
inner_loop: false
|
|
message_types:
|
|
success: diag_complete
|
|
error: error
|
|
---
|
|
|
|
# State Diagnoser
|
|
|
|
Diagnose root causes of UI issues: state management problems, event binding failures, async handling errors.
|
|
|
|
## Phase 2: Context & Complexity Assessment
|
|
|
|
1. Load scan report from `<session>/artifacts/scan-report.md`
|
|
2. Load scanner state via `team_msg(operation="get_state", session_id=<session-id>, role="scanner")`
|
|
3. Assess issue complexity:
|
|
|
|
| Complexity | Criteria | Strategy |
|
|
|------------|----------|----------|
|
|
| High | 5+ issues, cross-component state | CLI delegation |
|
|
| Medium | 2-4 issues, single component | CLI for analysis |
|
|
| Low | 1 issue, simple pattern | Inline analysis |
|
|
|
|
### Complex Analysis (use CLI)
|
|
|
|
For complex multi-file state management issues:
|
|
|
|
```
|
|
Bash(`ccw cli -p "PURPOSE: Analyze state management patterns and identify root causes
|
|
CONTEXT: @<issue-files>
|
|
EXPECTED: Root cause analysis with fix recommendations
|
|
CONSTRAINTS: Focus on reactive update patterns" --tool gemini --mode analysis`)
|
|
```
|
|
|
|
## Phase 3: Root Cause Analysis
|
|
|
|
For each issue from scan report:
|
|
|
|
### State Management Diagnosis
|
|
|
|
| Pattern | Root Cause | Fix Strategy |
|
|
|---------|------------|--------------|
|
|
| Array.splice/push | Direct mutation, no reactive trigger | Use filter/map/spread for new array |
|
|
| Object property change | Direct mutation | Use spread operator or reactive API |
|
|
| Missing useState/ref | No state tracking | Add state variable |
|
|
| Stale closure | Captured old state value | Use functional setState or ref.current |
|
|
|
|
### Event Binding Diagnosis
|
|
|
|
| Pattern | Root Cause | Fix Strategy |
|
|
|---------|------------|--------------|
|
|
| onClick without handler | Missing event binding | Add event handler function |
|
|
| Async without await | Unhandled promise | Add async/await or .then() |
|
|
| No error catching | Uncaught exceptions | Wrap in try/catch |
|
|
| Event propagation issue | stopPropagation missing | Add event.stopPropagation() |
|
|
|
|
### Async Handling Diagnosis
|
|
|
|
| Pattern | Root Cause | Fix Strategy |
|
|
|---------|------------|--------------|
|
|
| No loading state | Missing async state tracking | Add isLoading state |
|
|
| No error handling | Missing catch block | Add try/catch with error state |
|
|
| Race condition | Multiple concurrent requests | Add request cancellation or debounce |
|
|
|
|
## Phase 4: Diagnosis Report
|
|
|
|
1. Generate root cause analysis for each issue:
|
|
|
|
```markdown
|
|
# Diagnosis Report
|
|
|
|
## Issue #1: Upload form no loading state
|
|
- **File**: src/components/Upload.tsx:45
|
|
- **Root Cause**: Form submit handler is async but no loading state variable exists
|
|
- **Pattern Type**: Missing async state tracking
|
|
- **Fix Recommendation**:
|
|
- Add `const [isLoading, setIsLoading] = useState(false)` (React)
|
|
- Add `const isLoading = ref(false)` (Vue)
|
|
- Wrap async call in try/finally with setIsLoading(true/false)
|
|
- Disable button when isLoading is true
|
|
```
|
|
|
|
2. Write report to `<session>/artifacts/diagnosis.md`
|
|
3. Share state via team_msg:
|
|
```
|
|
team_msg(operation="log", session_id=<session-id>, from="diagnoser",
|
|
type="state_update", data={
|
|
diagnosed_issues: <count>,
|
|
pattern_types: {
|
|
state_management: <count>,
|
|
event_binding: <count>,
|
|
async_handling: <count>
|
|
}
|
|
})
|
|
```
|