Merge pull request #7 from CosmWasm/helper-methods

Adding some setup functions

README.md

@@ -1,4 +1,3 @@
-
 <h1><p align="center"><img alt="CosmJS" src="docs/logo.png" width="180" /></p></h1>
 
 <div align="center">
@@ -7,8 +6,9 @@
 
 ## About
 
-Cosmwasm.js was created to help new developers get started with their first dApps.
-It is just a wrapper package to easily import needed features from CosmJS.
+Cosmwasm.js was created to help new developers get started with their first
+dApps. It is just a wrapper package to easily import needed features from
+CosmJS.
 
 ## Get started
 
@@ -49,24 +49,43 @@ import { SigningCosmWasmClient, Secp256k1HdWallet } from "cosmwasm";
 const rpcEndpoint = "https://rpc.cliffnet.cosmwasm.com:443/";
 
 // Using a random generated mnemonic
-const mnemonic = "rifle same bitter control garage duck grab spare mountain doctor rubber cook";
+const mnemonic =
+  "rifle same bitter control garage duck grab spare mountain doctor rubber cook";
 
 async function main() {
-
   // Create a wallet
   const wallet = await Secp256k1HdWallet.fromMnemonic(mnemonic);
 
   // Using
   const client = await SigningCosmWasmClient.connectWithSigner(
     rpcEndpoint,
-    wallet
+    wallet,
   );
   console.log(client);
 }
 
 main();
 ```
 
+### Connect with keplr and get a signing starget client
+
+```ts
+import { setupWebKeplr } from "cosmwasm";
+
+const config = {
+  chainId: "cliffnet-1",
+  rpcEndpoint: "https://rpc.cliffnet.cosmwasm.com:443/",
+  prefix: "wasm",
+};
+
+async function main() {
+  const client = await setupWebKeplr(config);
+  console.log(client);
+}
+
+main();
+```
+
 ### Interacting with contracts
 
 ```ts
@@ -76,7 +95,8 @@ import { CosmWasmClient } from "cosmwasm";
 const rpcEndpoint = "https://rpc.cliffnet.cosmwasm.com:443/";
 
 // This is your contract address
-const contractAddr = "wasm19qws2lfd8pskyn0cfgpl5yjjyq3msy5402qr8nkzff9kdnkaepyqycedfh";
+const contractAddr =
+  "wasm19qws2lfd8pskyn0cfgpl5yjjyq3msy5402qr8nkzff9kdnkaepyqycedfh";
 
 async function main() {
   const client = await CosmWasmClient.connect(rpcEndpoint);

package.json

@@ -37,21 +37,23 @@
     "@cosmjs/crypto": "0.27.1",
     "@cosmjs/encoding": "0.27.1",
     "@cosmjs/faucet-client": "0.27.1",
+    "@cosmjs/ledger-amino": "0.27.1",
     "@cosmjs/proto-signing": "0.27.1",
     "@cosmjs/stargate": "0.27.1"
   },
   "devDependencies": {
+    "@types/ledgerhq__hw-transport": "^4.21.4",
     "@typescript-eslint/eslint-plugin": "^5.11.0",
     "@typescript-eslint/parser": "^5.11.0",
     "eslint": "^7.32.0",
     "eslint-config-prettier": "^8.3.0",
     "eslint-config-standard": "^16.0.3",
     "eslint-plugin-import": "^2.25.4",
     "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-prettier": "^4.0.0",
     "eslint-plugin-promise": "^5.2.0",
+    "eslint-plugin-simple-import-sort": "^7.0.0",
     "prettier": "^2.5.1",
-    "typescript": "^4.5.5",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-simple-import-sort": "^7.0.0"
+    "typescript": "^4.5.5"
   }
 }

src/helpers/setup.ts

@@ -0,0 +1,159 @@
+/**
+ * Setup helper functions
+ *
+ * These are multiple helper function to get quickly started.
+ * There are currently 4 different functions to choose from:
+ *  (a) Web / Keplr
+ *  (b) Web / Ledger
+ *  (c) Node / Local Mnemonic
+ *  (d) Node / Ledger
+ */
+import { makeCosmoshubPath } from "../amino";
+import { SigningCosmWasmClient } from "../cosmwasm-stargate";
+import { LedgerSigner } from "../ledger-amino";
+import { DirectSecp256k1HdWallet } from "../proto-signing";
+import { GasPrice } from "../stargate";
+
+/**
+ * All setup functions are using the same config pattern
+ */
+interface Config {
+  chainId: string;
+  rpcEndpoint: string;
+  prefix: string;
+  gasPrice?: GasPrice;
+}
+
+// Window has to be re-declared to get keplr working
+declare const window: any;
+
+/**
+ * (a) Web / Keplr
+ * Prompts keplr and returns a signing client after the user
+ * gave permissions.
+ *
+ * @param config
+ * @returns SigningCosmWasmClient
+ */
+export async function setupWebKeplr(config: Config): Promise<SigningCosmWasmClient> {
+  // check browser compatibility
+  if (!window.keplr) {
+    throw new Error("Keplr is not supported or installed on this browser!");
+  }
+
+  // try to enable keplr with given chainId
+  await window.keplr.enable(config.chainId).catch(() => {
+    throw new Error("Keplr can't connect to this chainId!");
+  });
+
+  const { prefix, gasPrice } = config;
+
+  // Setup signer
+  const offlineSigner = await window.getOfflineSignerAuto(config.chainId);
+
+  // Init SigningCosmWasmClient client
+  const signingClient = await SigningCosmWasmClient.connectWithSigner(config.rpcEndpoint, offlineSigner, {
+    prefix,
+    gasPrice,
+  });
+
+  return signingClient;
+}
+
+/**
+ * (b) Web / Ledger
+ * Returns a signing client after the user gave permissions.
+ *
+ * @param config
+ * @returns SigningCosmWasmClient
+ */
+export async function setupWebLedger(config: Config, transport: any): Promise<SigningCosmWasmClient> {
+  const { prefix, gasPrice } = config;
+  const interactiveTimeout = 120_000;
+
+  // Prepare ledger
+  const ledgerTransport = await transport.create(interactiveTimeout, interactiveTimeout);
+
+  // Setup signer
+  const offlineSigner = new LedgerSigner(ledgerTransport, {
+    hdPaths: [makeCosmoshubPath(0)],
+    prefix: prefix,
+  });
+
+  // Init SigningCosmWasmClient client
+  const client = await SigningCosmWasmClient.connectWithSigner(config.rpcEndpoint, offlineSigner, {
+    prefix,
+    gasPrice,
+  });
+
+  const chainId = await client.getChainId();
+
+  if (chainId !== config.chainId) {
+    throw Error("Given ChainId doesn't match the clients ChainID!");
+  }
+
+  return client;
+}
+
+/**
+ * (c) Node / Local Mnemonic
+ * Using a local mnemonic and returns a signing clien
+ *
+ * @param config
+ * @param mnemonic
+ * @returns SigningCosmWasmClient
+ */
+export async function setupNodeLocal(config: Config, mnemonic: string): Promise<SigningCosmWasmClient> {
+  const { prefix, gasPrice } = config;
+
+  // Setup signer
+  const offlineSigner = await DirectSecp256k1HdWallet.fromMnemonic(mnemonic, { prefix });
+
+  // Init SigningCosmWasmClient client
+  const client = await SigningCosmWasmClient.connectWithSigner(config.rpcEndpoint, offlineSigner, {
+    prefix,
+    gasPrice,
+  });
+
+  const chainId = await client.getChainId();
+
+  if (chainId !== config.chainId) {
+    throw Error("Given ChainId doesn't match the clients ChainID!");
+  }
+
+  return client;
+}
+
+/**
+ * (d) Node / Ledger
+ * Returns a signing client after the user gave permissions.
+ *
+ * @param config
+ * @returns SigningCosmWasmClient
+ */
+export async function setupNodeLedger(config: Config, transport: any): Promise<SigningCosmWasmClient> {
+  const { prefix, gasPrice } = config;
+  const interactiveTimeout = 120_000;
+
+  // Prepare ledger
+  const ledgerTransport = await transport.create(interactiveTimeout, interactiveTimeout);
+
+  // Setup signer
+  const offlineSigner = new LedgerSigner(ledgerTransport, {
+    hdPaths: [makeCosmoshubPath(0)],
+    prefix: prefix,
+  });
+
+  const client = await SigningCosmWasmClient.connectWithSigner(config.rpcEndpoint, offlineSigner, {
+    prefix: prefix,
+    gasPrice: gasPrice,
+  });
+
+  const chainId = await client.getChainId();
+
+  if (chainId !== config.chainId) {
+    throw Error("Given ChainId doesn't match the clients ChainID!");
+  }
+
+  return client;
+}

src/index.ts

@@ -1,7 +1,15 @@
+/**
+ * Exporting all the defined CosmJS symbols
+ */
 export * from "./amino";
 export * from "./cosmwasm-stargate";
 export * from "./crypto";
 export * from "./encoding";
 export * from "./faucet-client";
 export * from "./proto-signing";
 export * from "./stargate";
+
+/**
+ * Exporting CosmWasmJS Helpers
+ */
+export { setupNodeLedger, setupNodeLocal, setupWebKeplr, setupWebLedger } from "./helpers/setup";

src/ledger-amino.ts

@@ -0,0 +1 @@
+export { LedgerSigner } from "@cosmjs/ledger-amino";