site: bond asset choice wording tweaks and settings page fixes

This tweaks the wording on the bond asset selection form and adds the "whatsabond" information text. This also fixes a bug where the settings page was using the old registration fee instead of the "bonds fee buffer". It also fixes the condition for skipping the wallet balance wait form created from the settings page. --------- Co-authored-by: buck54321 <buck54321@gmail.com>
decred · Jun 19, 2023 · 29faa9b · 29faa9b
1 parent 9908805
commit 29faa9b
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 22 deletions.
diff --git a/client/webserver/locales/en-us.go b/client/webserver/locales/en-us.go
@@ -186,7 +186,7 @@ var EnUS = map[string]string{
 	"Export Trades":               "Export Trades",
 	"change the wallet type":      "change the wallet type",
 	"confirmations":               "confirmations",
-	"how_reg":                     "How will you post bond?",
+	"how_reg":                     "How will you create your bond?",
 	"All markets at":              "All markets at",
 	"pick a different asset":      "pick a different asset",
 	"Create":                      "Create",

diff --git a/client/webserver/site/src/css/forms.scss b/client/webserver/site/src/css/forms.scss
@@ -1,5 +1,7 @@
 #regAssetForm {
-  position: relative;
+  #whatsabond {
+    max-width: 425px;
+  }
 
   div.reg-asset-allmkts {
     min-width: 210px;

diff --git a/client/webserver/site/src/html/bodybuilder.tmpl b/client/webserver/site/src/html/bodybuilder.tmpl
@@ -9,7 +9,7 @@
   <link rel="icon" href="/img/favicon.png?v=AK4XS4">
   <meta name="description" content="Decred DEX Client Web Portal">
   <title>{{.Title}}</title>
-  <link href="/css/style.css?v=rgcDpVd" rel="stylesheet">
+  <link href="/css/style.css?v=McgiIQS" rel="stylesheet">
 </head>
 <body {{if .UserInfo.DarkMode}} class="dark"{{end}}>
   <div class="popup-notes" id="popupNotes">
@@ -104,7 +104,7 @@
 {{end}}
 
 {{define "bottom"}}
-<script src="/js/entry.js?v=HcbEs4c"></script>
+<script src="/js/entry.js?v=McgiIQS"></script>
 </body>
 </html>
 {{end}}
diff --git a/client/webserver/site/src/html/forms.tmpl b/client/webserver/site/src/html/forms.tmpl
@@ -218,6 +218,10 @@
 
 {{define "regAssetForm"}}
 <div class="text-center sans-light fs24 mb-3" data-tmpl="how">[[[how_reg]]]</div>
+<div id="whatsabond" class="mt-1 fs14">
+  <span class="ico-info"></span>
+  <span class="ms-1">[[[whatsabond]]]</span>
+</div>
 <div data-tmpl="assets">
   <div data-tmpl="assetTmpl" class="reg-asset pointer d-flex align-items-stretch">
     <div class="reg-asset-logo-wrapper d-flex align-items-center justify-content-center">

diff --git a/client/webserver/site/src/js/register.ts b/client/webserver/site/src/js/register.ts
@@ -94,7 +94,7 @@ export default class RegistrationPage extends BasePage {
       if (wallet) {
         const bondAsset = this.currentDEX.bondAssets[asset.symbol]
         const bondsFeeBuffer = await this.getBondsFeeBuffer(assetID, page.regAssetForm)
-        if (wallet.synced && wallet.balance.available > 2 * bondAsset.amount + bondsFeeBuffer) {
+        if (wallet.synced && wallet.balance.available >= 2 * bondAsset.amount + bondsFeeBuffer) {
           this.animateConfirmForm(page.regAssetForm)
           return
         }
@@ -165,7 +165,7 @@ export default class RegistrationPage extends BasePage {
     Doc.show(this.page.confirmRegForm)
   }
 
-  // Retrieve an estimate for the tx fee needed to pay the registration fee.
+  // Retrieve an estimate for the tx fee needed to create new bond reserves.
   async getBondsFeeBuffer (assetID: number, form: HTMLElement) {
     const loaded = app().loading(form)
     const res = await postJSON('/api/bondsfeebuffer', { assetID })
@@ -248,7 +248,7 @@ export default class RegistrationPage extends BasePage {
     const bondAmt = this.currentDEX.bondAssets[asset.symbol].amount
 
     const bondsFeeBuffer = await this.getBondsFeeBuffer(assetID, page.newWalletForm)
-    if (wallet.synced && wallet.balance.available > 2 * bondAmt + bondsFeeBuffer) {
+    if (wallet.synced && wallet.balance.available >= 2 * bondAmt + bondsFeeBuffer) {
       await this.animateConfirmForm(page.newWalletForm)
       return
     }

diff --git a/client/webserver/site/src/js/settings.ts b/client/webserver/site/src/js/settings.ts
@@ -80,12 +80,12 @@ export default class SettingsPage extends BasePage {
       const wallet = asset.wallet
       if (wallet) {
         const bondAsset = this.currentDEX.bondAssets[asset.symbol]
-        if (wallet.synced && wallet.balance.available > bondAsset.amount) {
+        const bondsFeeBuffer = await this.getBondsFeeBuffer(assetID, page.regAssetForm)
+        if (wallet.synced && wallet.balance.available >= 2 * bondAsset.amount + bondsFeeBuffer) {
           this.animateConfirmForm(page.regAssetForm)
           return
         }
-        const txFee = await this.getRegistrationTxFeeEstimate(assetID, page.regAssetForm)
-        this.walletWaitForm.setWallet(wallet, txFee)
+        this.walletWaitForm.setWallet(wallet, bondsFeeBuffer)
         this.currentForm = page.walletWait
         forms.slideSwap(page.regAssetForm, page.walletWait)
         return
@@ -159,20 +159,15 @@ export default class SettingsPage extends BasePage {
     })
   }
 
-  // Retrieve an estimate for the tx fee needed to pay the registration fee.
-  async getRegistrationTxFeeEstimate (assetID: number, form: HTMLElement) {
-    const cert = await this.getCertFile()
+  // Retrieve an estimate for the tx fee needed to create new bond reserves.
+  async getBondsFeeBuffer (assetID: number, form: HTMLElement) {
     const loaded = app().loading(form)
-    const res = await postJSON('/api/regtxfee', {
-      addr: this.currentDEX.host,
-      cert: cert,
-      asset: assetID
-    })
+    const res = await postJSON('/api/bondsfeebuffer', { assetID })
     loaded()
     if (!app().checkResponse(res)) {
       return 0
     }
-    return res.txfee
+    return res.feeBuffer
   }
 
   async newWalletCreated (assetID: number) {
@@ -183,13 +178,13 @@ export default class SettingsPage extends BasePage {
     const wallet = asset.wallet
     const bondAmt = this.currentDEX.bondAssets[asset.symbol].amount
 
-    if (wallet.synced && wallet.balance.available > bondAmt) {
+    const bondsFeeBuffer = await this.getBondsFeeBuffer(assetID, page.newWalletForm)
+    if (wallet.synced && wallet.balance.available >= 2 * bondAmt + bondsFeeBuffer) {
       await this.animateConfirmForm(page.newWalletForm)
       return
     }
 
-    const txFee = await this.getRegistrationTxFeeEstimate(assetID, page.newWalletForm)
-    this.walletWaitForm.setWallet(wallet, txFee)
+    this.walletWaitForm.setWallet(wallet, bondsFeeBuffer)
     this.currentForm = page.walletWait
     await forms.slideSwap(page.newWalletForm, page.walletWait)
   }