Release 0.22.2

[aaronstevenwhite]

Summary

Three faults in the citation network, reported on the deployed 0.22.1.

Arrows ran through the papers and overshot them. The cause was routing, not stacking. React Flow routes an edge between handles, and a handle is fixed to one side of its node — my target handle sat at the top, so an edge whose cited paper was above its citing one had to travel up through that paper's body to reach its top edge. That put the line across the pill and the arrowhead inside it. Edges now compute their own endpoints from the two node outlines, meeting whichever point faces the other node. The zIndex change in 0.22.1 treated a symptom of this and did not fix it; that zIndex is gone.

The line showed through the arrowhead. The fade was element opacity, which applies to the path and the marker alike, so the two composited where they overlap. The fade lives in the stroke colour now and the arrowhead takes exactly that colour.

Papers beyond one citation were labelled. This was in the original brief and I missed it. A paper more than one citation from the focus or the current selection is drawn as a 12px dot with no text; it grows into a labelled pill the moment it attaches to either. Hovering still names any paper in full.

Related Issues

None.

Type of Change

• Bug fix (non-breaking change that fixes an issue)
• New feature (non-breaking change that adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)
• Refactoring (no functional changes)
• Documentation update

How Has This Been Tested?

Verified in a browser against live production data before deploying, by measurement rather than by eye — the previous attempt was signed off on a screenshot I read wrongly.

Programmatic checks on the rendered graph, both with and without a paper selected:

• Overshoot: 3,800 points sampled along all 190 edges; 0 fell inside the box of either node at that edge's own ends.
• Stacking: every point where an edge crosses a third node, resolved with elementFromPoint — 72 crossings, node painted on top in all of them, edge in none.
• Labels: 53 papers, 4 labelled with no selection and 11 with one (4 primary, 7 secondary); 0 unlabelled dots carried any text; dot diameter 12px.
• Arrowheads inspected at magnification: solid, no line visible through them.

Unit coverage: 13 new geometry tests, including that an endpoint always lands on the outline and never inside it, and that a sampled segment between two papers enters neither. Plus tests that no edge sets opacity, that every arrowhead matches its line's colour, that every edge uses the floating type, and that a background node renders no text.

Full frontend suite 3015 green. pnpm typecheck (both projects), pnpm format:check, pnpm lint (0 errors) and the OpenAPI check all clean.

Screenshots

Compared against the reported view at the same zoom and the same selected node.

Checklist

General

• I have performed a self-review of my code
• Code follows style guide (npm run lint passes)
• Tests added/updated for changes
• All new and existing tests pass (npm test)
• Documentation updated (if applicable)

ATProto Compliance (required for data flow changes)

• Compliance tests pass (npm run test:compliance — 100% required)
• No writes to user PDSes
• BlobRef storage only (never blob data)
• Indexes can be rebuilt from firehose
• PDS source is tracked for staleness detection

Presentation only; no data flow touched.

Breaking Changes

• N/A — no breaking changes
• Migration path documented