launchpad-ledger: Update demos for transport argument

packages/launchpad-ledger/demo/index.html

@@ -19,7 +19,7 @@
       </ol>
     </div>
     <div>
-      <button onclick="getAccounts()">
+      <button onclick="getAccounts(window.signer)">
         Get Accounts
       </button>
     </div>
@@ -38,7 +38,7 @@
       </textarea>
     </div>
     <div>
-      <button onclick="sign()">
+      <button onclick="sign(window.signer)">
         Sign Message
       </button>
     </div>

packages/launchpad-ledger/demo/node.js

@@ -1,14 +1,16 @@
 const demo = require("../build/demo/node");
 
 async function run() {
+  const signer = await demo.createSigner();
+
   const accountNumbers = [0, 1, 2, 10];
-  const accounts = await demo.getAccounts();
+  const accounts = await demo.getAccounts(signer);
   console.info("Accounts from Ledger device:");
   console.table(accounts.map((account, i) => ({ ...account, accountNumber: accountNumbers[i] })));
 
   const accountNumber0 = 0;
   const address0 = accounts[accountNumber0].address;
-  const signature0 = await demo.sign(accountNumber0, address0, address0);
+  const signature0 = await demo.sign(signer, accountNumber0, address0, address0);
   console.info(`Signature from Ledger device for account number 0 (${address0}):`);
   console.info(signature0);
 
@@ -17,7 +19,7 @@ async function run() {
 
   const accountNumber10 = 10;
   const address10 = accounts[accountNumbers.findIndex((n) => n === accountNumber10)].address;
-  const signature1 = await demo.sign(accountNumber10, address10, address10);
+  const signature1 = await demo.sign(signer, accountNumber10, address10, address10);
   console.info(`Signature from Ledger device for account number 10 (${address10}):`);
   console.info(signature1);
 }

packages/launchpad-ledger/src/demo/node.ts

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/naming-convention */
 import { toBase64 } from "@cosmjs/encoding";
 import { makeCosmoshubPath, makeSignDoc, StdFee, StdSignature } from "@cosmjs/launchpad";
+import LedgerTransport from "@ledgerhq/hw-transport-node-hid";
 
 import { LedgerSigner } from "../ledgersigner";
 
@@ -12,12 +13,18 @@ const defaultFee: StdFee = {
 const defaultMemo = "Some memo";
 const defaultSequence = "0";
 
-const signer = new LedgerSigner({
-  testModeAllowed: true,
-  hdPaths: [makeCosmoshubPath(0), makeCosmoshubPath(1), makeCosmoshubPath(2), makeCosmoshubPath(10)],
-});
+export async function createSigner(): Promise<LedgerSigner> {
+  const interactiveTimeout = 120_000;
+  const ledgerTransport = await LedgerTransport.create(interactiveTimeout, interactiveTimeout);
+  return new LedgerSigner(ledgerTransport, {
+    testModeAllowed: true,
+    hdPaths: [makeCosmoshubPath(0), makeCosmoshubPath(1), makeCosmoshubPath(2), makeCosmoshubPath(10)],
+  });
+}
 
-export async function getAccounts(): Promise<
+export async function getAccounts(
+  signer: LedgerSigner,
+): Promise<
   ReadonlyArray<{
     readonly algo: string;
     readonly address: string;
@@ -29,6 +36,7 @@ export async function getAccounts(): Promise<
 }
 
 export async function sign(
+  signer: LedgerSigner,
   accountNumber: number,
   fromAddress: string,
   toAddress: string,

packages/launchpad-ledger/src/demo/web.ts

@@ -2,6 +2,7 @@ import { toBase64 } from "@cosmjs/encoding";
 import { AccountData, makeCosmoshubPath, StdSignDoc } from "@cosmjs/launchpad";
 import { Uint53 } from "@cosmjs/math";
 import { assert } from "@cosmjs/utils";
+import LedgerTransport from "@ledgerhq/hw-transport-webusb";
 
 import { LedgerSigner } from "../ledgersigner";
 
@@ -43,11 +44,6 @@ function createSignDoc(accountNumber: number, address: string): string {
   return JSON.stringify(signDoc, null, 2);
 }
 
-const signer = new LedgerSigner({
-  testModeAllowed: true,
-  hdPaths: [makeCosmoshubPath(0), makeCosmoshubPath(1), makeCosmoshubPath(2)],
-});
-
 window.updateMessage = (accountNumberInput: unknown) => {
   assert(typeof accountNumberInput === "string");
   const accountNumber = Uint53.fromString(accountNumberInput).toNumber();
@@ -63,7 +59,20 @@ window.updateMessage = (accountNumberInput: unknown) => {
   signDocTextArea.textContent = createSignDoc(accountNumber, address);
 };
 
-window.getAccounts = async function getAccounts(): Promise<void> {
+window.createSigner = async function createSigner(): Promise<LedgerSigner> {
+  const interactiveTimeout = 120_000;
+  const ledgerTransport = await LedgerTransport.create(interactiveTimeout, interactiveTimeout);
+  return new LedgerSigner(ledgerTransport, {
+    testModeAllowed: true,
+    hdPaths: [makeCosmoshubPath(0), makeCosmoshubPath(1), makeCosmoshubPath(2)],
+  });
+};
+
+window.getAccounts = async function getAccounts(signer: LedgerSigner | undefined): Promise<void> {
+  if (signer === undefined) {
+    console.error("Please wait for transport to connect");
+    return;
+  }
   const accountNumberInput = document.getElementById("account-number");
   const addressInput = document.getElementById("address");
   const accountsDiv = document.getElementById("accounts");
@@ -88,7 +97,11 @@ window.getAccounts = async function getAccounts(): Promise<void> {
   }
 };
 
-window.sign = async function sign(): Promise<void> {
+window.sign = async function sign(signer: LedgerSigner | undefined): Promise<void> {
+  if (signer === undefined) {
+    console.error("Please wait for transport to connect");
+    return;
+  }
   const signatureDiv = document.getElementById("signature");
   signatureDiv.textContent = "Loading...";
 
@@ -102,3 +115,7 @@ window.sign = async function sign(): Promise<void> {
     signatureDiv.textContent = error;
   }
 };
+
+window.onload = async function onLoad(): Promise<void> {
+  window.signer = await window.createSigner();
+};