Apply language framework to make whole (#111)

* Apply language framework to make whole

src/accountActions.ts

@@ -219,23 +219,21 @@ export function claimMakeWhole(account: string, callback = null) {
   }
 
   let mk = get(makeWhole)
-  setTimeout(() => {
-    invoke('claim_make_whole', { account })
-      .then(() => {
-        // update account make_whole status
-        let accountCredits = mk[account];
-        mk[account] = accountCredits.map(each => { each.claimed = true; return each });
-        makeWhole.set(mk);
-        // update account balance
-        checkSigningAccountBalance();
-        callback(null);
-      })
-      .catch(e => {
-        if (callback) {
-          callback(e.msg);
-        } else {
-          raise_error(e, false, "claim_make_whole");
-        }      
-      });
-  }, 2000)
+  invoke('claim_make_whole', { account })
+    .then(() => {
+      // update account make_whole status
+      let accountCredits = mk[account];
+      mk[account] = accountCredits.map(each => { each.claimed = true; return each });
+      makeWhole.set(mk);
+      // update account balance
+      checkSigningAccountBalance();
+      callback(null);
+    })
+    .catch(e => {
+      if (callback) {
+        callback(e.msg);
+      } else {
+        raise_error(e, false, "claim_make_whole");
+      }      
+    });
 }

src/components/make-whole/MakeWhole.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
-  import { _ } from 'svelte-i18n';
   import UIkit from 'uikit';
   import { printCoins } from '../../coinHelpers';
   import { makeWhole } from "../../accounts";
   import { onDestroy, onMount } from 'svelte';
   import { claimMakeWhole } from '../../accountActions';
+  import { _ } from "svelte-i18n";
     
   let credits;
   let unsubs;
@@ -49,50 +49,47 @@
     callback.bind({isProcessing});
     claimMakeWhole(selected.account, callback);
   }
-
 </script>
 
 <main>
   <div id="claimedWithSuccess" uk-modal>
     <div class="uk-modal-dialog uk-modal-body uk-text-center" style="background-image: url('/images/confetti.gif')">
       <div class="uk-section">
         <h2 class="uk-modal-title"><span class="success-icon" uk-icon="icon: check; ratio: 2"></span></h2> 
-        <p class="uk-text-small">Transation confirmed!</p>
-        <p>You have claimed <span class="uk-text-bold">{selected && printCoins(selected.coins.value)} coins</span> for account <br><span class="uk-text-bold">{selected ? selected.account : ""}</span>.</p>
-        <p>You can check your balance now.</p>
+        <p class="uk-text-small">{$_("make_whole.modal_success.title")}</p>
+        {@html $_("make_whole.modal_success.amount_for_account", { values: { coins: selected && printCoins(selected.coins.value), account: selected ? selected.account : '' } })}
+        <p>{$_("make_whole.modal_success.check_balance")}</p>
       </div>
 
       <p class="uk-text-center">
         <button 
           class="uk-button uk-button-large uk-button-primary uk-margin-right uk-modal-close" 
           type="button"
-        >OK</button>
+        >{$_("make_whole.modal_success.ok_btn")}</button>
       </p>
     </div>
   </div>
 
   <div id="claimError" uk-modal>
     <div class="uk-modal-dialog uk-modal-body uk-text-center">
       <div class="uk-section">
-        <h2 class="uk-modal-title">Claim Error</h2> 
-        <p>You must turn off miner to claim this account coins.</p>
+        <h2 class="uk-modal-title"> {$_("make_whole.modal_error.title")}</h2> 
+        <p>{errorMsg}</p>
       </div>
 
       <p class="uk-text-center">
         <button 
           class="uk-button uk-button-large uk-button-primary uk-margin-right uk-modal-close" 
           type="button"
-        >OK</button>
+        >{$_("make_whole.modal_error.ok_btn")}</button>
       </p>
     </div>
   </div>
 
   <div class="uk-container">
     <div class="uk-card uk-card-default uk-card-body">
-      <h3 class="uk-card-title">Claim Your Missing Coins</h3>
-      <p>Oops. Occasionally blockchains make math mistakes. 0L tries to fix them as quickly as possible.</p>
-      <p>Miner Identity Subsidy Incident: From Epoch 0 to epoch 52, the payouts to miners was lower than expected. Below you can credit your missing coins from that period.</p>
-      <p>Click <a href="">here</a> to learn more.</p>
+      <h3 class="uk-card-title">{$_("make_whole.card.title")}</h3>
+      {@html $_("make_whole.card.body")}
     </div>
     <div>
 
@@ -101,9 +98,9 @@
       <table class="uk-table uk-table-divider">
         <thead>
           <tr>
-            <th class="uk-text-left">Account</th>
-            <th class="uk-text-right">Amount</th>
-            <th class="uk-text-center">Claim</th>
+            <th class="uk-text-left">{$_("make_whole.table.account")}</th>
+            <th class="uk-text-right">{$_("make_whole.table.amount")}</th>
+            <th class="uk-text-center">{$_("make_whole.table.claim")}</th>
           </tr>
         </thead>
         <tbody>
@@ -120,15 +117,15 @@
                     disabled={isProcessing}
                     style="width: 180px;"
                     class="uk-button uk-button-primary"
-                  >{isProcessing ? "Await..." : "Claim Now"}</button>
+                  >{isProcessing ? $_("make_whole.claim_btn.await") : $_("make_whole.claim_btn.claim")}</button>
                 {/if}
               </td>
             </tr>
           {/each}
         </tbody>
       </table>
     {:else}
-      loading...
+      <span uk-spinner style="position:absolute; top:0px; left:0px"/>
     {/if}
   </div>
 </main>

src/components/make-whole/MakeWholeLink.svelte

@@ -1,25 +1,31 @@
 <script>
-  import { onMount } from "svelte";
+  import { onDestroy, onMount } from 'svelte';
   import { Link } from "svelte-navigator";
   import { makeWhole } from "../../accounts";
   import { routes } from "../../routes";
+  import { _ } from "svelte-i18n";
 
+  let unsubs;
   let hasMakeWhole = false;
   let hasCoinsToClaim = false;
   onMount(async () => {
-    makeWhole.subscribe(mk => {
+    unsubs = makeWhole.subscribe(mk => {
       hasMakeWhole = mk && Object.values(mk).find(credits => credits.length > 0);
       hasCoinsToClaim = mk && Object.values(mk).find(credits => credits.find(credit => !credit.claimed))
     });
   })
 
+  onDestroy(async () => {
+    unsubs && unsubs();
+  })
+
 </script>
 
 {#if hasMakeWhole}
   <Link to={routes.makeWhole}>
     <button class="uk-button {hasCoinsToClaim ? "uk-button-primary" : "uk-button-default"}"> 
       <span uk-icon="icon: warning; ratio: 0.8" style="margin-right: 5px;"></span>
-      Claim Coins
+      {$_("make_whole.link_title")}
     </button>
   </Link>
 {/if}

src/lang/locales/ar.json

@@ -251,5 +251,32 @@
       "corrupted_db": "Current connected node does not have all account events. Don't worry. Your wallet and coins are safe on the chain. Try connecting to another upstream node.", 
       "account_off_chain": "Account selected not onboarded yet."
     }
+  },
+  "make_whole": {
+    "link_title": "Claim Coins",
+    "card": {
+      "title": "Claim Your Missing Coins",
+      "body": "<p>Oops. Occasionally blockchains make math mistakes. 0L tries to fix them as quickly as possible.</p><p>Miner Identity Subsidy Incident: From Epoch 0 to epoch 52, the payouts to miners was lower than expected. Below you can credit your missing coins from that period.</p><p>Click <a href=\"\">here</a> to learn more.</p>"     
+    },
+    "table": {
+      "account": "Account",
+      "amount": "Amount",
+      "claim": "Claim"
+    },
+    "claim_btn": {
+      "await" : "Await...",
+      "claim": "Claim Now"
+    },
+    "modal_success": {
+      "title": "Transation confirmed!",
+      "amount_for_account": "<p>You have claimed <span class=\"uk-text-bold\">{coins} coins</span> for account <br><span class=\"uk-text-bold\">{account}</span>.</p>",
+      "check_balance": "You can check your balance now.",
+      "ok_btn": "OK"
+    },
+    "modal_error": {
+      "title": "Claim Error",
+      "body": "You must turn off miner to claim this account coins.",
+      "ok_btn": "OK"
+    }
   }
 }

src/lang/locales/de.json

@@ -251,5 +251,32 @@
       "corrupted_db": "Der aktuell verbundene Knoten verfügt nicht über alle Kontoereignisse. Keine Sorge. Deine Wallet und Coins sind in Sicherheit auf der Chain. Probiere, dich mit einem anderen Upstream-Knoten zu verbinden.", 
       "account_off_chain": "Das ausgewählte Konto wurde noch nicht geonboarded."
     }
+  },
+  "make_whole": {
+    "link_title": "Claim Coins",
+    "card": {
+      "title": "Claim Your Missing Coins",
+      "body": "<p>Oops. Occasionally blockchains make math mistakes. 0L tries to fix them as quickly as possible.</p><p>Miner Identity Subsidy Incident: From Epoch 0 to epoch 52, the payouts to miners was lower than expected. Below you can credit your missing coins from that period.</p><p>Click <a href=\"\">here</a> to learn more.</p>"     
+    },
+    "table": {
+      "account": "Account",
+      "amount": "Amount",
+      "claim": "Claim"
+    },
+    "claim_btn": {
+      "await" : "Await...",
+      "claim": "Claim Now"
+    },
+    "modal_success": {
+      "title": "Transation confirmed!",
+      "amount_for_account": "<p>You have claimed <span class=\"uk-text-bold\">{coins} coins</span> for account <br><span class=\"uk-text-bold\">{account}</span>.</p>",
+      "check_balance": "You can check your balance now.",
+      "ok_btn": "OK"
+    },
+    "modal_error": {
+      "title": "Claim Error",
+      "body": "You must turn off miner to claim this account coins.",
+      "ok_btn": "OK"
+    }
   }
 }

src/lang/locales/en.json

@@ -251,5 +251,32 @@
       "corrupted_db": "Current connected node does not have all account events. Don't worry. Your wallet and coins are safe on the chain. Try connecting to another upstream node.", 
       "account_off_chain": "Account selected not onboarded yet."
     }
+  },
+  "make_whole": {
+    "link_title": "Claim Coins",
+    "card": {
+      "title": "Claim Your Missing Coins",
+      "body": "<p>Oops. Occasionally blockchains make math mistakes. 0L tries to fix them as quickly as possible.</p><p>Miner Identity Subsidy Incident: From Epoch 0 to epoch 52, the payouts to miners was lower than expected. Below you can credit your missing coins from that period.</p><p>Click <a href=\"\">here</a> to learn more.</p>"     
+    },
+    "table": {
+      "account": "Account",
+      "amount": "Amount",
+      "claim": "Claim"
+    },
+    "claim_btn": {
+      "await" : "Await...",
+      "claim": "Claim Now"
+    },
+    "modal_success": {
+      "title": "Transation confirmed!",
+      "amount_for_account": "<p>You have claimed <span class=\"uk-text-bold\">{coins} coins</span> for account <br><span class=\"uk-text-bold\">{account}</span>.</p>",
+      "check_balance": "You can check your balance now.",
+      "ok_btn": "OK"
+    },
+    "modal_error": {
+      "title": "Claim Error",
+      "body": "You must turn off miner to claim this account coins.",
+      "ok_btn": "OK"
+    }
   }
 }

src/lang/locales/es.json

@@ -251,5 +251,32 @@
       "corrupted_db": "Current connected node does not have all account events. Don't worry. Your wallet and coins are safe on the chain. Try connecting to another upstream node.", 
       "account_off_chain": "Account selected not onboarded yet."
     }
+  },
+  "make_whole": {
+    "link_title": "Claim Coins",
+    "card": {
+      "title": "Claim Your Missing Coins",
+      "body": "<p>Oops. Occasionally blockchains make math mistakes. 0L tries to fix them as quickly as possible.</p><p>Miner Identity Subsidy Incident: From Epoch 0 to epoch 52, the payouts to miners was lower than expected. Below you can credit your missing coins from that period.</p><p>Click <a href=\"\">here</a> to learn more.</p>"     
+    },
+    "table": {
+      "account": "Account",
+      "amount": "Amount",
+      "claim": "Claim"
+    },
+    "claim_btn": {
+      "await" : "Await...",
+      "claim": "Claim Now"
+    },
+    "modal_success": {
+      "title": "Transation confirmed!",
+      "amount_for_account": "<p>You have claimed <span class=\"uk-text-bold\">{coins} coins</span> for account <br><span class=\"uk-text-bold\">{account}</span>.</p>",
+      "check_balance": "You can check your balance now.",
+      "ok_btn": "OK"
+    },
+    "modal_error": {
+      "title": "Claim Error",
+      "body": "You must turn off miner to claim this account coins.",
+      "ok_btn": "OK"
+    }
   }
 }

src/lang/locales/fr.json

@@ -251,5 +251,32 @@
       "corrupted_db": "Actuellement connecté à un noeud n'ayant pas tous les évènements.",
       "data_safe": "Ne vous inquiétez pas, votre compte est sécurisé sur la chaine. Essayez de vous connecter à un autre noeud en amont."
     }
+  },
+  "make_whole": {
+    "link_title": "Claim Coins",
+    "card": {
+      "title": "Claim Your Missing Coins",
+      "body": "<p>Oops. Occasionally blockchains make math mistakes. 0L tries to fix them as quickly as possible.</p><p>Miner Identity Subsidy Incident: From Epoch 0 to epoch 52, the payouts to miners was lower than expected. Below you can credit your missing coins from that period.</p><p>Click <a href=\"\">here</a> to learn more.</p>"     
+    },
+    "table": {
+      "account": "Account",
+      "amount": "Amount",
+      "claim": "Claim"
+    },
+    "claim_btn": {
+      "await" : "Await...",
+      "claim": "Claim Now"
+    },
+    "modal_success": {
+      "title": "Transation confirmed!",
+      "amount_for_account": "<p>You have claimed <span class=\"uk-text-bold\">{coins} coins</span> for account <br><span class=\"uk-text-bold\">{account}</span>.</p>",
+      "check_balance": "You can check your balance now.",
+      "ok_btn": "OK"
+    },
+    "modal_error": {
+      "title": "Claim Error",
+      "body": "You must turn off miner to claim this account coins.",
+      "ok_btn": "OK"
+    }
   }
 }

src/lang/locales/it.json

@@ -251,5 +251,32 @@
       "corrupted_db": "Current connected node does not have all account events. Don't worry. Your wallet and coins are safe on the chain. Try connecting to another upstream node.", 
       "account_off_chain": "Account selected not onboarded yet."
     }
+  },
+  "make_whole": {
+    "link_title": "Claim Coins",
+    "card": {
+      "title": "Claim Your Missing Coins",
+      "body": "<p>Oops. Occasionally blockchains make math mistakes. 0L tries to fix them as quickly as possible.</p><p>Miner Identity Subsidy Incident: From Epoch 0 to epoch 52, the payouts to miners was lower than expected. Below you can credit your missing coins from that period.</p><p>Click <a href=\"\">here</a> to learn more.</p>"     
+    },
+    "table": {
+      "account": "Account",
+      "amount": "Amount",
+      "claim": "Claim"
+    },
+    "claim_btn": {
+      "await" : "Await...",
+      "claim": "Claim Now"
+    },
+    "modal_success": {
+      "title": "Transation confirmed!",
+      "amount_for_account": "<p>You have claimed <span class=\"uk-text-bold\">{coins} coins</span> for account <br><span class=\"uk-text-bold\">{account}</span>.</p>",
+      "check_balance": "You can check your balance now.",
+      "ok_btn": "OK"
+    },
+    "modal_error": {
+      "title": "Claim Error",
+      "body": "You must turn off miner to claim this account coins.",
+      "ok_btn": "OK"
+    }
   }
 }