Skip to content

feat(wallet-picker): show MyQRLWallet as a single row - #51

Merged
moscowchill merged 2 commits into
devfrom
feat/single-myqrlwallet-row
Sep 25, 2026
Merged

moscowchill merged 2 commits into
devfrom
feat/single-myqrlwallet-row

Conversation

@moscowchill

Copy link
Copy Markdown
Contributor

Draft: merge after @qrlwallet/connect-ui 0.3.0 is on npm. The helper this PR uses ships in that release (connect PR #48). package.json already pins 0.3.0; package-lock.json gets its refresh in the same commit that unpins the merge, once the version resolves from the registry. Until then npm ci fails here by design, and every gate below was run against a locally packed 0.3.0 tarball.

Why

MyQRLWallet announces itself twice over EIP-6963:

  • com.qrlwallet.extension, listed as "MyQRLWallet Extension"
  • com.qrlwallet.connect, listed as "MyQRLWallet", for relay pairing with the phone, web and desktop wallets

The picker showed both, so a user had to know which of two MyQRLWallet rows matched the wallet they have.

What

groupMyQrlWallet() from @qrlwallet/connect-ui folds the pair into one row named MyQRLWallet, carrying the 3A mark:

  • Extension installed: clicking the row connects through the extension. A separate "Use phone or desktop app" button under it starts relay pairing.
  • Extension absent: clicking the row starts relay pairing, and there is no second button.
  • The rdns line on that row is replaced by plain text naming the path a click takes, "Browser extension" or "Phone, web or desktop".

The QRL Web3 Wallet keeps its own row, icon and rdns line, and the picker still surfaces only QRL-capable wallets.

poolStore.connectWallet() is unchanged. Both buttons hand it a uuid and it still resolves the transport from the rdns, so the relay retirement, attempt guard and reset guard paths are untouched.

discoveredWallets becomes a discriminated union (MyQrlWalletRow | OtherWalletRow) exported under the existing DiscoveredWallet name.

The store imports @qrlwallet/connect-ui/wallets, the dependency-free subpath. The store tests load poolStore.ts in plain Node, where the package index would pull in the DOM pairing modal and throw on HTMLElement.

Screenshots

Headless Chromium at 1280 and 390 wide, with faked eip6963:announceProvider events:

  • extension announced: one "MyQRLWallet / Browser extension" row plus the "Use phone or desktop app" action
  • extension absent: one "MyQRLWallet / Phone, web or desktop" row, no secondary action
  • with theqrl.org and io.metamask also announced: the QRL Web3 Wallet keeps its own row with its own rdns line, and MetaMask stays filtered out as before

Gates

Command Result
npm run lint pass, zero warnings
npm run typecheck pass
npm test 42 pass, 0 fail
npm run build pass

Accessibility

The row body and the relay action are two separate buttons in that focus order. The action carries aria-label="Use phone or desktop app to connect MyQRLWallet".

https://claude.ai/code/session_01LWKZ1b4FBetebjo1kcNHJ8

MyQRLWallet announces itself twice over EIP-6963: com.qrlwallet.extension
from the browser extension and com.qrlwallet.connect from the connect SDK,
which covers the phone, web and desktop wallets. The picker listed both, so
the user had to know which of two MyQRLWallet rows matched the wallet they
actually have.

groupMyQrlWallet() from @qrlwallet/connect-ui folds the pair into one row
named MyQRLWallet, carrying the 3A mark. Clicking the row connects through
the extension when it is installed, and a separate "Use phone or desktop
app" button under it starts relay pairing. Without the extension the row
itself starts relay pairing and there is no second button. The rdns line is
replaced on that row by plain text naming the path a click takes.

Every other announced wallet keeps its own row, its own icon and its own
rdns line. The store's connect path is unchanged: both buttons hand a uuid
to connectWallet(), which still resolves the transport from the rdns.

The store imports the dependency-free @qrlwallet/connect-ui/wallets subpath
because the store tests load this module in plain Node, where the package
index would pull in the DOM pairing modal.

Gates: npm run lint (zero warnings), npm run typecheck, npm test (42 pass),
npm run build. Validated locally against a packed connect-ui 0.3.0.

Claude-Session: https://claude.ai/code/session_01LWKZ1b4FBetebjo1kcNHJ8
@moscowchill
moscowchill marked this pull request as ready for review September 25, 2026 08:29
@moscowchill
moscowchill merged commit 5957380 into dev Sep 25, 2026
2 checks passed
@moscowchill
moscowchill deleted the feat/single-myqrlwallet-row branch September 25, 2026 17:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant