UI: Port across currency improvements from Florin

src/frontend/electron_vue/src/background.js

@@ -157,7 +157,7 @@ function createMainWindow() {
   });
 
   // Force external hrefs to open in external browser
-  winMain.webContents.on("new-window", function(e, url) {
+  winMain.webContents.on("new-window", function (e, url) {
     e.preventDefault();
     shell.openExternal(url);
   });
@@ -276,9 +276,12 @@ app.on("ready", async () => {
 async function updateRate(seconds) {
   try {
     // use blockhut api instead of https://api.munt.org/api/v1/ticker
-    const response = await axios.get("https://blockhut.com/munt/munteuro.json");
+    //const response = await axios.get("https://blockhut.com/munt/munteuro.json");
+    const response = await axios.get("https://munt.chainviewer.org/api/v1/ticker");
+    const currentRate = response.data.data.find(item => item.code.toLowerCase() === store.state.app.currency.value.toLowerCase());
 
-    store.dispatch("app/SET_RATE", response.data.eurmunt);
+    store.dispatch("app/SET_RATE", currentRate.rate);
+    store.dispatch("app/SET_CURRENCIES", response.data.data);
   } catch (error) {
     console.error(error);
   } finally {

src/frontend/electron_vue/src/components/AccountHeader.vue

@@ -94,14 +94,14 @@ export default {
     }
   },
   computed: {
-    ...mapState("app", ["rate"]),
+    ...mapState("app", ["rate", "currency"]),
     ...mapState("wallet", ["walletPassword", "unlocked"]),
     name() {
       return this.account ? this.account.label : null;
     },
     totalBalanceFiat() {
       if (!this.rate) return "";
-      return `€ ${formatMoneyForDisplay(this.account.balance * this.rate, true)}`;
+      return `${this.currency.symbol || ""} ${formatMoneyForDisplay(this.account.balance * this.rate, true)}`;
     },
     balanceForDisplay() {
       if (!this.account || this.account.balance === undefined) return "";

src/frontend/electron_vue/src/layouts/WalletLayout.vue

@@ -74,7 +74,7 @@ export default {
     AccountTooltip
   },
   computed: {
-    ...mapState("app", ["progress", "rate"]),
+    ...mapState("app", ["progress", "rate", "currency"]),
     ...mapState("wallet", ["activeAccount", "unlocked"]),
     ...mapGetters("wallet", ["totalBalance", "miningAccount", "account"]),
     walletLayoutClasses() {
@@ -92,7 +92,7 @@ export default {
     },
     totalBalanceFiat() {
       if (!this.rate) return "";
-      return `€ ${formatMoneyForDisplay(this.totalBalance * this.rate, true)}`;
+      return `${this.currency.symbol || ""} ${formatMoneyForDisplay(this.totalBalance * this.rate, true)}`;
     },
     balanceForDisplay() {
       if (this.totalBalance == null) return "";

src/frontend/electron_vue/src/locales/en.json

@@ -89,7 +89,8 @@
     "percent": "%",
     "add_to_holdin": "Add to holdin.com",
     "remove_from_holdin": "Remove from holdin.com",
-    "optimise_holding_account": "Select Funding Account"
+    "optimise_holding_account": "Select Funding Account",
+    "optimise_info": "Your account currently has {parts} parts. After optimisation, your account will have {futureOptimalAmount} parts."
   },
   "loader": {
     "shutdown": "Shutting down...",
@@ -121,7 +122,8 @@
     "choose_language": "Language",
     "choose_decimal_places": "Decimal places",
     "english": "EN",
-    "dutch": "NL"
+    "dutch": "NL",
+    "select_display_currency": "Select Display Currency"
   },
   "setup": {
     "choose_password": "Choose a password of at least 6 characters",
@@ -164,7 +166,8 @@
     "confirm_transaction": "Confirm transaction",
     "target_account": "Send to account",
     "fee_will_be_subtracted": "Fee will be subtracted from the amount",
-    "unlock_your_wallet_to_complete_the_transaction": "Unlock your wallet to complete the transaction"
+    "unlock_your_wallet_to_complete_the_transaction": "Unlock your wallet to complete the transaction",
+    "select_account": "Select Account"
   },
   "renew_saving_account": {
     "funding_account": "Pay renewal fee from account"

src/frontend/electron_vue/src/store/index.js

@@ -22,14 +22,16 @@ if (process.type !== "renderer") {
       // only store the paths listed below
       "mining.settings",
       "app.language",
-      "app.decimals"
+      "app.decimals",
+      "app.currency"
     ],
     ignoredCommits: [
       // only update persisted state on commits listed below
       "mining/SET_MEMORY_SIZE",
       "mining/SET_THREAD_COUNT",
       "mining/SET_ARENA_THREAD_COUNT",
       "app/SET_LANGUAGE",
+      "app/SET_CURRENCY",
       "app/SET_DECIMALS"
     ]
   });

src/frontend/electron_vue/src/store/modules/app.js

@@ -25,7 +25,8 @@ const app = {
     walletVersion: null,
     rate: null,
     language: "en",
-    decimals: 2
+    decimals: 2,
+    currency: { value: "Eur", label: "Euro", symbol: "€" }
   },
   mutations: {
     SET_CORE_READY(state) {
@@ -50,6 +51,9 @@ const app = {
     SET_RATE(state, rate) {
       state.rate = rate;
     },
+    SET_CURRENCIES(state, currencies) {
+      state.currencies = currencies;
+    },
     SET_WALLET_EXISTS(state, walletExists) {
       state.walletExists = walletExists;
     },
@@ -62,6 +66,9 @@ const app = {
     SET_LANGUAGE(state, language) {
       state.language = language;
     },
+    SET_CURRENCY(state, currency) {
+      state.currency = currency;
+    },
     SET_DECIMALS(state, decimal) {
       state.decimals = decimal;
     }
@@ -90,12 +97,18 @@ const app = {
     SET_RATE({ commit }, rate) {
       commit("SET_RATE", rate);
     },
+    SET_CURRENCIES({ commit }, currencies) {
+      commit("SET_CURRENCIES", currencies);
+    },
     SET_ACTIVITY_INDICATOR({ commit }, activityIndicator) {
       commit("SET_ACTIVITY_INDICATOR", activityIndicator);
     },
     SET_LANGUAGE({ commit }, language) {
       commit("SET_LANGUAGE", language);
     },
+    SET_CURRENCY({ commit }, currency) {
+      commit("SET_CURRENCY", currency);
+    },
     SET_DECIMALS({ commit }, decimal) {
       commit("SET_DECIMALS", decimal);
     },

src/frontend/electron_vue/src/views/Account/MiningAccount/index.vue

@@ -192,14 +192,14 @@ export default {
       settings: "settings",
       totalBalanceFiat() {
         if (!this.rate) return "";
-        return `€ ${formatMoneyForDisplay(this.account.balance * this.rate, true)}`;
+        return `${this.currency.symbol || ""} ${formatMoneyForDisplay(this.account.balance * this.rate, true)}`;
       },
       balanceForDisplay() {
         if (this.account.balance == null) return "";
         return formatMoneyForDisplay(this.account.balance);
       }
     }),
-    ...mapState("app", ["rate"]),
+    ...mapState("app", ["rate", "currency"]),
     isMiningView() {
       return this.$route.name === "account";
     },

src/frontend/electron_vue/src/views/Account/SavingAccount/OptimiseAccount.vue

@@ -5,6 +5,9 @@
     </portal>
 
     <div class="main">
+      <p>
+        {{ $t("saving_account.optimise_info", { parts: parts, futureOptimalAmount: futureOptimalAmount }) }}
+      </p>
       <app-form-field title="saving_account.optimise_holding_account">
         <select-list :options="fundingAccounts" :default="fundingAccount" v-model="fundingAccount" />
       </app-form-field>
@@ -36,7 +39,9 @@ export default {
       password: null,
       fundingAccount: null,
       isAmountInvalid: false,
-      isPasswordInvalid: false
+      isPasswordInvalid: false,
+      parts: null,
+      futureOptimalAmount: null
     };
   },
   computed: {
@@ -57,9 +62,18 @@ export default {
     disableSendButton() {
       if (this.computedPassword.trim().length === 0) return true;
       return false;
+    },
+    accountParts() {
+      return this.getStatistics("account_parts");
     }
   },
   mounted() {
+    const stats = WitnessController.GetAccountWitnessStatistics(this.account.UUID);
+    this.parts = stats["account_parts"];
+
+    let optimalAmounts = WitnessController.GetOptimalWitnessDistributionForAccount(this.account.UUID);
+    this.futureOptimalAmount = optimalAmounts.length;
+
     if (this.fundingAccounts.length) {
       this.fundingAccount = this.fundingAccounts[0];
     }

src/frontend/electron_vue/src/views/Account/SavingAccount/index.vue

@@ -95,7 +95,7 @@
             <footer-button title="buttons.saving_key" :icon="['fal', 'key']" routeName="link-saving-account" @click="routeTo" />
             <footer-button title="buttons.transactions" :icon="['far', 'list-ul']" routeName="transactions" @click="routeTo" />
             <footer-button title="buttons.send" :icon="['fal', 'arrow-from-bottom']" routeName="send-saving" @click="routeTo" />
-            <footer-button v-if="optimiseButtonVisible" title="buttons.optimise" :icon="['fal', 'redo-alt']" routeName="optimise-account" @click="routeTo" />
+            <footer-button :class="optimiseButtonClass" title="buttons.optimise" :icon="['fal', 'redo-alt']" routeName="optimise-account" @click="routeTo" />
             <footer-button v-if="renewButtonVisible" title="buttons.renew" :icon="['fal', 'redo-alt']" routeName="renew-account" @click="routeTo" />
           </div>
         </div>
@@ -132,7 +132,7 @@ export default {
     this.isOverflown();
   },
   computed: {
-    ...mapState("app", ["rate", "activityIndicator"]),
+    ...mapState("app", ["rate", "activityIndicator", "currency"]),
     isAccountView() {
       return this.$route.name === "account";
     },
@@ -185,9 +185,17 @@ export default {
     optimiseButtonVisible() {
       return this.getStatistics("is_optimal") === false;
     },
+    optimiseButtonClass() {
+      if (this.getStatistics("is_optimal") === true && this.getStatistics("blocks_since_last_activity") < 100) {
+        return "optimise-button-inactive";
+      } else if (this.getStatistics("is_optimal") === false) {
+        return "optimise-button-hidden";
+      }
+      return "";
+    },
     totalBalanceFiat() {
       if (!this.rate) return "";
-      return `€ ${formatMoneyForDisplay(this.account.balance * this.rate, true)}`;
+      return `${this.currency.symbol || ""} ${formatMoneyForDisplay(this.account.balance * this.rate, true)}`;
     },
     balanceForDisplay() {
       if (this.account.balance == null) return "";
@@ -207,17 +215,23 @@ export default {
     account() {
       this.initialize();
     },
-    compoundingPercent() {
+    compoundingPercent(newVal) {
       // Prevent calling this on initialization.
       if (this.compoundingPercent === 0) {
         return;
       } else {
-        if (this.keyHash) {
-          BackendUtilities.holdinAPIActions(this.keyHash, "distribution", this.compoundingPercent);
-          WitnessController.SetAccountCompounding(this.account.UUID, this.compoundingPercent);
-        } else {
-          WitnessController.SetAccountCompounding(this.account.UUID, this.compoundingPercent);
-        }
+        const timeoutHandler = setTimeout(() => {
+          if (newVal == this.compoundingPercent) {
+            if (this.keyHash) {
+              BackendUtilities.holdinAPIActions(this.keyHash, "distribution", this.compoundingPercent);
+              WitnessController.SetAccountCompounding(this.account.UUID, this.compoundingPercent);
+            } else {
+              WitnessController.SetAccountCompounding(this.account.UUID, this.compoundingPercent);
+            }
+          }
+        }, 1000);
+
+        return timeoutHandler;
       }
     }
   },
@@ -269,8 +283,12 @@ export default {
       return classNames;
     },
     routeTo(route) {
-      if (this.$route.name === route) return;
-      this.$router.push({ name: route, params: { id: this.account.UUID } });
+      if (route === "optimise-account" && this.optimiseButtonClass === "optimise-button-inactive") {
+        alert("Cannot perform this operation while account is in cooldown, please wait and try again later.");
+      } else {
+        if (this.$route.name === route) return;
+        this.$router.push({ name: route, params: { id: this.account.UUID } });
+      }
     },
     isOverflown(e) {
       // Determine whether to show the overflow arrow
@@ -374,4 +392,10 @@ export default {
   align-items: center;
   bottom: 0;
 }
+.optimise-button-inactive {
+  color: #a8a8a8;
+}
+.optimise-button-hidden {
+  display: none !important;
+}
 </style>