Merge pull request #1245 from RafaelTaranto/backport/machine-coin-rates

LAM-481 backport: machine coin rates

i18n/parse.js

@@ -74,7 +74,7 @@ const app = fs.readFileSync(appPath, {encoding: 'utf8'})
 const outPath = path.resolve(__dirname, '../i18n/ui/lbm-ui_en-US.po')
 
 const coins = [
-  'Bitcoin', 'Ethereum', 'Zcash', 'Litecoin', 'Dash', 'Bitcoin Cash'
+  'Bitcoin', 'Ethereum', 'Zcash', 'Litecoin', 'Dash', 'Bitcoin Cash', 'Monero', 'USDT'
 ]
 
 function run (){

i18n/ui/lbm-ui_en-US.po

@@ -102,6 +102,10 @@ msgstr "Please contact the operator if you wish to learn more."
 msgid "Languages"
 msgstr "Languages"
 
+#: On screen: choose_coin
+msgid "Rates"
+msgstr "Rates"
+
 #: On screen: choose_coin
 msgid "Redeem"
 msgstr "Redeem"
@@ -594,6 +598,22 @@ msgstr "If you are sure of the code, please contact the operator for clarificati
 msgid "Enter a different code"
 msgstr "Enter a different code"
 
+#: On screen: rates
+msgid "Exchange Rates"
+msgstr "Exchange Rates"
+
+#: On screen: rates
+msgid "Buy"
+msgstr "Buy"
+
+#: On screen: rates
+msgid "Crypto"
+msgstr "Crypto"
+
+#: On screen: rates
+msgid "Sell"
+msgstr "Sell"
+
 #: On screen: recycler-continue
 msgid "Depositing bills..."
 msgstr "Depositing bills..."
@@ -1078,3 +1098,11 @@ msgstr "Dash"
 msgid "Bitcoin Cash"
 msgstr "Bitcoin Cash"
 
+#: On screen: coins
+msgid "Monero"
+msgstr "Monero"
+
+#: On screen: coins
+msgid "USDT"
+msgstr "USDT"
+

lib/brain.js

@@ -1098,6 +1098,7 @@ Brain.prototype._connectedBrowser = function _connectedBrowser () {
       cryptomatModel,
       version,
       operatorInfo: this.trader?.operatorInfo ?? { active: false },
+      screenOpts: this.trader?.machineScreenOpts
     }
 
     return this.browser().send(rec)
@@ -1130,7 +1131,8 @@ Brain.prototype._connectedBrowser = function _connectedBrowser () {
     operatorInfo: this.trader.operatorInfo,
     cryptomatModel,
     areThereAvailablePromoCodes: this.trader.areThereAvailablePromoCodes,
-    supportedCoins: this.mapCryptoUnitsDisplay(this.trader.coins)
+    supportedCoins: this.mapCryptoUnitsDisplay(this.trader.coins),
+    screenOpts: this.trader.machineScreenOpts
   }
 
   this.browser().send(fullRec)
@@ -1375,6 +1377,9 @@ Brain.prototype._processReal = function _processReal (req) {
     case 'leftoverBillsRemoved':
       this._leftoverBillsRemoved()
       break
+    case 'ratesScreen':
+      this.ratesScreen()
+      break
     default:
       break
   }
@@ -2334,6 +2339,7 @@ Brain.prototype._chooseCoinScreen = function _chooseCoinsScreen (localeInfo, cas
     localeInfo: localeInfo,
     cassettes: cassettes,
     coins: this.trader.coins,
+    screenOpts: this.trader.machineScreenOpts,
     twoWayMode: this.twoWayMode(),
     supportedCoins: this.mapCryptoUnitsDisplay(this.trader.coins)
   })
@@ -2670,7 +2676,8 @@ Brain.prototype.sendRates = function sendRates () {
     terms: _.assign(this.trader.terms, this._getTermsDelayConfig()),
     operatorInfo: this.trader.operatorInfo,
     areThereAvailablePromoCodes: this.trader.areThereAvailablePromoCodes,
-    supportedCoins: this.mapCryptoUnitsDisplay(this.trader.coins)
+    supportedCoins: this.mapCryptoUnitsDisplay(this.trader.coins),
+    screenOpts: this.trader.machineScreenOpts
   }
 
   this.browser().send(rec)
@@ -4163,6 +4170,13 @@ Brain.prototype.cancelTransaction = function cancelTransaction (previousState) {
   }
 }
 
+Brain.prototype.ratesScreen = function () {
+  const coins = _.map(it => it.cryptoCode, this.trader.coins)
+  const rates = _.reduce((acc, value) => Object.assign({ [value]: _.mapValues(it => it.toString(), this.trader.rates(value)) }, acc), {}, coins)
+
+  this._transitionState('rates', { allRates: rates, ratesFiat: this.trader.locale.fiatCode })
+}
+
 Brain.prototype.browser = function browser () {
   return this.browserObj
 }

lib/trader.js

@@ -90,6 +90,12 @@ query($configVersion: Int, $currentHash: String) {
         addressQRCode
       }
 
+      screenOptions {
+        rates {
+          active
+        }
+      }
+
       triggersAutomation {
         sanctions
         idCardPhoto
@@ -716,6 +722,7 @@ Trader.prototype.pollHandler = function pollHandler (data) {
       )
     )
     this.triggers = addCustomInfoRequestIdToTriggers(data.triggers)
+    this.machineScreenOpts = data.screenOptions
 
     this.receiptPrintingActive = data.receiptInfo && data.receiptInfo.paper
     this.smsReceiptActive = data.receiptInfo && data.receiptInfo.sms
@@ -907,7 +914,7 @@ Trader.prototype.networkHeartbeat = function networkHeartbeat (obj) {
     body: obj,
     method: 'POST'
   })
-  .catch(err => console.error('Failed to send network heartbeat', err))
+    .catch(err => console.error('Failed to send network heartbeat', err))
 }
 
 Trader.prototype.networkPerformance = function networkPerformance (obj) {
@@ -916,7 +923,7 @@ Trader.prototype.networkPerformance = function networkPerformance (obj) {
     body: obj,
     method: 'POST'
   })
-  .catch(err => console.error('Failed to send network performance', err))
+    .catch(err => console.error('Failed to send network performance', err))
 }
 
 Trader.prototype.emptyUnit = function emptyUnit (body) {
@@ -1030,7 +1037,8 @@ function isNewState (res) {
   const pare = r => ({
     twoWayMode: r.twoWayMode,
     locale: r.locale,
-    coins: _.map('cryptoCode', r.coins)
+    coins: _.map('cryptoCode', r.coins),
+    screenOps: r.machineScreenOpts
   })
 
   if (_.isEqual(pare(res), oldState)) return false

ui/css/main.scss

@@ -733,6 +733,10 @@ footer {
   width: 30vh;
 }
 
+.rates-section {
+  margin-left: 2em;
+}
+
 #change-language-section #language-dropdown-toggle {
   align-items: center;
 }
@@ -1444,6 +1448,10 @@ footer {
     display: flex;
     justify-content: flex-end;
   }
+  .rates-section {
+    margin-left: 0; 
+    margin-right: 2em;
+  }
 }
 
 .send-only-total {

ui/html/choose-coin.html

@@ -15,6 +15,11 @@
       <div id="languages" class="dropdown hide"></div>
       <div class="js-two-language small-action-button tl2"></div>
     </section>
+    <section id="rates-section" class="button cash-out-color rates-section">
+      <div id="rates-section-button" class="small-action-button tl2">
+        <div class="js-i18n">Rates</div>
+      </div>
+    </section>
   </header>
 
   <main class="nm-margin-bottom">

ui/html/insert_promo_code.html

@@ -72,7 +72,7 @@
   </main>
 
   <footer>
-    <button id="submit-promo-code" class="filled-progress-button button">Submit</button>
+    <button id="submit-promo-code" class="filled-progress-button button js-i18n">Submit</button>
   </footer>
 
 </section>

ui/html/rates.html

@@ -0,0 +1,26 @@
+<section
+  id="rates"
+  class="viewport rates_state system-color"
+  data-tr-section="rates"
+  data-screentype="info-action-tp"
+>
+  <header>
+    <div id="rates-close" class="cancel-button-wrapper">
+      <img class="cancel-button" src="images/close-icon-amaz.svg" />
+    </div>
+  </header>
+
+  <main>
+    <div class="rates-header">
+      <h2 class="js-i18n xs-margin-bottom">Exchange Rates</h2>
+      <h3 id="rates-fiat-currency">EUR</h3>
+    </div>
+    <div id="rates-content" class="rates-content">
+      <div class="xs-margin-bottom">
+        <h4 class="js-i18n">Buy</h4>
+        <h4 class="js-i18n">Crypto</h4>
+        <h4 class="js-i18n">Sell</h4>
+      </div>
+    </div>
+  </main>
+</section>

ui/html/withdraw-failure.html

@@ -8,7 +8,7 @@
   <main>
     <section class="primary-side">
       <h2 class="js-i18n primary-side-title no-margin-top xs-margin-bottom">We got this</h2>
-      <p class="d2 no-margin-top">
+      <p class="d2 no-margin-top js-i18n">
         Our Internet was down for a bit but you'll receive your funds as soon as our connection is back.
       </p>
       <p class="js-i18n d2 white xs-margin-bottom">You Purchased</p>