feat: Add high-level native integration guide

pages/integrate-wallet.mdx

@@ -2,11 +2,41 @@
 
 In this integration guide, we will guide you how to support [TokenScript](https://www.tokenscript.org/) and [EIP-5169](https://eips.ethereum.org/EIPS/eip-5169) as a wallet provider like [JoyId](https://x.com/joy_protocol/status/1728309508605423766?s=20) and [Alphawallet](https://alphawallet.com/).
 
+## Checking for TokenScripts
+
+Before showing the TokenScript in an iframe or webview within your wallet, you must first check that the chain+contract has a TokenScript
+associated with it. The launchpad server provides a public API that you can query to find TokenScripts:
+
+Example in Typescript:
+```typescript
+async function getScriptUri(chain: string, contractAddr: string) {
+
+	// i.e. https://store-backend.smartlayer.network/tokenscript/0xD5cA946AC1c1F24Eb26dae9e1A53ba6a02bd97Fe/chain/137/script-uri
+	const res = await fetch(`https://store-backend.smartlayer.network/tokenscript/${contractAddr.toLowerCase()}/chain/${chain}/script-uri`);
+	const data = await res.json();
+
+	if (!data.scriptURI)
+		return null;
+
+	if (data.scriptURI.erc5169?.length)
+		return <string>data.scriptURI.erc5169[0];
+
+	if (data.scriptURI.offchain?.length)
+		return <string>data.scriptURI.offchain[0];
+
+	return null;
+}
+```
+
+## Integrate into a web application wallet
+
+Web integration uses an iframe to embed a token details screen with TokenScript support.
 We will use NextJS and wagmi as an example, but the idea is the same for any other tech stack.
 
-## Step 1: Add support for EIP-5169
+### Step 1: Open the iFrame
 
-Check if the NFT contract implements EIP-5169, if yes, then you can use the first value of `scriptURI` to load TokenScript Viewer iframe.
+Check if the NFT contract implements TokenScript using the API above, if yes,
+then you can use the first value of `scriptURI` to load TokenScript Viewer iframe.
 
 ```jsx copy filename="app/[chainId]/[contract]/[tokenId]/page.tsx"
 export default function AppPageContent({
@@ -57,7 +87,7 @@ function addQueriesToUrl(
 }
 ```
 
-## Step 2: implement TokenScript RPC requirements
+### Step 2: implement TokenScript RPC requirements
 
 ```jsx copy
 import { RefObject, useEffect } from "react"
@@ -147,4 +177,41 @@ export const useIframePostMessage = (
 }
 ```
 
-That's it, you can now ready with TokenScript and EIP-5169.
+## Integrate into a native wallet application
+
+The process of native integration is similar to web application integration,
+but instead of opening an iframe we need to use a webview for the corresponding platform and provide an injected RPC provider.
+
+Due to the number of different webview implementations we haven't provided detailed implementation instructions, but rather high-level tech requirements.
+
+### Open the webview
+
+Check if the NFT contract implements TokenScript using the API above, if yes,
+then you can use the first value of `scriptURI` to load TokenScript Viewer in a webview.
+
+The webview should load the following URL, replacing the tokens with the correct values for the chain, contract, etc.
+
+```
+https://viewer.tokenscript.org/?viewType=alphawallet&chain=${chainId}&contract=${contractAddress}&tokenId=${tokenId}&tokenscriptUrl=${scriptUri}
+```
+
+Note: The "alphawallet" view will automatically connect to the injected RPC provider.
+
+### Provide an injected RPC provider
+
+An injected ethereum RPC provider is required for wallet interaction and is usually implemented through a Javascript interface provided to the webview by your application.
+Most wallets will provide a "Dapp browser", and will therefore already have the components required to provide injected RPC to a webview.
+If this is the case for your app, then good news! It should be a straightforward process to reuse these components to show TokenScript viewer.
+
+If you don't currently have these components, here are a few links that will help you add injected RPC for your chosen platform.
+
+- Android: https://developer.samsung.com/blockchain/platform/programming-guide/cucumber-webview.html
+- iOS: https://github.com/web3swift-team/web3swift
+- Flutter: https://pub.dev/packages/flutter_injected_web3
+
+Note: The RPC provider should support wallet_switchEthereumChain & wallet_addEthereumChain as well as all standard RPC methods.
+
+## Conclusion
+
+That's it, you are now ready to use TokenScript and EIP-5169 in your wallet using TokenScript viewer!
+If you would like to customise the UI TokenScript viewer provides to fit in better with your wallet design, please contact us.