Skip to content
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

🤝 [19834] Add dapp connection flow with a basic design #20204

Merged

Conversation

shivekkhurana
Copy link
Contributor

Summary

This is an ongoing effort to implement wallet connect. This PR connects the existing methods to the universal qr code scanner. In case a valid Wallet Connect QR is scanned, the user gets an option to accept the connection.

In case the QR code is expired or the wallet connect version is not 2, the user gets a relevant error toast.

Review notes

  • Hard coded the first account
  • The data item component doesn't support networks or accounts yet
  • The quo category component cannot show a data-item yet
  • The above two points mean that networks or accounts cannot be changed
  • I didn't add the validation to ensure we support required namespaces
  • Connected accept and decline button

Platforms

  • Android
  • iOS

Areas that maybe impacted

  • Global QR scanner

Steps to test

  • Goto https://lab.web3modal.com/library/ethers-siwe/
  • Select the mainnet in networks (this is important)
  • Click Connect Wallet, a QR code will pop up
  • Use the universal scanner to scan that QR code, you'll see a screen to accept or reject the session

status: ready

@shivekkhurana shivekkhurana linked an issue May 28, 2024 that may be closed by this pull request
8 tasks
@shivekkhurana shivekkhurana requested review from alwx and clauxx May 28, 2024 09:56
@shivekkhurana shivekkhurana self-assigned this May 28, 2024
@shivekkhurana shivekkhurana added the wallet-connect: UI Adding missing UI on top of the existing functionality and polishing it based on the descopeddesings label May 28, 2024
@shivekkhurana shivekkhurana modified the milestone: 2.30.0 Beta May 28, 2024
@status-im-auto
Copy link
Member

status-im-auto commented May 28, 2024

Jenkins Builds

Click to see older builds (23)
Commit #️⃣ Finished (UTC) Duration Platform Result
✔️ ec66391 #1 2024-05-28 09:58:05 ~6 min tests 📄log
✔️ ec66391 #1 2024-05-28 10:01:39 ~9 min android-e2e 🤖apk 📲
✔️ ec66391 #1 2024-05-28 10:02:02 ~10 min ios 📱ipa 📲
✔️ ec66391 #1 2024-05-28 10:02:38 ~10 min android 🤖apk 📲
✔️ b3403a5 #2 2024-05-30 10:49:56 ~4 min tests 📄log
✔️ b3403a5 #2 2024-05-30 10:53:01 ~7 min android-e2e 🤖apk 📲
✔️ b3403a5 #2 2024-05-30 10:53:07 ~7 min android 🤖apk 📲
✔️ b3403a5 #2 2024-05-30 10:55:07 ~9 min ios 📱ipa 📲
70f399f #3 2024-06-03 12:49:01 ~2 min tests 📄log
2b749c3 #4 2024-06-03 12:52:32 ~2 min tests 📄log
✔️ 2b749c3 #4 2024-06-03 12:57:25 ~7 min android-e2e 🤖apk 📲
✔️ 2b749c3 #4 2024-06-03 12:58:18 ~8 min android 🤖apk 📲
✔️ 2b749c3 #4 2024-06-03 13:00:26 ~10 min ios 📱ipa 📲
✔️ 8179762 #6 2024-06-04 07:16:26 ~4 min tests 📄log
✔️ 8179762 #6 2024-06-04 07:19:07 ~7 min android 🤖apk 📲
✔️ 8179762 #6 2024-06-04 07:19:12 ~7 min android-e2e 🤖apk 📲
✔️ 8179762 #6 2024-06-04 07:20:46 ~8 min ios 📱ipa 📲
✔️ 7f12425 #7 2024-06-04 11:48:50 ~4 min tests 📄log
✔️ 7f12425 #7 2024-06-04 11:52:58 ~8 min android 🤖apk 📲
✔️ 7f12425 #7 2024-06-04 11:53:18 ~8 min android-e2e 🤖apk 📲
✔️ 7f12425 #7 2024-06-04 11:53:37 ~9 min ios 📱ipa 📲
126f2a9 #8 2024-06-04 12:02:31 ~2 min tests 📄log
✔️ 126f2a9 #8 2024-06-04 12:07:03 ~7 min android 🤖apk 📲
Commit #️⃣ Finished (UTC) Duration Platform Result
6f61ac9 #9 2024-06-04 12:10:48 ~3 min tests 📄log
✔️ 6f61ac9 #9 2024-06-04 12:15:07 ~7 min android-e2e 🤖apk 📲
✔️ 6f61ac9 #9 2024-06-04 12:15:10 ~7 min android 🤖apk 📲
✔️ 6f61ac9 #9 2024-06-04 12:16:36 ~8 min ios 📱ipa 📲
✔️ 64d1550 #11 2024-06-04 12:50:03 ~4 min tests 📄log
✔️ 64d1550 #11 2024-06-04 12:53:54 ~8 min android-e2e 🤖apk 📲
✔️ 64d1550 #11 2024-06-04 12:53:58 ~8 min android 🤖apk 📲
✔️ 64d1550 #11 2024-06-04 12:54:56 ~9 min ios 📱ipa 📲

Copy link
Member

@clauxx clauxx left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

After testing I noticed that once you press connect and it's successful, the modal doesn't disappear.

@clauxx clauxx requested review from J-Son89 and ulisesmac May 28, 2024 14:56
@clauxx
Copy link
Member

clauxx commented May 28, 2024

@shivekkhurana added some more reviewers so it's not only our team reviewing 😅

EDIT: also no need to add the epic labels on PRs. They should be used only for issues

@clauxx clauxx removed the wallet-connect: UI Adding missing UI on top of the existing functionality and polishing it based on the descopeddesings label May 28, 2024
@shivekkhurana shivekkhurana force-pushed the 19834-add-dapp-connection-flow-with-a-basic-design branch 2 times, most recently from 70f399f to 2b749c3 Compare June 3, 2024 12:49
@shivekkhurana shivekkhurana force-pushed the 19834-add-dapp-connection-flow-with-a-basic-design branch 2 times, most recently from 7f12425 to 126f2a9 Compare June 4, 2024 11:59
@shivekkhurana shivekkhurana force-pushed the 19834-add-dapp-connection-flow-with-a-basic-design branch from 6f61ac9 to adeb1a3 Compare June 4, 2024 12:41
- IDK why, trying things out
- My handler was not being called because I wrote the code in a
different QR scanner
- Hard coded the first account
- The data item component doesn't support networks or accounts yet
- The quo category component cannot show a data-item yet
- Connected accept and decline button
@shivekkhurana shivekkhurana force-pushed the 19834-add-dapp-connection-flow-with-a-basic-design branch from adeb1a3 to 64d1550 Compare June 4, 2024 12:45
@shivekkhurana shivekkhurana merged commit 6ea39b5 into develop Jun 4, 2024
6 checks passed
@shivekkhurana shivekkhurana deleted the 19834-add-dapp-connection-flow-with-a-basic-design branch June 4, 2024 12:56
shivekkhurana added a commit that referenced this pull request Jun 4, 2024
@shivekkhurana shivekkhurana restored the 19834-add-dapp-connection-flow-with-a-basic-design branch June 4, 2024 13:24
shivekkhurana added a commit that referenced this pull request Jun 5, 2024
…0325)

* 🔳 QR on success not being called

- IDK why, trying things out

* 🙃 Stupid of me

- My handler was not being called because I wrote the code in a
different QR scanner

* ✅ Approval screen taking shape

* 🧹 Lint fix

* 🎛️ Wallet connect session screen shows up

- Hard coded the first account
- The data item component doesn't support networks or accounts yet
- The quo category component cannot show a data-item yet
- Connected accept and decline button

* 🧰 Fix review issues

* 🔨 Fix lint

* 🔧 Rename event and move dispatch

* 🔧 Fix lint

* 🎏 Add ff for wc scanner

- Bring back missing event
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

Add dApp connection flow with a basic design
5 participants