]> zoso.dev Git - nemo-wallet.git/commitdiff
Generalize wallet creation. Start adding wallet form dialog.
authorChris Duncan <chris@zoso.dev>
Wed, 16 Oct 2024 05:53:05 +0000 (22:53 -0700)
committerChris Duncan <chris@zoso.dev>
Wed, 16 Oct 2024 05:53:05 +0000 (22:53 -0700)
app/pages/nemo-wallet.html

index 207456bfb4704a67d65400423251d920f422be95..5a4d1d89887252e29504909693f5cbec68e60253 100644 (file)
       const notification = document.getElementById('notification')
       observer.observe(notification, { attributes: true })
     }
-    async function createBip44Wallet () {
-      const wallet = await Bip44Wallet.create('password')
-      try {
-        addToStorage('Bip44Wallets', wallet.id)
-      } catch (err) {
-        notify.error(err.msg)
+    function getWalletType (type) {
+      switch (type) {
+        case 'blake2b': {
+          return Blake2bWallet
+        }
+        case 'bip44':
+        default: {
+          return Bip44Wallet
+        }
       }
-      return wallet
     }
-    async function createBlake2bWallet () {
-      const wallet = await Blake2bWallet.create('password')
+    async function createWallet (el, type) {
+      const label = el.firstElementChild
+      const spinner = document.createElement('x-throbber')
+      spinner.size = 'small'
+      spinner.style.width = `${label.scrollWidth}px`
+      el.replaceChildren(spinner)
+      const walletType = getWalletType(type)
+      let wallet
       try {
-        addToStorage('Blake2bWallets', wallet.id)
+        wallet = await walletType.create('password')
+        const walletData = {
+          id: wallet.id,
+          type
+        }
+        addToStorage(`wallets`, JSON.stringify(walletData))
       } catch (err) {
         notify.error(err.msg)
+      } finally {
+        el.replaceChildren(label)
+        return wallet
       }
-      return wallet
     }
-    async function addToStorage (key, value) {
+    function addToStorage (key, value) {
       if (typeof value !== 'string') {
         throw new TypeError(`Cannot add ${typeof value} to storage`)
       }
       sessionStorage.setItem(key, JSON.stringify(item))
     }
     async function showWallets () {
-      console.log(`showWallets()`)
-      const card = document.getElementById('wallets')
-      const bip44WalletIds = JSON.parse(sessionStorage.getItem('Bip44Wallets') ?? '[]')
-      console.log(`bip44WalletIds: ${bip44WalletIds}`)
-      for (const id of bip44WalletIds) {
-        console.log(`id: ${id}`)
-        const wallet = await Bip44Wallet.restore(id)
+      const card = document.getElementById('walletCard')
+      const storedWalletData = JSON.parse(sessionStorage.getItem('wallets') ?? '[]')
+      const wallets = []
+      for (const walletData of storedWalletData) {
+        const w = JSON.parse(walletData)
+        console.dir(w)
+        if (w.id && w.type) {
+          const walletType = getWalletType(w.type)
+          wallets.push(await walletType.restore(w.id))
+        }
+      }
+      const walletElements = []
+      for (const wallet of wallets) {
         const walletElement = document.createElement('x-label')
         await wallet.unlock('password')
-        console.log(`wallet: ${wallet}`)
         walletElement.innerText = wallet.mnemonic
-        wallet.lock('password')
-        card.appendChild(walletElement)
+        await wallet.lock('password')
+        walletElements.push(walletElement)
       }
+      card.replaceChildren(...walletElements)
     }
     async function clearStorage () {
       sessionStorage.clear()
 <body onload="load()" style="visibility:hidden;">
   <x-box id="main">
     <x-notification id="notification"></x-notification>
-    <x-button onclick="createBip44Wallet().then(w => { console.log(w);showWallets() })">
-      <x-label>Create BIP-44 Wallet</x-label>
-    </x-button>
-    <x-card id="wallets">
+    <x-box id="wallets">
+      <x-button>
+        <x-label>Wallets</x-label>
+        <x-menu>
+          <x-menuitem>
+            <x-button>
+              <x-label>New</x-label>
+              <dialog>
+                <x-radios>
+                  <x-label>Type</x-label>
+                  <x-radio value="bip44" toggled><x-label>BIP-44</x-label></x-radio>
+                  <x-radio value="blake2b"><x-label>BLAKE2b</x-label></x-radio>
+                </x-radios>
+                <x-input type="password" required="true">Password</x-input>
+                <x-button
+                  onclick="createWallet(this, this.closest('dialog').querySelector('x-radios').value).then(w => { console.log(w);showWallets() })"></x-button>
+              </dialog>
+            </x-button>
+          </x-menuitem>
+          <x-menuitem>
+            <x-button>
+              <x-label>Import</x-label>
+              <dialog>
+              </dialog>
+            </x-button>
+          </x-menuitem>
+        </x-menu>
+      </x-button>
+    </x-box>
+    <x-card id="walletCard">
     </x-card>
     <x-button onclick="clearStorage()">
       <x-label>Clear Storage</x-label>