.
CapacitorJS plugin for Solana dApps
TLDR;
Install the plugin for use in any web app: "npm i solana-wallet-adaptor-capacitor"
API notes are here
What is this project?
This project exists to help drive the adoption of Solana SDKs across mobile & web. The idea is make it easier for more developers to build cross-platform dApps by providing an open source CapacitorJS plugin based on the existing Solana SDKs
Capacitor is part of the Ionic ecosysystem and has a large and active community of developers. Capacitor/Ionic is found in approximately 10% of all Apps on Google Play and the App Store and averages around 200,000 weekly downloads on npm.
By offering a Capacitor plugin we make it easier for Capacitor/Ionic community to start building on Solana.
What is Capacitor?
Capacitor is a cross-platform native runtime for web apps. Capacitor plugins provide a bridge layer, which allows web developers building cross-platform apps to access native functionality from a single API.
A detailed description and documentation can be found at https://capacitorjs.com/.
Current State
The plugin was built as a to illustrate the concept in just over a week at the Singapore Solana Summer Camp 2022. It is definitely not ready for production use.
The plugin is a wrapper around the Kotlin "fakedapp" Android application build by the Solana Mobile team (see https://github.com/solana-mobile/mobile-wallet-adapter/tree/main/android/fakedapp). It allows a developer building a web app to access to all the methods in MainViewModel.kt in the underlying Kotlin project.
Wallet detection functionality has also been added. The plugin is able to detect which apps are installed and available in the environment in which it is running (i.e. web browser or Android).
The current implementation for Android relies on manifest permissions settings that may require prior agreement from moderators for Play Store distribution.
This functionlity is only currently only implemented for wallets that offer transaction / deeplink functionality.
Demo & Installation
The code is this repo is the Capacitor source code for the plugin.
There is a companion repo which contains a demo Angular app. This can be deployed to the web and Android devices using Android studio and the Ionic/Capacitor CLI. Usage instructions are in the demo repo readme.
A short presentation given at the Singapore Summer Camp is here. It contains a link to an even shorter demo video.
Next steps
Overall direction
I propose to run this project on an open source community-backed basis with a permissive license e.g. MIT/Apache2. Solana is already known for the strength of it's developer community so my hope is that there will be appetite from the community to support this project.
At the Summer Camp I was also in touch with Max Lynch who is CEO and founder of Ionic/Capacitor. Whilst I do not want to speak for him here, over the years I have seen Max and his team go out of their way to support the CapacitorJS community. I am sure the Ionic folks would be able to help promote a Solana plugin to the community if we can create something production ready.
Project design
Through the Summer Camp I focused on creating a working POC focused on the new Android SDK for the 'fakedapp' provided by the core team. In the long run I see a case for two plugins, one for dApps and another for wallet projects. This would depend on the Solana Mobile team's roadmap and plans for the core libraries.
I will post my notes on a potential API for the Capacitor plugin in the next day or so.
Code / existing implementation
Because the focus was on allowing web developers to access the 'fakedapp' native functionality, some more thought is required around how the 'fakedapp' functionality maps to the functionality provided by the web wallet adaptor.
The demo application fully replicates the 'fakedapp' app. Additionally it allows developers get available wallets for any given environment. The next step will be to map 'fakedapp' functionality to the web SDKs the define an appropriate API/interfaces.
The Angular demo app which was written in one sitting also needs to be cleaned up to make it easier to see what is happening.
I am not a Kotlin developer so I am sure there is room for improvement within the Android implementation. Currently the approach to managing state in the app is to push data to the web layer, which I suspect is not ideal. Results from the co-routines are returned to the web layer by inserting the plugin calls to the Kotlin functions and then resolving them at the right point in the code.
No serious thought has been given to securing the plugin yet, nor has it been extensively tested.