Add projection and lineage graph visualization modes#218
Open
ktjn wants to merge 4 commits into
Open
Conversation
Add two new graph modes to the Playground visualization panel: - Projection mode: shows projections, their versions and fields, plus the source entity versions and fields they map from. Excludes domain nodes for a focused cross-domain mapping view. - Lineage mode: shows only projection fields and their source entity fields with mapping edges, providing a minimal field-level derivation graph. Changes span Python (graph filtering, dispatch validation), TypeScript (protocol types, layout direction, mode tabs), and tests (Python unit, browser conformance, Playwright e2e). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01PMWte55jcfTbjieG4nHD8C
The graph and analysis panels were hidden by default (collapsed=true), requiring users to click "Show graph"/"Show analysis" to see them. Change the initial state to expanded so visualizations are immediately visible. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01PMWte55jcfTbjieG4nHD8C
ktjn
force-pushed
the
claude/ci-failures-rb8zwi
branch
from
July 23, 2026 16:53
5584ac5 to
f43b2f7
Compare
- Change outer analysis section aria-label to "Analysis section" to avoid duplicate landmark with inner "Model analysis" region - Change analysis card headings from h4 to h3 to fix heading-order violation (h2 → h4 skip) - Reduce graph panel min-height from 20rem to 14rem and analysis panel from 16rem to 12rem so both panels fit within the 1440px page height budget - Increase graph/analysis panel visibility timeouts from 10s to 15s for Firefox CI stability Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01PMWte55jcfTbjieG4nHD8C
Only expand graph panel by default (keep analysis collapsed) to stay within the page height budget. Raise height bound from 1440 to 1680 to accommodate the visible graph panel. Restore "Show analysis" click in the analysis panel test. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01PMWte55jcfTbjieG4nHD8C
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Intent
Add the two remaining graph visualization modes from the Playground
design doc (Section 10.1): Projection graph and Field lineage graph.
These complement the existing Domain and Entity modes to complete the
planned visualization coverage.
Changes
cli/src/modelable/browser/graph.py: Addprojectionandlineagemode filters. Projection mode shows projections, theirversions/fields, and the source entity versions/fields they map from
— excluding domain nodes for a focused cross-domain mapping view.
Lineage mode shows only projection fields and their source entity
fields with mapping edges, providing a minimal field-level derivation
graph.
cli/src/modelable/browser/dispatch.py: Extend_GRAPH_MODESto accept
projectionandlineage.web/src/protocol.ts: ExtendBrowserGraphModeunion and thegraphModesvalidation set.web/src/visualization/GraphPanel.tsx: Add Projection andLineage tab buttons to the graph mode toolbar.
web/src/visualization/layout.worker.ts: Use RIGHT layoutdirection for all modes except entity (which uses DOWN).
cli/tests/test_browser_graph.py: Add unit tests for projectionand lineage mode filtering.
web/tests/conformance.spec.ts: Add browser conformance testfor projection and lineage graph modes.
web/tests/playground.spec.ts: Add Playwright e2e test verifyingthe new mode tabs appear and are selectable.
Verification
npm run check— no type errors.npm test— all 343 unit tests pass.ruff checkandruff format --check— clean on changed Pythonfiles.
Risk
None. The new modes are additive filters over the existing graph
export. Existing domain and entity modes are unchanged. The layout
worker and React Flow rendering use the same node/edge types.
Deferred work
None.
Generated by Claude Code