feat: a clearer Device tab, with the enrol words kept on screen - #147
Merged
Merged
Conversation
version.ts dropped pre-release suffixes entirely, so a signer on 0.18.0-beta.17 was told "Up to date" against a bundled 0.18.0-beta.19: the page stated something false about the owner's own beta channel. Compare pre-release identifiers per SemVer 2.0 section 11 instead, so beta.17 < beta.19 < 0.18.0.
The tab used to show every concern twice (a "Your signer" summary list, then collapsible sections repeating the same names), split encryption controls across two sections that each pointed at the other, hid the five compare words behind "Waiting..." during the phone-unlock bench flow, and left most controls under the 44px touch target on a phone. Restructure around "is my signer all right, and if not, what do I do?": a Needs-attention block (present only when something needs a decision) above one grouped section list in a fixed order (After a power cut, Firmware, Backup, Network, Display and light, Diagnostics, Bridge), with Security folded into After a power cut next to the mode it changes and the bridge secret moved into Network. Keep every handler and device call unchanged. For the phone-unlock bench flow (UnlockPhones.svelte): keep the five words on screen throughout, including while waiting on the signer's button; fix the word-wrap that could split a word across lines; add a heading and a live region so step changes announce themselves and move focus; add a "Codes don't match: revoke" button on the done step, wired to the existing revoke(). Add WordPairs.svelte (the five-word compare, shared by the confirm and working steps so the words never move) and TogglePair.svelte (a shared pressed/unpressed pattern with aria-pressed for the Upright/Flipped, Detailed/Quiet and On/Off pairs). Scope new 44px touch targets to the Device tab only, so other tabs are unaffected. Fix the ambiguous numeric dates, the checkbox text with no space, an em dash in VaultUnlock's relay copy, and the Firmware row showing green for an unknown version.
A version with build metadata and no pre-release (0.14.0+abc) failed to parse after the pre-release change, so Sapwood would decline to compare it at all.
- Say once that the card can queue behind another approval, and that the signer's button only works once all five words have shown. - Keep the step announcement for screen readers only; each step already says the same on screen. - Let a long section state drop under its title instead of squeezing it. - Apply the 44px touch targets on narrow screens as well as touch pointers, without dropping the disclosure marker.
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.
A design review of the Device tab, from screenshots of every signer state on desktop, phone and tablet, then the build.
Phone enrolment
The tab
Firmware version check
Handlers and device calls are unchanged. The boot PIN, no-encryption and vault escrow warnings each stay directly above their action.
Checks: vitest 1131/1131, svelte-check clean, check:cli clean, build OK, chromium e2e 31/31.
Not checked: real iOS Safari, Firefox and Android Chrome; a screen reader; a full keyboard walk; anything on hardware.
Follow-up: 44px targets outside this tab (the header link, password eye, relay suggestion chips) are for an app-wide pass.