add solana documentation

developers/solana-adapter-xdefi-integration.md

@@ -1,52 +1,53 @@
 # Solana Adapter XDEFI Integration
 
-# Extension Wallet Solana Integration
+### Get started
 
-[[toc]]
+Best way to start with solana dApps is to use [create-solana-dapp](https://github.com/solana-developers/create-solana-dapp/tree/main/packages/create-solana-dapp)
 
-## Using Solana Adapter
+```bash
+npx create-solana-dapp@latest
+```
 
-### Solana Adapter not installed
+create-solana-dapp supports `React` and `NextJs` version. We'll use `NextJs` version.
+![image](images/solana/solana-xdefi-integration-nextjs-template.jpg)
 
-Install the latest wallets package:
+### XDEFIWalletAdapter vs Wallet Standard
 
-```bash
-npm install @solana/wallet-adapter-xdefi@latest
-```
+XDEFI wallet implements [Wallet Standard](https://github.com/wallet-standard/wallet-standard) and does not require any specific adapter to get started with Solana and XDEFI Wallet.
 
-Once installed, you can add XDEFI Wallet by making adding this part of code:
+> You can read more about Wallet Standard [here](https://docs.phantom.app/developer-powertools/wallet-standard).
 
-```js
-import { XDEFIWalletAdapter } from `@solana/wallet-adapter-xdefi`;
-import { /* ... other adapters ... */ } from `@solana/wallet-adapter-wallets`;
+However, XDEFIWalletAdapter provide XDEFI Wallet installation info when XDEFI Wallet is not installed. Which might be useful in many cases.
+So, in case you want maintain supported wallets list, you'll need to use Adapters for parlicular wallets or maintain your own wallet connect modal with supported wallets list.
 
-const wallets = useMemo(
-  () => [
-    new XDEFIWalletAdapter(),
-    // ... other adapters ...
-  ],
-  []
-);
+Here how looks when you have no adapter provided to `WalletProvider` and no wallet installed
+![image](images/solana/solana-no-wallets-available.jpg)
 
-<WalletProvider autoConnect wallets={wallets}>
-```
+> which might be ok for experienced users but pretty confusing for newcomers.
 
-### Solana Adapter already installed
+And here how it looks when user have some wallet installed which implements Wallet Standard
+![image](images/solana/solana-detected-wallet-standard.jpg)
 
-Install the latest wallets package:
+### Using Solana Adapter
+
+Solana provides wallet adapters in two flavors: individual packages for each wallet or single tree-shakeable package which contains all wallet adapters available. We'll use later one. you can see all available adapters [here](https://github.com/anza-xyz/wallet-adapter/blob/master/PACKAGES.md#wallets)
 
 ```bash
 npm install @solana/wallet-adapter-wallets@latest
 ```
 
-Once installed, you can add XDEFI Wallet by making 2 changes:
+Once installed, you can add XDEFI Wallet by making adding this part of code:
 
-```js
+```tsx
 import {
   XDEFIWalletAdapter, // [!code ++]
   /* ... other adapters ... */
 } from `@solana/wallet-adapter-wallets`;
 
+const onError = useCallback((error: WalletError) => {
+  console.error(error);
+}, []);
+
 const wallets = useMemo(
   () => [
     new XDEFIWalletAdapter(), // [!code ++]
@@ -55,11 +56,44 @@ const wallets = useMemo(
   []
 );
 
-<WalletProvider autoConnect wallets={wallets}>
+<WalletProvider autoConnect wallets={wallets}  onError={onError}>
+```
+
+> `web/components/solana/solana-provider.tsx`
+
+Default behaviour of the `onError` callback is just log error. But what we need from it - is to redirect user to wallet home/installation page when user clicked on not installed wallet inside "Connect Wallet" modal
+![image](images/solana//solana-wallet-not-installed.jpg)
+
+> it will just log and error and do nothing when you will try to connect not installed wallet
+
+Let's fix this:
+
+```tsx
+import {
+  Adapter,
+  WalletError,
+  WalletNotReadyError, // [!code ++]
+  WalletReadyState, // [!code ++]
+} from '@solana/wallet-adapter-base';
+
+const onError = useCallback((error: WalletError, walletAdapter?: Adapter) => {
+  if (// [!code ++]
+    error instanceof WalletNotRea // [!code ++]dyError &&
+    walletAdapter?.readyState === WalletReadyState.NotDetected // [!code ++]
+  ) {// [!code ++]
+    window.open(walletAdapter?.url, "_blank"); // [!code ++]
+    return; // [!code ++]
+  } // [!code ++]
+  console.error(error);
+}, []);
+
 ```
 
-## Using XDEFI Provider
+> Now, when user will try to connect XDEFI Wallet while it is not installed, user will be taken to XDEFI Wallet home page in a new window.
 
-## Using XDEFI SDK
+### Additional Resources
 
-TBD
+- [create-solana-dapp](https://github.com/solana-developers/create-solana-dapp)
+- [Solana Wallet Adapter](https://github.com/anza-xyz/wallet-adapter)
+- [Solana Wallet Adapter Samples](https://github.com/anza-xyz/wallet-adapter/tree/master/packages/starter)
+- [Wallet Standard](https://github.com/wallet-standard/wallet-standard)