From ea6f009c01ce13f3f69de810ac81b869c4895413 Mon Sep 17 00:00:00 2001
From: Gala <calero.vg@gmail.com>
Date: Wed, 13 Dec 2023 14:11:14 +0100
Subject: [PATCH] wip credential generation example

---
 .../examples/credentials/browser/README.md           |  6 ++----
 .../examples/credentials/browser/src/index.html      |  2 +-
 .../examples/credentials/browser/src/index.ts        | 12 ++++++++++--
 3 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/sdk/typescript/examples/credentials/browser/README.md b/sdk/typescript/examples/credentials/browser/README.md
index d76aec193e..06c7da3edf 100644
--- a/sdk/typescript/examples/credentials/browser/README.md
+++ b/sdk/typescript/examples/credentials/browser/README.md
@@ -1,8 +1,6 @@
-# mixFetch Usage Example
+# Nym credential generation Usage Example
 
-This is a simple project to show you how to use mixFetch.
-
-Basic usage is as simple as replacing `fetch` with `mixFetch` in your code:
+This is a simple project to show you how to use nym credential generation.
 
 ```ts
 import { mixFetch } from '@nymproject/mix-fetch';
diff --git a/sdk/typescript/examples/credentials/browser/src/index.html b/sdk/typescript/examples/credentials/browser/src/index.html
index 9cded5431b..30e053af1e 100644
--- a/sdk/typescript/examples/credentials/browser/src/index.html
+++ b/sdk/typescript/examples/credentials/browser/src/index.html
@@ -19,7 +19,7 @@
     <h1>Credential</h1>
     <input placeholder="mnemonic"></input>
     <input placeholder="amount"></input>
-    <button onclick="getCredentials()">Get Credential</button>
+    <button id="button">Get Credential</button>
     <div id="credential"></div>
   </div>
 </body>
diff --git a/sdk/typescript/examples/credentials/browser/src/index.ts b/sdk/typescript/examples/credentials/browser/src/index.ts
index f25579a61d..c0761fd42c 100644
--- a/sdk/typescript/examples/credentials/browser/src/index.ts
+++ b/sdk/typescript/examples/credentials/browser/src/index.ts
@@ -4,10 +4,17 @@ import { appendOutput } from './utils';
 async function main() {
   const mnemonic = document.getElementById('mnemonic') as HTMLInputElement;
   const coin = document.getElementById('coin') as HTMLInputElement;
+  const button = document.getElementById('button') as HTMLButtonElement;
   const client = await createNymCredentialsClient({ isSandbox: true }); // options: {isSandbox?: boolean; networkDetails?: {}}
 
-  const credential = await client.comlink.acquireCredential(coin.value, mnemonic.value, {});
-  appendOutput(JSON.stringify(credential, null, 2));
+  const generateCredential = async () => {
+    const credential = await client.comlink.acquireCredential(coin.value, mnemonic.value, {});
+    appendOutput(JSON.stringify(credential, null, 2));
+  };
+
+  if (button) {
+    button.addEventListener('click', () => generateCredential());
+  }
 }
 
 // wait for the html to load
@@ -15,3 +22,4 @@ window.addEventListener('DOMContentLoaded', () => {
   // let's do this!
   main();
 });
+