Skip to content

[refactor] Split the CanvasWorkspace mega-component #174

Closed

Description

@hsliuustc0106

Context

src/canvas/CanvasWorkspace.tsx is 6,761 lines. The core Workspace() is a single function that holds 50 useState, 26 useEffect and 15 useCallback hooks. All canvas state and side effects are concentrated in one place, which makes it hard to unit test and risky to change.

Scope

  • Extract sub-components and hooks by responsibility: canvas interaction, selection, generation, history, and import/export.
  • Converge state into a reducer/context instead of dozens of scattered useState calls.
  • Add behaviour tests before restructuring so behaviour is pinned.

Acceptance criteria

  • The file is substantially smaller and Workspace()'s state/effect counts drop below an agreed maintainable threshold.
  • Behaviour is unchanged; new canvas unit tests cover the main interactions.
  • npm run check:i18n and the existing checks stay green.

Dependencies / notes

Activity

  1. added
    type:refactorInternal restructuring with unchanged behaviour
    area:canvasCanvas, nodes and direct manipulation
    priority:p0Blocks the agreed release scope
    on Nov 6, 2026
  2. added a commit that references this issue on Nov 6, 2026
    7042276
  3. added a commit that references this issue on Nov 7, 2026
    895879b
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    area:canvasCanvas, nodes and direct manipulationpriority:p0Blocks the agreed release scopetype:refactorInternal restructuring with unchanged behaviour

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions