mirror of
https://github.com/catlog22/Claude-Code-Workflow.git
synced 2026-03-07 16:41:06 +08:00
- Added `__init__.py` in `codexlens/tools` for documentation generation. - Created `deepwiki_generator.py` to handle symbol extraction and markdown generation. - Introduced `MockMarkdownGenerator` for testing purposes. - Implemented `DeepWikiGenerator` class for managing documentation generation and file processing. - Added unit tests for `DeepWikiStore` to ensure proper functionality and error handling. - Created tests for DeepWiki TypeScript types matching.
118 lines
3.7 KiB
Markdown
118 lines
3.7 KiB
Markdown
---
|
|
prefix: SCAN
|
|
inner_loop: false
|
|
message_types:
|
|
success: scan_complete
|
|
error: error
|
|
---
|
|
|
|
# UI Scanner
|
|
|
|
Scan UI components to identify interaction issues: unresponsive buttons, missing feedback mechanisms, state not refreshing.
|
|
|
|
## Phase 2: Context Loading
|
|
|
|
| Input | Source | Required |
|
|
|-------|--------|----------|
|
|
| Project path | Task description CONTEXT | Yes |
|
|
| Framework | Task description CONTEXT | Yes |
|
|
| Scan scope | Task description CONSTRAINTS | Yes |
|
|
|
|
1. Extract session path and project path from task description
|
|
2. Detect framework from project structure:
|
|
|
|
| Signal | Framework |
|
|
|--------|-----------|
|
|
| package.json has "react" | React |
|
|
| package.json has "vue" | Vue |
|
|
| *.tsx files present | React |
|
|
| *.vue files present | Vue |
|
|
|
|
3. Build file pattern list for scanning:
|
|
- React: `**/*.tsx`, `**/*.jsx`, `**/use*.ts`
|
|
- Vue: `**/*.vue`, `**/composables/*.ts`
|
|
|
|
### Wisdom Input
|
|
|
|
1. Read `<session>/wisdom/anti-patterns/common-ux-pitfalls.md` if available
|
|
2. Use anti-patterns to identify known UX issues during scanning
|
|
3. Check `<session>/wisdom/patterns/ui-feedback.md` for expected feedback patterns
|
|
|
|
### Complex Analysis (use CLI)
|
|
|
|
For large projects with many components:
|
|
|
|
```
|
|
Bash(`ccw cli -p "PURPOSE: Discover all UI components with user interactions
|
|
CONTEXT: @<project-path>/**/*.tsx @<project-path>/**/*.vue
|
|
EXPECTED: Component list with interaction types (click, submit, input, select)
|
|
CONSTRAINTS: Focus on interactive components only" --tool gemini --mode analysis`)
|
|
```
|
|
|
|
## Phase 3: Component Scanning
|
|
|
|
Scan strategy:
|
|
|
|
| Category | Detection Pattern | Severity |
|
|
|----------|-------------------|----------|
|
|
| Unresponsive actions | onClick/\@click without async handling or error catching | High |
|
|
| Missing loading state | Form submit without isLoading/loading ref | High |
|
|
| State not refreshing | Array.splice/push without reactive reassignment | High |
|
|
| Missing error feedback | try/catch without error state or user notification | Medium |
|
|
| Missing success feedback | API call without success confirmation | Medium |
|
|
| No empty state | Data list without empty state placeholder | Low |
|
|
| Input without validation | Form input without validation rules | Low |
|
|
| Missing file selector | Text input for file/folder path without picker | Medium |
|
|
|
|
For each component file:
|
|
1. Read file content
|
|
2. Scan for interaction patterns using Grep
|
|
3. Check for feedback mechanisms (loading, error, success states)
|
|
4. Check state update patterns (mutation vs reactive)
|
|
5. Record issues with file:line references
|
|
|
|
## Phase 4: Issue Report Generation
|
|
|
|
1. Classify issues by severity (High/Medium/Low)
|
|
2. Group by category (unresponsive, missing feedback, state issues, input UX)
|
|
3. Generate structured report:
|
|
|
|
```markdown
|
|
# UI Scan Report
|
|
|
|
## Summary
|
|
- Total issues: <count>
|
|
- High: <count> | Medium: <count> | Low: <count>
|
|
|
|
## Issues
|
|
|
|
### High Severity
|
|
| # | File:Line | Component | Issue | Category |
|
|
|---|-----------|-----------|-------|----------|
|
|
| 1 | src/components/Upload.tsx:45 | UploadForm | No loading state on submit | Missing feedback |
|
|
|
|
### Medium Severity
|
|
...
|
|
|
|
### Low Severity
|
|
...
|
|
```
|
|
|
|
4. Write report to `<session>/artifacts/scan-report.md`
|
|
5. Share state via team_msg:
|
|
```
|
|
team_msg(operation="log", session_id=<session-id>, from="scanner",
|
|
type="state_update", data={
|
|
total_issues: <count>,
|
|
high: <count>, medium: <count>, low: <count>,
|
|
categories: [<category-list>],
|
|
scanned_files: <count>
|
|
})
|
|
```
|
|
|
|
### Wisdom Contribution
|
|
|
|
If novel UX issues discovered that aren't in anti-patterns:
|
|
1. Write findings to `<session>/wisdom/contributions/scanner-issues-<timestamp>.md`
|
|
2. Format: Issue description, detection criteria, affected components
|