This PR proposes refactoring how the Mobile Wallet Adapter option is presented in the default WalletModal UI. Very open and looking forward to feedback and discussion.
Rationale
The MWA option is an important action on mobile, one which maximizes wallet choice, since it will allow selection of any user-installed wallets which support the agnostic MWA protocol.
This change aims to provide better context clues to the user around its usage. It replaces the current icon and text “Mobile wallet adapter”, which is not self-explanatory for users not familiar with what that means. The new wording is more descriptive and helps users understand the connection with the installed wallet apps on their phone.
Changes
In WalletModal, detect the mobileWalletAdapter and, if present, render:
On your phone: header
Use an installed wallet button below header
If other wallets are present, render a Other wallets: header
Next
If needed, we can additionally create a similar change in the UI for ant-design and material-ui.
Testing
Tested on a local build with the example app across these different test cases, making sure to test that non-MWA modal's are unaffected.
Refactor MWA option in Modal UI
This PR proposes refactoring how the Mobile Wallet Adapter option is presented in the default
WalletModalUI. Very open and looking forward to feedback and discussion.Rationale
The MWA option is an important action on mobile, one which maximizes wallet choice, since it will allow selection of any user-installed wallets which support the agnostic MWA protocol.
This change aims to provide better context clues to the user around its usage. It replaces the current icon and text “Mobile wallet adapter”, which is not self-explanatory for users not familiar with what that means. The new wording is more descriptive and helps users understand the connection with the installed wallet apps on their phone.
Changes
In
WalletModal, detect themobileWalletAdapterand, if present, render:On your phone:headerUse an installed walletbutton below headerOther wallets:headerNext
If needed, we can additionally create a similar change in the UI for
ant-designandmaterial-ui.Testing
Tested on a local build with the example app across these different test cases, making sure to test that non-MWA modal's are unaffected.