Skip to content

feat: ER diagram visualization with Sugiyama layout#651

Merged
datlechin merged 24 commits intomainfrom
feat/er-diagram
Apr 9, 2026
Merged

feat: ER diagram visualization with Sugiyama layout#651
datlechin merged 24 commits intomainfrom
feat/er-diagram

Conversation

@datlechin
Copy link
Copy Markdown
Collaborator

Summary

  • ER diagram showing all tables in the current schema with columns and FK relationships
  • Sugiyama layered layout (top-to-bottom flow, barycentric crossing minimization)
  • Crow's foot notation on FK edges
  • Drag-to-reposition table nodes, position persistence across sessions
  • Pan canvas via click-drag on empty space or scroll wheel/trackpad
  • Zoom via toolbar buttons
  • Compact mode (PK + FK columns only)
  • Export to PNG
  • Entry points: sidebar context menu + menu bar
  • Single Canvas imperative drawing — handles 300+ tables smoothly

Closes #186

New files (9)

  • ERDiagramModels.swift — graph data model
  • ERDiagramLayout.swift — Sugiyama layout algorithm
  • ERDiagramPositionStorage.swift — UserDefaults persistence
  • ERDiagramViewModel.swift — load, layout, drag, compact, export
  • ERDiagramView.swift — single Canvas with imperative drawing + manual hit-test
  • ERTableNodeView.swift — SwiftUI node view (used for export)
  • ERDiagramEdgeRenderer.swift — crow's foot edge drawing
  • ERDiagramToolbar.swift — zoom, compact, reset, export controls
  • MainContentCoordinator+ERDiagram.swift — tab opening logic

Test plan

  • Right-click sidebar → "View ER Diagram" → diagram loads with all tables
  • FK edges drawn with crow's foot notation between related tables
  • Drag a table node → repositions, persists after tab close/reopen
  • Click-drag on empty space → pans the canvas
  • Scroll wheel/trackpad → pans the canvas
  • Zoom +/- buttons work
  • Compact mode toggle → shows only PK + FK columns
  • Export PNG → saves correct image
  • Reset Layout → returns to computed Sugiyama positions
  • 300+ tables database → smooth pan/zoom
  • Dark mode → correct colors

datlechin added 24 commits April 9, 2026 15:39
…gram

- Extract ERDiagramNodeRenderer from View (100+ lines drawing logic → enum with named constants)
- Add @ObservationIgnored to 9 internal ViewModel properties (prevents 60fps spurious redraws)
- Fix Timer actor bridge with MainActor.assumeIsolated
- Fix NSCursor push/pop stack corruption with state tracking
- Replace DispatchQueue.main.asyncAfter timing hack with signal-based needsInitialFit
- Cache canvasSize as stored property (was O(n) computed per access)
- Consolidate zoom(to:anchor:) — pinch and buttons share one code path
- Remove dead nodeHeights dictionary (never written)
- Extract makeExportView() — dedup export/clipboard rendering
- Capture graph state before Canvas closure (correct observation dependencies)
- Add @mainactor to ERDiagramPositionStorage
- Extract ResolvedEdge struct from anonymous 5-tuple in edge renderer
- Port routing: use actual edge gap instead of center distance for port selection
- Add fit-to-window, Cmd+scroll zoom, Cmd+C copy, accessibility labels, empty state
- Fix view identity reuse causing "Loading forever" on second ER diagram open
- Delete dead ERTableNodeView.swift
@datlechin datlechin merged commit 0a44408 into main Apr 9, 2026
2 checks passed
@datlechin datlechin deleted the feat/er-diagram branch April 9, 2026 14:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat: ER diagram support

1 participant