Skip to content

refactor: Decompose Timeline.tsx (1442 lines) #1027

@ChuxiJ

Description

@ChuxiJ

Description

src/components/timeline/Timeline.tsx is 1,442 lines acting as a mega-container for track rendering, scroll sync, keyboard navigation, playhead, and marker management.

Proposed Extraction

  • useTimelineKeyboard.ts — Extract 200+ line keyboard handler
  • useTimelineScroll.ts — Extract scroll sync logic
  • PlayheadOverlay.tsx — Playhead positioning and rendering
  • ArrangementMarkers.tsx — Loop markers, location markers

Acceptance Criteria

  • Timeline.tsx reduced to < 500 lines
  • Keyboard navigation fully preserved
  • Scroll sync works identically
  • All existing tests pass

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