Skip to content

refactor: Decompose PianoRollCanvas.tsx (1391 lines) #1028

@ChuxiJ

Description

@ChuxiJ

Description

src/components/pianoroll/PianoRollCanvas.tsx is 1,391 lines combining canvas rendering with a complex mouse state machine for 5 edit modes.

Proposed Extraction

  • usePianoRollDrag.ts — Custom hook for drag state machine
  • PianoRollRenderer.ts — Pure canvas drawing functions
  • VelocityLaneRenderer.ts — Velocity lane drawing

Acceptance Criteria

  • PianoRollCanvas.tsx reduced to < 400 lines
  • All 5 edit modes work identically
  • Unit tests for drag state transitions

Metadata

Metadata

Assignees

No one assigned

    Labels

    priority: P1ImportantrefactorCode refactoring and architecture improvements

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions