Generate architecture diagram for a feature or flow
Generates Mermaid diagrams for codebase features and flows with architecture analysis.
/plugin marketplace add harlan-zw/harlan-claude-code/plugin install harlan-claude-code@harlan-claude-codeGenerate a Mermaid diagram for "$ARGUMENTS".
Analyze the codebase to understand the flow/architecture
Choose diagram type based on subject:
flowchart - Process flows, decision treessequenceDiagram - API calls, async flows, request/responseclassDiagram - Type relationships, interfaceserDiagram - Data models, database schemastateDiagram-v2 - State machines, UI statesGenerate Mermaid diagram
flowchart TD
A[Component] --> B{Decision}
B -->|Yes| C[Action 1]
B -->|No| D[Action 2]
Save to .claude/diagrams/[subject].md:
# [Subject] Architecture
## Overview
[Brief description]
## Diagram
\`\`\`mermaid
[diagram code]
\`\`\`
## Key Files
- `path/to/file.ts` - description
- `path/to/other.ts` - description
## Notes
- [Any important decisions or trade-offs]
API Flow:
sequenceDiagram
Client->>+API: POST /endpoint
API->>+DB: Query
DB-->>-API: Result
API-->>-Client: Response
Component Tree:
flowchart TD
App --> Layout
Layout --> Header
Layout --> Main
Layout --> Footer
Main --> Router
State Machine:
stateDiagram-v2
[*] --> Idle
Idle --> Loading: fetch
Loading --> Success: resolve
Loading --> Error: reject
Success --> Idle: reset
Error --> Idle: retry