Add a line-thickness slider for Graph, Code, and other link views - #93
Conversation
Follow-up to the Code canvas work in #82/#88. eorroe asked for a top-left slider that sets edge thickness across Graph, Code, and the other link-drawing views. Default stays 1 so current lines look the same. The value lives in localStorage under codeflow-ui-prefs. Co-authored-by: Braedon Saunders <braedonsaunders@users.noreply.github.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 8f2adb65d6
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
Accessing window.localStorage at the App useState and persist call sites threw SecurityError before readUiPrefs/writeUiPrefs could catch it. Resolve storage inside the helpers, keep the in-session thickness default at 1 when storage is blocked, and cover the throwing-getter case in tests. Co-authored-by: Braedon Saunders <braedonsaunders@users.noreply.github.com>
|
@codex review |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 5349d6786c
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
Those views already honor lineThickness but the gear and settings panel were limited to Graph, 3D Graph, and Code. The toolbar now follows vizUsesLineThickness. Extra layout sliders stay hidden on the views that do not use them. Co-authored-by: Braedon Saunders <braedonsaunders@users.noreply.github.com>
|
@codex review |
|
Codex Review: Didn't find any major issues. Can't wait for the next one! Reviewed commit: ℹ️ About Codex in GitHubYour team has set up Codex to review pull requests in this repo. Reviews are triggered when you
If Codex has suggestions, it will comment; otherwise it will react with 👍. Codex can also answer questions or update the PR. Try commenting "@codex address that feedback". |
Follow-up to the Code canvas work in #82 / #88. On 2026-08-21 eorroe asked for a top-left slider that sets line thickness for all views. Braedon deferred that (and 3D moving links) with "can wait." This PR ships the thickness slider only.
What this PR does
Adds a Thickness slider to the existing top-left Layout / settings panel (the gear next to zoom). Range is 1-6. Default is 1, which matches the current Graph/Code edge width so nothing changes until you move it.
The same value scales edges in every view that draws links:
The gear and Thickness control are now reachable in each of those views. Graph / 3D Graph / Code keep the existing zoom and layout sliders. Tree / Flow / Cluster / Bundle get the gear plus Thickness only.
Moving the slider updates Graph/Code/3D stroke width in place. It does not restart the force layout.
Persistence
Code-view Expand All / Wrap Text were never stored. This adds a small
localStorageprefs object atcodeflow-ui-prefsand writeslineThicknessthere. Reload keeps the last choice. Invalid or missing values fall back to 1.Storage access is acquired inside
resolveUiPrefsStorage/readUiPrefs/persistUiPrefs. App render and slider changes never touchwindow.localStorageat the call site. If the property throwsSecurityError(sandboxed iframe, blocked storage), the app stays up at thickness 1 and the slider still works for the session.Out of scope
Not in this PR, as requested:
Still one HTML file. No extra pages or Node runtime for the browser app.
How to verify
Tests
npm test: 174 pass / 0 failwindow.localStoragethrowsSecurityErrorand render/prefs still default to 1vizUsesLineThicknesscoverage for Tree / Flow / Cluster / BundlePlease review and merge when ready. No Codex review ping.