Skip to content

Commit

Permalink
Non EVM support
Browse files Browse the repository at this point in the history
  • Loading branch information
quetool committed Nov 5, 2024
1 parent 7fd5621 commit 3c903e4
Show file tree
Hide file tree
Showing 7 changed files with 117 additions and 41 deletions.
94 changes: 64 additions & 30 deletions docs/appkit/flutter/core/custom-chains.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -2,46 +2,80 @@

## Custom Networks addition and selection

AppKit already comes with a list of supported networks inside of `ReownAppKitModalNetworks` class. You can get default supported EVM networks by selecting `ReownAppKitModalNetworks.supported['eip155']` and, currently, only EVM Networks are supported (non-EVM support will come soon). Check the list of [supported networks](https://github.com/walletconnect/blockchain-api/blob/master/SUPPORTED_CHAINS.md#list-of-supported-chains)
AppKit already comes with a list of supported mainnets (including Solana mainnet) and testnets (including Solana testnet) inside of `ReownAppKitModalNetworks` class. This means that if you are looking to support EVM chains + Solana then there's nothing more you should tweak.

This class also comes with extra networks `ReownAppKitModalNetworks.extra['eip155']` and test networks `ReownAppKitModalNetworks.test['eip155']`, however, these are not included in the supported list by default.

If these chains are not enough for you or you don't want to support some of them you can modify the list associated to the namespace.

:::info note
It is important that this is done before AppKitModal configuration.
:::

### Adding extra and/or test networks to the supported list
However, this class can be modified in order to achieve the following results, and more:

```javascript
// Adding extra networks
final extraNetworks = ReownAppKitModalNetworks.extra['eip155'] ?? [];
ReownAppKitModalNetworks.addNetworks('eip155', extraNetworks);

// Adding test networks
final testNetworks = ReownAppKitModalNetworks.test['eip155'] ?? [];
ReownAppKitModalNetworks.addNetworks('eip155', testNetworks);
// You can add more EVM networks
List<ReownAppKitModalNetworkInfo> extraChains = [...];
ReownAppKitModalNetworks.addSupportedNetworks('eip155', extraChains);
```

### Removing Aurora network from the list
_Note: If you are adding a test network, set `isTestNetwork` property of `ReownAppKitModalNetworkInfo` to `true`_

```javascript
ReownAppKitModalNetworks.removeNetworks('eip155', ['1313161554']);
// Remove Solana networks (supports only EVM networks):
ReownAppKitModalNetworks.removeSupportedNetworks('solana');
```

### Adding a custom network
```javascript
// Remove every test network
ReownAppKitModalNetworks.removeTestNetworks();
```

```javascript
final customNetwork = ReownAppKitModalNetworkInfo(
name: 'Ethereum',
chainId: '1',
currency: 'ETH',
rpcUrl: 'https://ethereum-rpc.publicnode.com',
explorerUrl: 'https://etherscan.io',
isTestNetwork: false,
);

ReownAppKitModalNetworks.addNetworks('eip155', [customNetwork]);
// Add more non-EVM networls, such as Polkadot
ReownAppKitModalNetworks.addSupportedNetworks('polkadot', [
ReownAppKitModalNetworkInfo(
name: 'Polkadot',
chainId: '91b171bb158e2d3848fa23a9f1c25182',
chainIcon: 'https://cryptologos.cc/logos/polkadot-new-dot-logo.png',
currency: 'DOT',
rpcUrl: 'https://rpc.polkadot.io',
explorerUrl: 'https://polkadot.subscan.io',
),
ReownAppKitModalNetworkInfo(
name: 'Westend',
chainId: 'e143f23803ac50e8f6f8e62695d1ce9e',
currency: 'DOT',
rpcUrl: 'https://westend-rpc.polkadot.io',
explorerUrl: 'https://westend.subscan.io',
isTestNetwork: true,
),
]);
```

As said before, if you plan to support just EVM and Solana networks you should already have everything in place, out of the box, inside AppKit configuration. However, if you are looking to support more non-EVM networks, such as Polkadot, then further configuration must be done:

Example: If you want to support EVM + Solana + Polkadot then, along with the networks list modification, you should also pass the the following `optionalNamespaces:` in AppKit instance:

```javascript
optionalNamespaces: {
'eip155': RequiredNamespace.fromJson({
'chains': ReownAppKitModalNetworks.getAllSupportedNetworks(
namespace: 'eip155',
).map((chain) => 'eip155:${chain.chainId}').toList(),
'methods': NetworkUtils.defaultNetworkMethods['eip155']!.toList(),
'events': NetworkUtils.defaultNetworkEvents['eip155']!.toList(),
}),
'solana': RequiredNamespace.fromJson({
'chains': ReownAppKitModalNetworks.getAllSupportedNetworks(
namespace: 'solana',
).map((chain) => 'solana:${chain.chainId}').toList(),
'methods': NetworkUtils.defaultNetworkMethods['solana']!.toList(),
'events': [],
}),
'polkadot': RequiredNamespace.fromJson({
'chains': [
'polkadot:91b171bb158e2d3848fa23a9f1c25182',
'polkadot:e143f23803ac50e8f6f8e62695d1ce9e'
],
'methods': [
'polkadot_signMessage',
'polkadot_signTransaction',
],
'events': []
}),
},
```
6 changes: 6 additions & 0 deletions docs/appkit/flutter/core/events.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,12 @@ _appKitModal.onModalDisconnect.subscribe((ModalDisconnect? event) {});
_appKitModal.onModalError.subscribe((ModalError? event) {});
```
------
:::info
The follwing events are available only through WalletConnect protocol, meaning that they won't be throwing events when connected to Coinbase Wallet nor Email or Social Login.
:::
#### Session specific events
```javascript
Expand Down
7 changes: 6 additions & 1 deletion docs/appkit/flutter/core/installation.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -85,9 +85,14 @@ Example:

### Enable Coinbase Wallet

Since Coinbase Wallet uses its own SDK, there are a few extra but simply steps to do if you are planning to include and support it.
:::info note
Coinbase Wallet does not use the WalletConnect protocol for communication between the dApp and the wallet. This means that pairing topic, session topic, and other session data are not used when connected to Coinbase Wallet.\n
However, you can still enable it to seamlessly connect with your dApp with these additional but simple steps.
:::


On your iOS and Android native side make the following changes:

<PlatformTabs
groupId="appkit_flutter"
activeOptions={["ios","android"]}
Expand Down
6 changes: 6 additions & 0 deletions docs/appkit/flutter/core/link-mode.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,12 @@ AppKit Link Mode is a low latency mechanism for transporting One-Click Auth requ

By enabling it, the wallet and dapp will communicate through declared Universal Links on iOS and/or App Links on Android **even without an internet connection.**

:::info note
In order to fully works, Link Mode requires you to also enable [One-Click Auth + Sign In With Ethereum](./siwe.mdx) feature.

This feature is compatible only with EVM blockchains, so if you decide to included non-EVM blockchains Link Mode mechanism is going to be disabled internally.
:::

### How to enable it:

1. Add a Universal Link for your wallet in the **Explorer** tab of your [**Cloud project configuration**](https://cloud.reown.com/sign-in), under the **Mobile Linking** section
Expand Down
20 changes: 14 additions & 6 deletions docs/appkit/flutter/core/options.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,10 @@ final _appKitModal = ReownAppKitModal(
description: 'Example app description',
url: 'https://example.com/',
icons: ['https://example.com/logo.png'],
redirect: Redirect(
redirect: Redirect( // OPTIONAL
native: 'exampleapp://',
universal: 'https://reown.com/exampleapp',
linkMode: false,
),
),
// enableAnalytics: true, // OPTIONAL - null by default
Expand All @@ -21,6 +22,7 @@ final _appKitModal = ReownAppKitModal(
// socials: [...], // OPTIONAL - empty by default
// showMainWallets: true, // OPTIONAL - true by default
// ),
// getBalanceFallback: () async { }, OPTIONAL - null by default
// requiredNamespaces: {}, OPTIONAL - null by default
// optionalNamespaces: {}, OPTIONAL - null by default
// featuredWalletIds: {}, OPTIONAL - null by default
Expand All @@ -35,20 +37,26 @@ Enable analytics to get more insights on your users activity within your [Reown

### siweConfig:

Used to configure [One-Click Auth + SIWE](./siwe.mdx) feature.
Used to configure [One-Click Auth + Sign In With Ethereum](./siwe.mdx) feature.

Will be disabled automatically if you decide to support/include non-EVM blockchains.

### featuresConfig:

Used to configure extra features such as Analytics, [Email and Social Login](../core/email.mdx).
Used to configure extra features such [Email and Social Login](../core/email.mdx).

### requiredNamespaces: and optionalNamespaces:
### getBalanceFallback:

These values are optionals and, in most cases, not required since AppKit already defines every required and optional namespace internally based on configured networks.
This callback method will be triggered if getting the balance from our blockchain API fails due to unsupported network. You should place here your own getBalance() method if you want.

However, if you would want to override that definition with your own, these are the object yout should use.
### requiredNamespaces: and optionalNamespaces:

These are the set of namespaces that will be requested to the wallet you are connecting to.

These values are optionals and, in most cases, not required since AppKit already defines every required and optional namespace internally based on configured networks.

However, if you would want to override that definition with your own or support more networks than just EVM and Solana (i.e. Polkadot, Kadena, etc...) these are the object yout should modify. See [non-EVM support](../core/email.mdx). section.

### featuredWalletIds:

Allows to override default recommended wallets that are fetched from the API. You can define an array of wallet ids you'd like to prioritize (order is respected). You can get these ids from the [Reown Explorer](https://reown.com/explorer?type=wallet) by clicking on the copy icon of desired wallet card.
Expand Down
7 changes: 6 additions & 1 deletion docs/appkit/flutter/core/siwe.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,14 @@ Connecting a wallet, proving control of an address with an off-chain signature,
WalletConnect uses permissions expressed as ReCaps to enable a One-Click Authentication.

## Pre-requisites
In order for SIWE to work, you need to have a backend to communicate with. This backend will be used to generate a nonce, verify messages and handle sessions.

In order for 1-CA + SIWE to work, you need to have a backend to communicate with. This backend will be used to generate a nonce, verify messages and handle sessions.
More info [here](https://docs.login.xyz/sign-in-with-ethereum/quickstart-guide/implement-the-backend)

:::info note
This feature is compatible only with EVM blockchains, so if you decide to included non-EVM blockchains 1-CA + SIWE mechanism is going to be disabled internally.
:::

## Configure your SIWEConfig object

```javascript
Expand Down
18 changes: 15 additions & 3 deletions docs/appkit/flutter/core/usage.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ Be sure to update the _project ID_ and _metadata_ with your own.
In order to initialize `ReownAppKitModal()` instance you must provide a _projectId_ and a _metadata_.

```javascript
// AppKit Modal instance
final _appKitModal = ReownAppKitModal(
context: context,
projectId: '{YOUR_PROJECT_ID}',
Expand All @@ -32,9 +33,10 @@ final _appKitModal = ReownAppKitModal(
description: 'Example app description',
url: 'https://example.com/',
icons: ['https://example.com/logo.png'],
redirect: Redirect(
redirect: Redirect( // OPTIONAL
native: 'exampleapp://',
universal: 'https://reown.com/exampleapp',
linkMode: true|false,
),
),
);
Expand All @@ -47,6 +49,7 @@ await _appKitModal.init();
Alternatively, `ReownAppKitModal()` allows you to create an instance by passing a `ReownAppKit()` object as follows:

```javascript
// AppKit instance
final appKit = ReownAppKit.createInstance(
projectId: '{YOUR_PROJECT_ID}',
metadata: const PairingMetadata(
Expand All @@ -57,10 +60,12 @@ final appKit = ReownAppKit.createInstance(
redirect: Redirect(
native: 'exampleapp://',
universal: 'https://reown.com/exampleapp',
linkMode: true|false,
),
),
);

// AppKit Modal instance
final _appKitModal = ReownAppKitModal(
context: context,
appKit: appKit,
Expand All @@ -83,6 +88,9 @@ redirect: Redirect(
native: 'exampleapp://',
// your own universal link for deep linking, required if you are going to use Link Mode
universal: 'https://reown.com/exampleapp',
// enable or disable relay-less communication, see `Link Mode` section
// won't be used if you decide to support/include non-EVM blockchains
linkMode: true|false,
),
```

Expand All @@ -108,7 +116,9 @@ But in order for the redirect mechanism to work you would also need to add the f
<string>com.example.yourBundleId</string> <!-- Bundle ID of your app -->
<key>CFBundleURLSchemes</key>
<array>
<!-- your own custom scheme. Be mind of removing :// for this step -->
<!-- your own custom scheme -->
<!-- Should be the same you set on Redirect.native on Flutter side -->
<!-- Be mind of removing :// for this step -->
<string>exampleapp</string>
</array>
</dict>
Expand All @@ -127,7 +137,9 @@ But in order for the redirect mechanism to work you would also need to add the f
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />
<!-- your own custom scheme. Be mind of removing :// for this step -->
<!-- your own custom scheme -->
<!-- Should be the same you set on Redirect.native on Flutter side -->
<!-- Be mind of removing :// for this step -->
<data android:scheme="exampleapp" />
</intent-filter>
```
Expand Down

0 comments on commit 3c903e4

Please sign in to comment.