React Native Support

[dnosk]

Is your feature request related to a problem? Please describe.
I'm looking to build wallet adapter for mobile apps.

Describe the solution you'd like
Ideally, this would function similar to current react UI example projects, but on mobile.

Describe alternatives you've considered
It's possible react UI would work inside of mobile, but popular wallets such as Phantom don't have a mobile app or a QR scan feature.

[jordaaash]

@dnosk is this something you would like to work on implementing?

[dnosk]

Appreciate the offer, I was more looking to implement into my own React Native app. Curious what contributing to solana labs looks like - any docs?

[jordaaash]

There aren't any docs on contributing, but the process is pretty simple.

I recommend following the steps here first just to make sure you are able to run it locally: https://github.com/solana-labs/wallet-adapter#build-from-source

If you have implementation questions or decisions you want to discuss, we can do that here.

After that, just fork the project, create a new branch, and open a pull request!

[jordaaash]

Also, it's worth noting that Phantom has a mobile app in beta testing. Slope has one in production. I believe Solflare has one in development.

[dnosk]

Awesome! Anyway to connect someone from those teams here (if you know them)?

[jordaaash]

Sure, I can loop some people in from those teams when there's a more detailed proposal to review. For now, I think it would help to establish the use cases, user flows, scope, and how it makes sense for it to be part of the project.

[jordaaash]

Closing this as out of scope. If you're interested in building this, please comment and we can reopen and discuss.

[tsdmrfth]

Hey everyone. I would like to discuss the issue. I am planning to build a mobile dApp using React Native and the app itself requires a wallet connection. I have spare time to build this. Also doing this could be a good profit for the Solana project ecosystem I think because you know React Native has a huge developer community. This library would make the development process of the React Native dApps much easier!

[jordaaash]

@tsdmrfth that's great! I reopened the issue, your contributions are very welcome. However, I might suggest creating a dedicated repository outside of this, and we can see if it makes sense as part of the core, or to link to as we do with the Angular packages here (and will soon do with Vue and Svelte). Is that okay?

[tsdmrfth]

@jordansexton Hey! Yeah, I can build something as a kind of an MVP version in a dedicated repository but before that, I'd like to discuss how that could be done in React Native and get some advice

[jordaaash]

I'd like to discuss how that could be done in React Native and get some advice

Sure. Fundamentally what I think we'd need is a standardized way for mobile wallet apps to communicate with other mobile apps, in both directions.

anza-xyz/solana-pay#26 proposes a mechanism for wallets to communicate with an HTTP endpoint, but this could potentially work with a deep link too.

The mobile app could deep link to solana: which wallets can register themselves to handle universal links from. This should prompt the user to choose a wallet app to handle the link, which would prompt the user to connect.

The link could contain a return deep link to get back to the app, with the public key of the wallet. The same could be done to sign transactions.

This is a bit clunky as UX goes, so we should also look at actions/intents on Android, Safari web extensions, and other native APIs that might work to communicate between two running apps.

We should also look at how WalletConnect and Metamask do these things, if they do at all. None of this is specific to React Native yet, but I think once we figure out the UX, that should be more straightforward.

[tsdmrfth]

@jordansexton The deep link solution seems possible to implement but in that case, it seems like we should define an app-to-app communication structure with the wallet provider app developers. I think we can connect someone from the wallet provider teams.
Also as an idea, how about using a WebView for the wallet connection? Do you think this is possible?

[jordaaash]

we should define an app-to-app communication structure with the wallet provider app developers. I think we can connect someone from the wallet provider teams.

I think the first step is to do some research on what technical solutions are available and the tradeoffs they have, and then define a spec proposal to gather feedback. I'm connected with most of the teams working on wallets that support Solana, but it helps to have a skeleton of specific ideas to build consensus around (this is what we did with Solana Pay).

Also as an idea, how about using a WebView for the wallet connection? Do you think this is possible?

I'm not sure what you mean. Can you lay out specifically how this would work and what the user flow would be?

[tsdmrfth]

I think the first step is to do some research on what technical solutions are available and the tradeoffs they have and then define a spec proposal to gather feedback. I'm connected with most of the teams working on wallets that support Solana, but it helps to have a skeleton of specific ideas to build consensus around (this is what we did with Solana Pay).

I have implemented the deep link feature to the current project at the company and it's pretty straightforward but for this package to work as intended each wallet provider should register itself for a deep link scheme and develop a handler mechanism to return public wallet addresses back. I think this may be the best solution for us. The deep linking works on both android and iOS without hassle as far as I've experienced during the development process of it on the company project.

I'm not sure what you mean. Can you lay out specifically how this would work and what the user flow would be?

It was just a idea that I was thinking on it maybe 2 months ago but I think that's way more complex than the deep link solution. So we can ignore it :)

[jordaaash]

each wallet provider should register itself for a deep link scheme and develop a handler mechanism to return public wallet addresses back. I think this may be the best solution for us.

I agree that this should be supported. But thinking beyond the crypto native crowd, jumping between two apps twice (to connect then sign a transaction, and for every transaction you need to sign) isn't great.

This is a bit clunky as UX goes, so we should also look at actions/intents on Android, Safari web extensions, and other native APIs that might work to communicate between two running apps.

We should also look at how WalletConnect and Metamask do these things, if they do at all.

Deep links are obvious. Let's start with the premise that we can do better than deep links and invalidate that first.

[tsdmrfth]

I agree that this should be supported. But thinking beyond the crypto native crowd, jumping between two apps twice (to connect then sign a transaction, and for every transaction you need to sign) isn't great.

Yeah, that could be annoying for the users.

Deep links are obvious. Let's start with the premise that we can do better than deep links and invalidate that first.

Right. I'll do my research about your suggestions!

[tsdmrfth]

Hi. I did lots of research about inter-app communication, WalletConnect, actions/intents on Android, and Safari web extensions.

Let's start with actions/intents on Android:
It looks like it can be used to solve communication between two apps but there is almost no difference for our use case between this and deep linking.

Safari web extensions:
It's not something related to React Native...

WalletConnect:
They have a JSON-RPC bridge server that pushes messages from dApps to the wallets back and forth. Once the connection with a wallet is initiated dApps will then be able to use the connector object to call functions of the object itself. This approach still needs a kind of handler mechanism in the wallet apps

[tsdmrfth]

I agree that this should be supported. But thinking beyond the crypto native crowd, jumping between two apps twice (to connect then sign a transaction, and for every transaction you need to sign) isn't great.

@jordansexton I was thinking about this. It's a problem for web dApps as well because you know each time users have to approve the transactions using their wallets' browser extension

[akelaholmes]

So just to be clear: right now there's no way for a iOS/mobile app to connect to the Phantom wallet app/any Solana wallet app right? Even if you spin up a webpage within the app to try to connect since there's no equivalent of WalletConnect on Solana?

[jordaaash]

To everyone -- please keep discussion here relevant to the issue, and to this project. If you don't understand the scope of this project or the difference between this library and wallets themselves, please use Discord for questions.

right now there's no way for a iOS/mobile app to connect to the Phantom wallet app/any Solana wallet app right?

This is a question for Phantom, not this project. But I believe the answer is no, it's currently not possible to connect to the Phantom mobile app from a mobile browser or another app.

Even if you spin up a webpage within the app to try to connect since there's no equivalent of WalletConnect on Solana?

The only way to connect with Phantom currently using this project is inside the Phantom app's dapp browser.

WalletConnect doesn't support Solana yet, and there are no wallets to my knowledge that use WalletConnect 2.0 which works for chains other than EVM chains.

[akelaholmes]

@jordansexton thank you!

[tsdmrfth]

@akelaholmes Can't say there is no way. Deep linking can be used still

[tsdmrfth]

WalletConnect doesn't support Solana yet, and there are no wallets to my knowledge that use WalletConnect 2.0 which works for chains other than EVM chains.

@jordansexton Do you think we need to wait for WalletConnect to support Solana chain? I think for Solana we need something special so which could be used for Solana Pay as well...

[ishan-torus]

Hey guys, we at web3auth , are building a SDK that requires minimal setup and enables you to have a wallet inbuilt in your dapp.
We use Chrome Custom Tabs and AuthenticationServices for a in app experience to the user.
It's in a early phase but we have made some good progress (attaching a recording of the same), currently we are having some issues with adding polyfills to use solana-web3.js in the rn environemt

solana.react.native.sdk.mp4

[tsdmrfth]

Hey, @ishan-torus Are you able to use one of the available wallets from this library?

[safaiyeh]

Hey all im happy to help here as much as possible to push towards supporting Solana on mobile.

Some concerns we faced at ME is that first-party buys are not allowed on the App Store. Meaning we aren't allowed to support buying directly on our native app. One step forward would be a good deep link standard across mobile wallets into their respect dapp browsers. Could help jump start some unification there rather than implementing every individual deep link SDK.

Would love some thoughts from the team! @jordansexton @tsdmrfth @ishan-torus

[tsdmrfth]

Hey @safaiyeh Do you have any idea about how a connection between dApp and wallet could establish?

[safaiyeh]

Hey @safaiyeh Do you have any idea about how a connection between dApp and wallet could establish?

For example, we pass a URL of the listing and it opens in the wallets web view & trigger the connect flow. Instead of wallet signing in our mobile apple

Phantom has done some good work here: https://phantom.app/blog/introducing-phantom-deeplinks