fix(connect-modal): close stuck dapp-kit WC QR modal after handshake#630
Merged
Merged
Conversation
When connecting via WalletConnect through vechain-kit's custom modal,
`setSource('wallet-connect') + connect()` causes dapp-kit's signer to
call `CustomWalletConnectModal.openModal({uri})`, which fires
`vdk-open-wc-qrcode` and pops dapp-kit-ui's own `<vdk-connect-modal>`
with the QR on top of ours. That modal only auto-closes when the user
clicks through dapp-kit-ui's own source picker (its `onSourceClick`
calls `n.modal.close()` after `wallet.connect()` resolves). Since we
drive the connect from our hook, that path never runs and the QR
modal stays up post-handshake. Worse, the X button's `handleClose`
calls `wallet.disconnect()` whenever `walletConnectQRcode` is set —
so the user's only out also disconnects them.
Fix: after `dappKitConnect()` resolves for `wallet-connect`, call
`useDAppKitWalletModal().close()`. That dispatches
`vdk-close-wallet-modal` (only sets `open=false`; no disconnect side
effect, since disconnect lives inside `handleClose`, not the
close-event listener).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughThe hook ChangesWalletConnect QR Modal Closing
🎯 2 (Simple) | ⏱️ ~15 minutes Possibly related PRs
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Contributor
🚀 Playground preview deployed!Preview URL: https://preview.vechainkit.vechain.org/fixwallet-connect-qr-modal-stuck-open/playground |
Contributor
|
Size Change: +2.48 kB (+0.03%) Total Size: 8.84 MB
ℹ️ View Unchanged
|
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.
Summary
Fixes a WalletConnect bug introduced with the custom connect modal in #611.
When a user picked WalletConnect from vechain-kit's own modal, scanned the QR with their phone and approved, the kit reflected the connection in the background (button showed the connected address/domain) — but dapp-kit-ui's QR modal stayed open on top, and clicking its X disconnected the user we'd just connected.
Root cause
setSource('wallet-connect') + connect()causes dapp-kit's signer to callCustomWalletConnectModal.openModal({ uri }), which fires thevdk-open-wc-qrcodeevent and pops dapp-kit-ui's own<vdk-connect-modal>to display the QR.That modal only auto-closes when the user clicked through dapp-kit-ui's own
onSourceClickhandler — it callsn.modal.close()afterwallet.connect()resolves (gated byalwaysShowConnect, which we have on). Because we drive the connect fromuseConnectWithDappKitSource, that path never runs and the QR modal stays up.And the modal's X button triggers:
Since
walletConnectQRcodeis still set after a successful handshake, the X disconnects the freshly-connected wallet.Using
useDAppKitWalletModal()directly avoids this because the user-click goes through dapp-kit-ui'sonSourceClick, which does calln.modal.close()post-handshake.Fix
After
dappKitConnect()resolves forwallet-connect, calluseDAppKitWalletModal().close(). That dispatchesvdk-close-wallet-modal, whose only listener setsopen = false— no disconnect side effect, since the disconnect path lives insidehandleClose, not the close-event listener.Test plan
loginMethods=['dappkit']legacy path still routes throughuseDAppKitWalletModal()directly and behaves as before🤖 Generated with Claude Code
Summary by CodeRabbit