-
Notifications
You must be signed in to change notification settings - Fork 62
feat(walletkit): Move to in-app browser approach for payments + fixes #350
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Merged
Merged
Changes from 4 commits
Commits
Show all changes
7 commits
Select commit
Hold shift + click to select a range
d2550eb
fix(walletkit): Fix payment form keyboard handling and remove step pills
ignaciosantise da55b77
fix(walletkit): Improve iOS WebView keyboard handling with VisualView…
ignaciosantise 13c6d1a
poc(walletkit): Add in-app browser for payment data collection
ignaciosantise 180af77
fix(walletkit): Add lifecycle listener to handle in-app browser dismi…
ignaciosantise c16a184
merge: Resolve conflicts with develop
ignaciosantise abf6bc8
refactor(walletkit): Remove WebView and test form, use in-app browser…
ignaciosantise c3adefb
fix(walletkit): Replace remaining _showCollectDataWebView reference
ignaciosantise File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
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
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
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
152 changes: 152 additions & 0 deletions
152
packages/reown_walletkit/example/lib/walletconnect_pay/assets/test_form.html
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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,152 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> | ||
| <title>Identity Check</title> | ||
| <style> | ||
| * { box-sizing: border-box; margin: 0; padding: 0; } | ||
| body { | ||
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; | ||
| background: #fff; | ||
| color: #141414; | ||
| padding: 24px 16px; | ||
| min-height: 100vh; | ||
| } | ||
| h1 { font-size: 22px; font-weight: 700; margin-bottom: 8px; } | ||
| .subtitle { font-size: 14px; color: #787878; margin-bottom: 24px; } | ||
| .field { margin-bottom: 16px; } | ||
| .field label { | ||
| display: block; | ||
| font-size: 13px; | ||
| color: #787878; | ||
| margin-bottom: 6px; | ||
| } | ||
| .field input, .field select { | ||
| width: 100%; | ||
| height: 52px; | ||
| border: 1px solid #e0e0e0; | ||
| border-radius: 16px; | ||
| padding: 0 16px; | ||
| font-size: 16px; | ||
| color: #141414; | ||
| background: #fafafa; | ||
| outline: none; | ||
| -webkit-appearance: none; | ||
| } | ||
| .field input:focus, .field select:focus { | ||
| border-color: #3396ff; | ||
| border-width: 2px; | ||
| background: #fff; | ||
| } | ||
| .field select { padding-right: 32px; } | ||
| .actions { margin-top: 32px; } | ||
| .btn-primary { | ||
| width: 100%; | ||
| height: 52px; | ||
| background: #3396ff; | ||
| color: #fff; | ||
| border: none; | ||
| border-radius: 16px; | ||
| font-size: 16px; | ||
| font-weight: 600; | ||
| cursor: pointer; | ||
| } | ||
| .btn-primary:active { background: #2b80d9; } | ||
| .btn-cancel { | ||
| display: block; | ||
| width: 100%; | ||
| text-align: center; | ||
| margin-top: 16px; | ||
| color: #787878; | ||
| font-size: 14px; | ||
| text-decoration: none; | ||
| cursor: pointer; | ||
| } | ||
| </style> | ||
| </head> | ||
| <body> | ||
| <h1>One-time identity check</h1> | ||
| <p class="subtitle">We need to collect a few details to meet legal requirements.</p> | ||
|
|
||
| <form id="form"> | ||
| <div class="field"> | ||
| <label for="dob">Date of Birth</label> | ||
| <input type="text" id="dob" name="dob" placeholder="DD/MM/YYYY" inputmode="numeric" maxlength="10" required> | ||
| </div> | ||
| <div class="field"> | ||
| <label for="fullName">Full Name</label> | ||
| <input type="text" id="fullName" name="fullName" placeholder="John Doe" required> | ||
| </div> | ||
| <div class="field"> | ||
| <label for="address">Place of Birth Address</label> | ||
| <input type="text" id="address" name="address" placeholder="123 Main St"> | ||
| </div> | ||
| <div class="field"> | ||
| <label for="city">Place of Birth City</label> | ||
| <input type="text" id="city" name="city" placeholder="New York"> | ||
| </div> | ||
| <div class="field"> | ||
| <label for="country">Place of Birth Country</label> | ||
| <select id="country" name="country"> | ||
| <option value="">Select country...</option> | ||
| <option value="US">United States</option> | ||
| <option value="GB">United Kingdom</option> | ||
| <option value="DE">Germany</option> | ||
| <option value="FR">France</option> | ||
| <option value="ES">Spain</option> | ||
| <option value="IT">Italy</option> | ||
| <option value="JP">Japan</option> | ||
| <option value="KR">South Korea</option> | ||
| <option value="BR">Brazil</option> | ||
| <option value="AR">Argentina</option> | ||
| <option value="MX">Mexico</option> | ||
| <option value="CA">Canada</option> | ||
| <option value="AU">Australia</option> | ||
| <option value="IN">India</option> | ||
| <option value="CN">China</option> | ||
| <option value="NG">Nigeria</option> | ||
| <option value="ZA">South Africa</option> | ||
| <option value="CH">Switzerland</option> | ||
| <option value="SG">Singapore</option> | ||
| <option value="AE">United Arab Emirates</option> | ||
| </select> | ||
| </div> | ||
|
|
||
| <div class="actions"> | ||
| <button type="submit" class="btn-primary">Continue</button> | ||
| <a id="cancel" class="btn-cancel">Cancel</a> | ||
| </div> | ||
| </form> | ||
|
|
||
| <script> | ||
| // Auto-format DOB field as DD/MM/YYYY | ||
| document.getElementById('dob').addEventListener('input', function(e) { | ||
| var v = this.value.replace(/\D/g, ''); | ||
| if (v.length > 8) v = v.slice(0, 8); | ||
| if (v.length >= 5) { | ||
| this.value = v.slice(0, 2) + '/' + v.slice(2, 4) + '/' + v.slice(4); | ||
| } else if (v.length >= 3) { | ||
| this.value = v.slice(0, 2) + '/' + v.slice(2); | ||
| } else { | ||
| this.value = v; | ||
| } | ||
| }); | ||
|
|
||
| var params = new URLSearchParams(window.location.search); | ||
| var fallback = 'https://appkit-lab.reown.com/flutter_walletkit_internal'; | ||
| var successUrl = params.get('successUrl') || fallback; | ||
| var errorUrl = params.get('errorUrl') || fallback; | ||
|
|
||
| document.getElementById('form').addEventListener('submit', function(e) { | ||
| e.preventDefault(); | ||
| window.location.href = successUrl + '?status=success'; | ||
| }); | ||
|
|
||
| document.getElementById('cancel').addEventListener('click', function(e) { | ||
| e.preventDefault(); | ||
| window.location.href = errorUrl + '?status=cancelled'; | ||
| }); | ||
| </script> | ||
| </body> | ||
| </html> | ||
Oops, something went wrong.
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.
Uh oh!
There was an error while loading. Please reload this page.