From 2195feec8a32ca6ebb726c5fb23d4e515ccf57fa Mon Sep 17 00:00:00 2001
From: Xi Zhang <xizhang@oasislabs.com>
Date: Fri, 17 Nov 2023 15:12:50 -0600
Subject: [PATCH] Add Viem documentation

---
 clients/js/README.md | 13 +++++++++++++
 docs/guide.mdx       | 19 +++++++++++++++++++
 2 files changed, 32 insertions(+)

diff --git a/clients/js/README.md b/clients/js/README.md
index 3ee227ee9..85240b826 100644
--- a/clients/js/README.md
+++ b/clients/js/README.md
@@ -68,6 +68,19 @@ const provider = sapphire.wrap(window.ethereum);
 window.ethereum = sapphire.wrap(window.ethereum); // If you're feeling bold.
 ```
 
+### Viem
+
+```ts
+import { sapphireTestnet } from 'viem/chains';
+import * as sapphire from '@oasisprotocol/sapphire-paratime';
+
+const provider = sapphire.wrap(window.ethereum! as EIP1193Provider);
+const walletClient = createWalletClient({
+  chain: sapphireTestnet,
+  transport: custom(provider),
+});
+```
+
 ## Troubleshooting
 
 ### `Error: missing provider (operation="getChainId", code=UNSUPPORTED_OPERATION, ...)`
diff --git a/docs/guide.mdx b/docs/guide.mdx
index 8f837b718..4359be3a0 100644
--- a/docs/guide.mdx
+++ b/docs/guide.mdx
@@ -125,6 +125,25 @@ can also use those with Sapphire; all you need to do is set your Web3 gateway UR
 You can find the details of the Oasis Sapphire Web3 gateway
 [here](/dapp/sapphire#web3-gateway).
 
+#### Viem
+
+Sapphire will mostly work with Viem out of the box. You will need to import
+the Sapphire client, define the `chain`, and wrap your `provider` before
+creating a [custom] transport.
+
+[custom]: https://viem.sh/docs/clients/transports/custom.html
+
+```ts
+import { sapphireTestnet } from 'viem/chains';
+import * as sapphire from '@oasisprotocol/sapphire-paratime';
+
+const provider = sapphire.wrap(window.ethereum! as EIP1193Provider);
+const walletClient = createWalletClient({
+  chain: sapphireTestnet,
+  transport: custom(provider),
+});
+```
+
 ### Transactions & Calls
 
 <!-- https://github.com/oasisprotocol/docs/blob/455980674563cad92ff1e1b62a7a5f2d4d6809f0/docs/general/images/architecture/client-km-compute.svg -->