Polish five rough edges across designer, settings and custom nodes - #190
Merged
Conversation
Five small, independent usability fixes reported from daily use: - Designer node size now defaults to L instead of S. The persisted store bumps to version 2 and only lifts profiles still sitting on the old default, so a size picked from the stepper survives the change. - Settings > System moves the read-only System info tab to the far right, after every tab that actually edits configuration. Integrations stays first and remains the default section, so the deep links are untouched. - Settings > System > Security: every hardening switch now explains what it does, what happens when it is off, and where the boundary really is. Wording checked against PathGuard, SqlActivity, StartProgramActivity, WebhooksController and SecurityHardeningWarnings rather than the docs. The Remote pointer note was inline German and rendered German inside the English UI; it now goes through the i18n catalogue. - The support-log window starts ~30% taller in both view modes (table 540 -> 702, plain text 640 -> 832). Their localStorage keys move to .v2, otherwise a browser that already stored a height never sees the new default. The custom-node dialog gets its own note: it was the only page dialog using the shared .input-field class. That style is recessed and needs a raised surface to sink into, which ModalShell only provides in the dark skins. On light-grey it painted a flat beige box on a white panel and went lighter than the panel on focus, losing its outline exactly while in use. It now uses the outline chain every other admin dialog uses. Two real bugs fell out of that switch. .input-field is unlayered CSS and therefore beats every Tailwind utility from @layer utilities, so its width:100% silently killed the w-28/w-32/text-xs on the parameter rows - each row wrapped onto a line of its own - and squashed the icon-picker button in its auto grid column. nodepilot-ui/CLAUDE.md now describes the two field tiers instead of mandating .input-field everywhere, including why width must never be baked into a shared field constant.
Raising the node-size default to L moved the canvas geometry the hermetic suite was written against: fitView turns a larger node footprint into a different pan/zoom for the same seeded positions, and ai-assistant's step-b slid under the bottom-right minimap, which then swallowed its click - the exact hazard e2e/README.md already warns about. installDefaultMocks now pins nodeScaleIndex: 1 next to the existing designerTheme: 'classic' pin, for the same reason: both are geometry knobs, and letting either float means a presentation tweak reshuffles the canvas coordinates of unrelated specs. The scale itself stays covered by the unit tests (designStore, CanvasSettings). The seeds carry version: 2 to match the store's persist version. At version 1 the new migration would read the pinned sm as "still on the old default" and lift it straight back to lg, silently undoing the pin. seedExpertMode and seedAtelier replace the whole nodepilot-design key, so both re-assert the pin. toolbar-layout's two seeds are left alone: they deliberately exercise v1-profile hydration and assert toolbar state, not canvas geometry.
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
1 participant
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.
Five small, independent usability fixes reported from daily use. All frontend, no backend change.
1. Designer node size defaults to L instead of S
nodeScaleIndexmoves from1(sm) to3(lg). The persisted store bumps toversion: 2with a migration that only lifts profiles still sitting on the old default — a size picked from the stepper survives the change.2. System info tab moves to the far right
It is the only read-only tab in Settings → System, so it now sits after every tab that actually edits configuration. Nothing indexes into
TABS; Integrations stays first and remains the default section, so all four'integrations'fallbacks and their tests are untouched.3. Every hardening switch in Security now has a description
Seven toggles plus the two previously unexplained list/text fields. Each hint says what the switch does, what happens when it is off, and where the boundary really is. The wording was checked against
PathGuard,SqlActivity,StartProgramActivity,WebhooksControllerandSecurityHardeningWarnings— not against the docs — so e.g. the AllowedRoots hint states that the check runs on the NodePilot host and target-side ACLs stay authoritative for WinRM.Picked up on the way: the Remote pointer note at the bottom was inline German JSX and rendered German inside the English UI. It now goes through the i18n catalogue via
<Trans>.4. Support-log window starts ~30% taller
Table view 540 → 702 px (~30 rows instead of ~22), plain-text tail 640 → 832 px. Both
localStoragekeys move to.v2— that suffix exists for exactly this, and without the bump a browser that already stored a height would never see the new default.5. Custom-node dialog no longer breaks in the light skins
It was the only page dialog using the shared
.input-fieldclass. That style is recessed and needs a raised surface to sink into, whichModalShellonly provides in the dark skins (html.dark … .np-modal-panel). Onlight-greyit painted a flat beige#eae4dcbox on a white panel and went lighter than the panel on focus, losing its outline exactly while in use. It now uses the outline chain every other admin dialog uses, which works in every skin —focus:ring-blue-500is remapped onto--np-accent-ringfor non-blue skins.Two real bugs fell out of that switch:
.input-fieldis unlayered CSS and therefore beats every Tailwind utility from@layer utilities. Itswidth:100%silently killed thew-28/w-32/text-xson the ParamEditor rows, so every parameter row wrapped onto a line of its own.<button>that carried.input-field, sowidth:100%squashed it in itsautogrid column.src/nodepilot-ui/CLAUDE.mdnow describes the two field tiers (recessed.input-fieldon raised surfaces vs. the outline chain in page dialogs) instead of mandating.input-fieldeverywhere, including why a width must never be baked into a shared field constant.Verification
tsc --noEmitcleannpm run lint— 0 errors, 13 warnings, identical to the pre-change baseline (verified viagit stash)npm run test:run— 197 files, 2551 tests green, including new tests for the store migration, the security hints, the log-window height/key bump and the dialog field styleadmin-settings76.1 (now pins the tab order),custom-activities,diagnostics— 14 tests greensecblock verified (41/41)Deliberately out of scope
Trigger:Database:RequireConnectionRefhas no UI surface at all — no DTO inSecurityHardeningSettingsDto, noSettingsSchemaentry. Giving it one means a DTO, a controller section, a card, a CLI command and an MCP tool. That is a feature, not a description-text fix.