From 01d54b55810a47bf67fde44c1e6b9145b91c3952 Mon Sep 17 00:00:00 2001
From: Petr Balashov <pbca26@gmail.com>
Date: Wed, 17 May 2017 12:20:53 +0200
Subject: [PATCH] code styling update

---
 react/src/components/dashboard/about.js       |   2 +-
 react/src/components/dashboard/atomic.js      |  45 ++-
 react/src/components/dashboard/coinTile.js    |  12 +-
 .../src/components/dashboard/coinTileItem.js  |  24 +-
 react/src/components/dashboard/dashboard.js   |  22 +-
 react/src/components/dashboard/edex.js        |   2 +-
 react/src/components/dashboard/jumblr.js      | 174 +++++----
 react/src/components/dashboard/loginModal.js  |  41 ++-
 react/src/components/dashboard/navbar.js      |  66 ++--
 react/src/components/dashboard/receiveCoin.js |  70 ++--
 react/src/components/dashboard/sendCoin.js    | 250 ++++++++-----
 react/src/components/dashboard/settings.js    | 337 +++++++++++-------
 react/src/components/dashboard/walletsData.js |   4 +-
 react/src/translate/en.js                     |  34 +-
 14 files changed, 705 insertions(+), 378 deletions(-)

diff --git a/react/src/components/dashboard/about.js b/react/src/components/dashboard/about.js
index d397a06..f671f59 100644
--- a/react/src/components/dashboard/about.js
+++ b/react/src/components/dashboard/about.js
@@ -4,7 +4,7 @@ import { translate } from '../../translate/translate';
 class About extends React.Component {
   render() {
     return(
-      <div className="page" style={{marginLeft: '0'}}>
+      <div className="page" style={{ marginLeft: '0' }}>
         <div className="page-content" id="section-about-iguana">
           <h2>About Iguana</h2>
           <p>Page content goes here</p>
diff --git a/react/src/components/dashboard/atomic.js b/react/src/components/dashboard/atomic.js
index 5036aad..5cf4bcf 100644
--- a/react/src/components/dashboard/atomic.js
+++ b/react/src/components/dashboard/atomic.js
@@ -481,34 +481,51 @@ class Atomic extends React.Component {
 
   render() {
     return (
-      <div className="page" style={{marginLeft: '0'}}>
+      <div className="page" style={{ marginLeft: '0' }}>
         <div className="page-content" id="section-iguana-atomic-explorer">
-          <div className="row" id="atomic-explorer" data-plugin="masonry">
+          <div className="row" id="atomic-explorer">
             <div className="col-xlg-12 col-md-12">
               <h4 className="font-size-14 text-uppercase">Atomic Explorer</h4>
               <div className="panel panel-bordered">
                 <div className="panel-body">
                   <div className="col-sm-4 col-xs-12">
                     <div className="form-group">
-                      <select className="form-control form-material" id="atomic_explorer_select_coin_options" onChange={this.updateSelectedCoin}>
-                        <option value="-">{translate('INDEX.SELECT_COIN')}</option>
+                      <select
+                        className="form-control
+                        form-material"
+                        id="atomic_explorer_select_coin_options"
+                        onChange={ this.updateSelectedCoin }>
+                        <option value="-">{ translate('INDEX.SELECT_COIN') }</option>
                         <AddCoinOptionsCrypto />
                         <AddCoinOptionsAC />
                         <AddCoinOptionsACFiat />
                       </select>
                     </div>
                   </div>
-                  <div className="col-sm-4 col-xs-12" style={{textAlign: 'center'}}>
-                    <select className="form-control form-material" id="atomic_explorer_select_command_options" onChange={this.updateSelectedAPI}>
-                      <option value="">-{translate('ATOMIC.SELECT_COMMAND')}-</option>
-                      {this.renderAtomicOptions()}
+                  <div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}>
+                    <select
+                      className="form-control form-material"
+                      id="atomic_explorer_select_command_options"
+                      onChange={this.updateSelectedAPI}>
+                      <option value="">-{ translate('ATOMIC.SELECT_COMMAND') }-</option>
+                      { this.renderAtomicOptions() }
                     </select>
                   </div>
-                  <div className="col-sm-4 col-xs-12" style={{textAlign: 'center'}}>
-                    <input type="text" className="form-control" id="atomic_explorer_input_data" name="atomic_explorer_input_data" placeholder={translate('ATOMIC.INPUT_PLACEHOLDER')} onChange={this.updateInput} />
+                  <div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}>
+                    <input
+                      type="text"
+                      className="form-control"
+                      id="atomic_explorer_input_data"
+                      name="atomic_explorer_input_data"
+                      placeholder={ translate('ATOMIC.INPUT_PLACEHOLDER') }
+                      onChange={ this.updateInput } />
                   </div>
-                  <div className="col-sm-12 col-xs-12" style={{textAlign: 'center'}}>
-                    <button type="button" className="btn btn-primary waves-effect waves-light" id="atomic_explorer_getcoinpeers_btn" onClick={this.getAtomicData}>{translate('ATOMIC.SUBMIT')}</button>
+                  <div className="col-sm-12 col-xs-12" style={{ textAlign: 'center' }}>
+                    <button
+                      type="button"
+                      className="btn btn-primary waves-effect waves-light"
+                      id="atomic_explorer_getcoinpeers_btn"
+                      onClick={ this.getAtomicData }>{ translate('ATOMIC.SUBMIT') }</button>
                   </div>
                 </div>
               </div>
@@ -516,11 +533,11 @@ class Atomic extends React.Component {
             <div className="col-xlg-4 col-md-12">
               <div className="panel">
                 <div className="panel-heading">
-                  <h3 className="panel-title">{translate('ATOMIC.RAW_OUTPUT')}</h3>
+                  <h3 className="panel-title">{ translate('ATOMIC.RAW_OUTPUT') }</h3>
                 </div>
                 <div className="panel-body">
                   <div className="tab-content">
-                    <pre id="atomic-explorer-commands-output">{this.state.output}</pre>
+                    <pre id="atomic-explorer-commands-output">{ this.state.output }</pre>
                   </div>
                 </div>
               </div>
diff --git a/react/src/components/dashboard/coinTile.js b/react/src/components/dashboard/coinTile.js
index 8768636..85fca63 100644
--- a/react/src/components/dashboard/coinTile.js
+++ b/react/src/components/dashboard/coinTile.js
@@ -338,19 +338,19 @@ class CoinTile extends React.Component {
 
     return (
       items.map((item, i) =>
-        <CoinTileItem key={i} i={i} item={item} {...this.props} />)
+        <CoinTileItem key={ i } i={ i } item={ item } {...this.props} />)
     );
   }
 
   render() {
     return (
-      <div className="page-aside" style={{paddingTop: '80px'}}>
+      <div className="page-aside" style={{ paddingTop: '80px' }}>
         <div className="page-aside-switch">
           <i className="icon md-chevron-left" aria-hidden="true"></i>
           <i className="icon md-chevron-right" aria-hidden="true"></i>
         </div>
         <div className="page-aside-inner">
-          <div className="search-wallet-widgets panel" style={{display: 'none'}}>
+          <div className="search-wallet-widgets panel" style={{ display: 'none' }}>
             <div className="panel-heading">
               <div className="panel-actions">
                 <div className="input-search input-group-sm">
@@ -360,14 +360,14 @@ class CoinTile extends React.Component {
                   <input type="text" className="form-control" name="" placeholder="Search..." disabled />
                 </div>
               </div>
-              <h3 className="panel-title">{translate('INDEX.ACTIVE_COINS')}</h3>
+              <h3 className="panel-title">{ translate('INDEX.ACTIVE_COINS') }</h3>
             </div>
           </div>
-          <div className="wallet-widgets-list" data-plugin="pageAsideScroll">
+          <div className="wallet-widgets-list">
             <div data-role="container">
               <div data-role="content">
                 <div className="list-group row wallet-widgets-row">
-                  {this.renderTiles()}
+                  { this.renderTiles() }
                 </div>
               </div>
             </div>
diff --git a/react/src/components/dashboard/coinTileItem.js b/react/src/components/dashboard/coinTileItem.js
index 6ae2ce3..fd1d79d 100644
--- a/react/src/components/dashboard/coinTileItem.js
+++ b/react/src/components/dashboard/coinTileItem.js
@@ -65,7 +65,10 @@ class CoinTileItem extends React.Component {
       Store.dispatch(getKMDAddressesNative(coin, mode, useAddress));
       Store.dispatch(getShepherdCache(JSON.parse(sessionStorage.getItem('IguanaActiveAccount')).pubkey, coin));
 
-      if (this.props && this.props.Dashboard && this.props.Dashboard.activeHandle && this.props.Dashboard.activeHandle[coin]) {
+      if (this.props &&
+          this.props.Dashboard &&
+          this.props.Dashboard.activeHandle &&
+          this.props.Dashboard.activeHandle[coin]) {
         if (!this.props.ActiveCoin.addresses) {
           Store.dispatch(getAddressesByAccount(coin, mode));
         }
@@ -134,14 +137,19 @@ class CoinTileItem extends React.Component {
     const { item } = this.props;
 
     return (
-      <div className="list-group-item col-xlg-6 col-lg-12 wallet-widgets-info" data-edexcoincode="{item.coin}">
-        <div className={this.props.ActiveCoin.coin === item.coin ? 'widget widget-shadow active' : 'widget widget-shadow'}>
-          <div className="widget-content text-center bg-white padding-20 edexcoin-logo" data-edexcoincode="{item.coin}" data-edexcoinmodecode="{item.modecode}" data-edexcoinname="{item.coinname}" onClick={() => this.dashboardChangeActiveCoin(item.coin, item.mode)}>
-            <a className="avatar margin-bottom-5" href="javascript:void(0)" id="edexcoin-logo">
-              <img className="img-responsive" src={'assets/images/cryptologo/' + item.coinlogo + '.png'} alt="{item.coinname}"/>
-              <span className={'badge up badge-' + item.modecolor} id="basfull" data-edexcoincode="{item.coin}" data-toggle="tooltip" data-placement="top" data-original-title="{item.modetip}">{item.modecode}</span>
+      <div className="list-group-item col-xlg-6 col-lg-12 wallet-widgets-info">
+        <div className={ this.props.ActiveCoin.coin === item.coin ? 'widget widget-shadow active' : 'widget widget-shadow' }>
+          <div
+            className="widget-content text-center bg-white padding-20 edexcoin-logo"
+            onClick={ () => this.dashboardChangeActiveCoin(item.coin, item.mode) }>
+            <a className="avatar margin-bottom-5" id="edexcoin-logo">
+              <img
+                className="img-responsive"
+                src={ 'assets/images/cryptologo/' + item.coinlogo + '.png' }
+                alt={ item.coinname }/>
+              <span className={ 'badge up badge-' + item.modecolor } id="basfull">{ item.modecode }</span>
             </a>
-            <div className="coin-name">{item.coinname} ({item.coinlogo.toUpperCase()})</div>
+            <div className="coin-name">{ item.coinname } ({ item.coinlogo.toUpperCase() })</div>
           </div>
         </div>
       </div>
diff --git a/react/src/components/dashboard/dashboard.js b/react/src/components/dashboard/dashboard.js
index 2362f8b..dfd94b8 100644
--- a/react/src/components/dashboard/dashboard.js
+++ b/react/src/components/dashboard/dashboard.js
@@ -29,10 +29,12 @@ class Dashboard extends React.Component {
     document.body.className = '';
 
     return (
-      <div style={{height: '100%'}}>
-        <div className={this.props.Dashboard.activeSection === 'wallets' ? 'page-main' : ''} id="section-dashboard" data-edexcoin="COIN">
+      <div style={{ height: '100%' }}>
+        <div
+          className={ this.props.Dashboard.activeSection === 'wallets' ? 'page-main' : '' }
+          id="section-dashboard">
           <Navbar {...this.props} />
-          <div className={this.props.Dashboard.activeSection === 'wallets' ? 'show' : 'hide'}>
+          <div className={ this.props.Dashboard.activeSection === 'wallets' ? 'show' : 'hide' }>
             <CoinTile {...this.props} />
             <WalletsNav {...this.props} />
             <WalletsProgress {...this.props} />
@@ -44,19 +46,19 @@ class Dashboard extends React.Component {
             <WalletsNative {...this.props} />
             <WalletsNativeTxInfo {...this.props} />
           </div>
-          <div className={this.props.Dashboard.activeSection === 'edex' ? 'show' : 'hide'}>
+          <div className={ this.props.Dashboard.activeSection === 'edex' ? 'show' : 'hide' }>
             <EDEX {...this.props} />
           </div>
-          <div className={this.props.Dashboard.activeSection === 'atomic' ? 'show' : 'hide'}>
+          <div className={ this.props.Dashboard.activeSection === 'atomic' ? 'show' : 'hide' }>
             <Atomic {...this.props} />
           </div>
-          <div className={this.props.Dashboard.activeSection === 'jumblr' ? 'show' : 'hide'}>
+          <div className={ this.props.Dashboard.activeSection === 'jumblr' ? 'show' : 'hide' }>
             <Jumblr {...this.props} />
           </div>
-          <div className={this.props.Dashboard.activeSection === 'settings' ? 'show' : 'hide'}>
+          <div className={ this.props.Dashboard.activeSection === 'settings' ? 'show' : 'hide' }>
             <Settings {...this.props} />
           </div>
-          <div className={this.props.Dashboard.activeSection === 'about' ? 'show' : 'hide'}>
+          <div className={ this.props.Dashboard.activeSection === 'about' ? 'show' : 'hide' }>
             <About {...this.props} />
           </div>
         </div>
@@ -65,7 +67,9 @@ class Dashboard extends React.Component {
   }
 
   render() {
-    if (this.props && this.props.Main && this.props.Main.isLoggedIn) {
+    if (this.props &&
+        this.props.Main &&
+        this.props.Main.isLoggedIn) {
       return this.renderDashboard();
     } else {
       return null;
diff --git a/react/src/components/dashboard/edex.js b/react/src/components/dashboard/edex.js
index 1f966f3..fd2d6e8 100644
--- a/react/src/components/dashboard/edex.js
+++ b/react/src/components/dashboard/edex.js
@@ -4,7 +4,7 @@ import { translate } from '../../translate/translate';
 class EDEX extends React.Component {
   render() {
     return (
-      <div className="page" data-animsition-in="fade-in" data-animsition-out="fade-out" style={{marginLeft: '0px'}}>
+      <div className="page" style={{ marginLeft: '0px' }}>
         <div className="page-content" id="section-easydex">
           <h2>Coming Soon!</h2>
         </div>
diff --git a/react/src/components/dashboard/jumblr.js b/react/src/components/dashboard/jumblr.js
index e2e20db..4f13110 100644
--- a/react/src/components/dashboard/jumblr.js
+++ b/react/src/components/dashboard/jumblr.js
@@ -30,19 +30,19 @@ class Jumblr extends React.Component {
 
   render() {
     return (
-      <div className="page" data-animsition-in="fade-in" data-animsition-out="fade-out" style={{marginLeft: '0'}}>
+      <div className="page" style={{ marginLeft: '0' }}>
         <div className="page-content" id="section-jumblr">
-          <div className="row" id="jumblr_dashboard" data-plugin="masonry">
+          <div className="row" id="jumblr_dashboard">
             <div className="col-xs-12" id="jumblr_testing_alert">
               <div className="alert alert-danger" role="alert">
                 <button type="button" className="close" data-dismiss="alert" aria-label="Close">
                   <span aria-hidden="true">×</span>
                 </button>
-                <span style={{fontSize: '24px', textAlign: 'center'}}>
-                  <i className="icon fa-paw" aria-hidden="true"></i> {translate('JUMBLR.NOTICE')}
+                <span style={{ fontSize: '24px', textAlign: 'center' }}>
+                  <i className="icon fa-paw" aria-hidden="true"></i> { translate('JUMBLR.NOTICE') }
                 </span>
                 <br />
-                {translate('JUMBLR.DESCRIPTION')}
+                { translate('JUMBLR.DESCRIPTION') }
               </div>
             </div>
 
@@ -51,91 +51,119 @@ class Jumblr extends React.Component {
                 <button type="button" className="close" data-dismiss="alert" aria-label="Close">
                   <span aria-hidden="true">×</span>
                 </button>
-                <span style={{fontSize: '24px', textAlign: 'center'}}>
-                  <i className="icon fa-paw" aria-hidden="true"></i> {translate('JUMBLR.NEED_NATIVE')}
+                <span style={{ fontSize: '24px', textAlign: 'center' }}>
+                  <i className="icon fa-paw" aria-hidden="true"></i> { translate('JUMBLR.NEED_NATIVE') }
                 </span>
                 <br />
-                {translate('JUMBLR.TO_USE_JUMBLR')}
+                { translate('JUMBLR.TO_USE_JUMBLR') }
                 <br />
-                {translate('JUMBLR.IF_YOU_ALREADY_RUNNING')}
+                { translate('JUMBLR.IF_YOU_ALREADY_RUNNING') }
               </div>
             </div>
 
             <div className="col-xlg-12 col-md-12">
-              <p>{translate('JUMBLR.THIS_SCREEN_DOESNT_REFRESH')}</p>
+              <p>{ translate('JUMBLR.THIS_SCREEN_DOESNT_REFRESH') }</p>
             </div>
 
             <div className="col-xs-12">
               <div className="panel-group" id="jumber_quick_info" aria-multiselectable="true" role="tablist">
                 <div className="panel">
-                  <div className="panel-heading" id="jumblr_security_notes" role="tab" onClick={() => this.openTab(0)}>
-                    <a className={this.state.activeTab === 0 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#jumber_quick_info" aria-expanded="true" aria-controls="jumblr_security_notes_1">{translate('JUMBLR.FEW_SECURITY_NOTES')}</a>
+                  <div
+                    className="panel-heading"
+                    id="jumblr_security_notes"
+                    role="tab"
+                    onClick={ () => this.openTab(0) }>
+                    <a
+                      className={ this.state.activeTab === 0 ? 'panel-title' : 'panel-title collapsed' }
+                      aria-expanded="true"
+                      aria-controls="jumblr_security_notes_1">{ translate('JUMBLR.FEW_SECURITY_NOTES') }</a>
                   </div>
-                  <div className={this.state.activeTab === 0 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} id="jumblr_security_notes_1" aria-labelledby="jumblr_security_notes" role="tabpanel">
+                  <div
+                    className={ this.state.activeTab === 0 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+                    id="jumblr_security_notes_1"
+                    aria-labelledby="jumblr_security_notes"
+                    role="tabpanel">
                     <div className="panel-body">
                       <ul>
-                        <li>{translate('JUMBLR.FEW_SECURITY_NOTES_DESC1')}</li>
-                        <li>{translate('JUMBLR.FEW_SECURITY_NOTES_DESC2')}</li>
-                        <li>{translate('JUMBLR.FEW_SECURITY_NOTES_DESC3')}</li>
-                        <li>{translate('JUMBLR.FEW_SECURITY_NOTES_DESC4')}</li>
-                        <li>{translate('JUMBLR.FEW_SECURITY_NOTES_DESC5')}</li>
+                        <li>{ translate('JUMBLR.FEW_SECURITY_NOTES_DESC1') }</li>
+                        <li>{ translate('JUMBLR.FEW_SECURITY_NOTES_DESC2') }</li>
+                        <li>{ translate('JUMBLR.FEW_SECURITY_NOTES_DESC3') }</li>
+                        <li>{ translate('JUMBLR.FEW_SECURITY_NOTES_DESC4') }</li>
+                        <li>{ translate('JUMBLR.FEW_SECURITY_NOTES_DESC5') }</li>
                       </ul>
                     </div>
                   </div>
                 </div>
                 <div className="panel">
-                  <div className="panel-heading" id="jumblr_access_funds" role="tab" onClick={() => this.openTab(1)}>
-                    <a className={this.state.activeTab === 1 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#jumber_quick_info" aria-expanded="false" aria-controls="jumblr_access_funds_2">{translate('JUMBLR.ACCESS_JUMBLR_FUNDS')}</a>
+                  <div
+                    className="panel-heading"
+                    id="jumblr_access_funds"
+                    role="tab"
+                    onClick={ () => this.openTab(1) }>
+                    <a
+                      className={ this.state.activeTab === 1 ? 'panel-title' : 'panel-title collapsed' }
+                      aria-expanded="false"
+                      aria-controls="jumblr_access_funds_2">{ translate('JUMBLR.ACCESS_JUMBLR_FUNDS') }</a>
                   </div>
-                  <div className={this.state.activeTab === 1 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} id="jumblr_access_funds_2" aria-labelledby="jumblr_access_funds" role="tabpanel">
+                  <div
+                    className={ this.state.activeTab === 1 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+                    id="jumblr_access_funds_2"
+                    aria-labelledby="jumblr_access_funds"
+                    role="tabpanel">
                     <div className="panel-body">
-                      <p>{translate('JUMBLR.ADDRESS_ACCESSIBLE_EASILY')}</p>
+                      <p>{ translate('JUMBLR.ADDRESS_ACCESSIBLE_EASILY') }</p>
                       <ul>
                         <code>duck dog cat donkey</code>
                       </ul>
                       <ol>
-                        <li>{translate('JUMBLR.TO_ACCESS')}</li>
-                        <li>{translate('JUMBLR.CLOSE_IAPP')}</li>
-                        <li>{translate('JUMBLR.START_IAPP')}</li>
-                        <li>{translate('JUMBLR.START_KMD')}</li>
-                        <li>{translate('JUMBLR.ACCESS_JUMBLR_FUNDS')}
+                        <li>{ translate('JUMBLR.TO_ACCESS') }</li>
+                        <li>{ translate('JUMBLR.CLOSE_IAPP') }</li>
+                        <li>{ translate('JUMBLR.START_IAPP') }</li>
+                        <li>{ translate('JUMBLR.START_KMD') }</li>
+                        <li>{ translate('JUMBLR.ACCESS_JUMBLR_FUNDS') }
                           <ul>
-                            <li>{translate('JUMBLR.SMALL_LETTERS')}</li>
-                            <li>{translate('JUMBLR.WHITE_SPACE')}</li>
+                            <li>{ translate('JUMBLR.SMALL_LETTERS') }</li>
+                            <li>{ translate('JUMBLR.WHITE_SPACE') }</li>
                           </ul>
                         </li>
                         <li>
-                          {translate('JUMBLR.PER_EXAMPLE')}
+                          { translate('JUMBLR.PER_EXAMPLE') }
                           <br />
                           <code>jumblr duck dog cat donkey</code>
                         </li>
-                        <li>{translate('JUMBLR.LOGIN_WITH_JUMBLR')}</li>
+                        <li>{ translate('JUMBLR.LOGIN_WITH_JUMBLR') }</li>
                       </ol>
-                      <h4>{translate('JUMBLR.AGAIN_DONT_SHARE')}</h4>
+                      <h4>{ translate('JUMBLR.AGAIN_DONT_SHARE') }</h4>
                     </div>
                   </div>
                 </div>
                 <div className="panel">
-                  <div className="panel-heading" id="jumblr_using_jumblr" role="tab" onClick={() => this.openTab(2)}>
-                    <a className={this.state.activeTab === 2 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#jumber_quick_info" aria-expanded="false" aria-controls="jumblr_using_jumblr_3">{translate('JUMBLR.USING_JUMBLR')}</a>
+                  <div className="panel-heading" id="jumblr_using_jumblr" role="tab" onClick={ () => this.openTab(2) }>
+                    <a
+                      className={ this.state.activeTab === 2 ? 'panel-title' : 'panel-title collapsed' }
+                      aria-expanded="false"
+                      aria-controls="jumblr_using_jumblr_3">{ translate('JUMBLR.USING_JUMBLR') }</a>
                   </div>
-                  <div className={this.state.activeTab === 2 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} id="jumblr_using_jumblr_3" aria-labelledby="jumblr_using_jumblr"
-                  role="tabpanel">
+                  <div
+                    className={ this.state.activeTab === 2 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+                    id="jumblr_using_jumblr_3"
+                    aria-labelledby="jumblr_using_jumblr"
+                    role="tabpanel">
                     <div className="panel-body">
                       <ul>
-                        <li>{translate('JUMBLR.RUN_KMD')}</li>
-                        <li>{translate('JUMBLR.LOGIN_KMD')}</li>
-                        <li>{translate('JUMBLR.GO_TO')}</li>
-                        <li>{translate('JUMBLR.FIND_DEPOSIT_ADDR')}</li>
-                        <li>{translate('JUMBLR.YOU_SEND_FUNDS')}</li>
-                        <li>{translate('JUMBLR.KEEP_WALLET_OPEN')}</li>
-                        <li>{translate('JUMBLR.IMPORTANT_FUNDS')}</li>
-                        <li>{translate('JUMBLR.LARGE_LOT')}</li>
+                        <li>{ translate('JUMBLR.RUN_KMD') }</li>
+                        <li>{ translate('JUMBLR.LOGIN_KMD') }</li>
+                        <li>{ translate('JUMBLR.GO_TO') }</li>
+                        <li>{ translate('JUMBLR.FIND_DEPOSIT_ADDR') }</li>
+                        <li>{ translate('JUMBLR.YOU_SEND_FUNDS') }</li>
+                        <li>{ translate('JUMBLR.KEEP_WALLET_OPEN') }</li>
+                        <li>{ translate('JUMBLR.IMPORTANT_FUNDS') }</li>
+                        <li>{ translate('JUMBLR.LARGE_LOT') }</li>
                       </ul>
-                      <p>{this.renderLB('JUMBLR.EG')}</p>
-                      <p>{translate('JUMBLR.93_KMD')}</p>
-                      <p>{translate('JUMBLR.TO_CLEAR_THEM')}</p>
-                      <p>{translate('JUMBLR.WHEN_IT_TOTALS')}</p>
+                      <p>{ this.renderLB('JUMBLR.EG') }</p>
+                      <p>{ translate('JUMBLR.93_KMD') }</p>
+                      <p>{ translate('JUMBLR.TO_CLEAR_THEM') }</p>
+                      <p>{ translate('JUMBLR.WHEN_IT_TOTALS') }</p>
                     </div>
                   </div>
                 </div>
@@ -143,13 +171,13 @@ class Jumblr extends React.Component {
             </div>
 
             <div className="col-xlg-12 col-md-12">
-              <h4 className="font-size-14 text-uppercase">{translate('JUMBLR.JADDR')}</h4>
+              <h4 className="font-size-14 text-uppercase">{ translate('JUMBLR.JADDR') }</h4>
               <div className="panel" id="projects">
                 <div className="table-responsive">
                   <table className="table table-striped">
                     <tbody>
                       <tr>
-                        <td width="20%">{translate('JUMBLR.BTC_DEPOSIT')}</td>
+                        <td width="20%">{ translate('JUMBLR.BTC_DEPOSIT') }</td>
                         <td>
                           <span id="jumblr_BTCdeposit"></span>
                         </td>
@@ -157,15 +185,20 @@ class Jumblr extends React.Component {
                       <tr>
                         <td>BTC Jumblr</td>
                         <td>
-                          <button type="button" className="btn btn-animate btn-animate-side btn-default btn-sm waves-effect waves-light jumblr_show_hide_addr_btc_btn" data-jumblr="BTCjumblr">
-                            <span><i className="icon fa-eye" aria-hidden="true"></i> {translate('JUMBLR.SHOW_HIDE')}</span>
+                          <button type="button" className="btn btn-animate btn-animate-side btn-default btn-sm waves-effect waves-light jumblr_show_hide_addr_btc_btn">
+                            <span><i className="icon fa-eye" aria-hidden="true"></i> { translate('JUMBLR.SHOW_HIDE') }</span>
                           </button>
-                          <span className="label label-lg label-outline label-success" id="jumblr_BTCjumblr" style={{display: 'none'}}></span>
-                          <span className="label label-lg label-outline label-default" id="jumblr_BTCjumblr_showhide">{translate('JUMBLR.HIDDEN')}</span>
+                          <span
+                            className="label label-lg label-outline label-success"
+                            id="jumblr_BTCjumblr"
+                            style={{ display: 'none' }}></span>
+                          <span
+                            className="label label-lg label-outline label-default"
+                            id="jumblr_BTCjumblr_showhide">{ translate('JUMBLR.HIDDEN') }</span>
                         </td>
                       </tr>
                       <tr>
-                        <td>{translate('JUMBLR.KMD_DEPOSIT')}</td>
+                        <td>{ translate('JUMBLR.KMD_DEPOSIT') }</td>
                         <td>
                           <span id="jumblr_KMDdeposit"></span>
                         </td>
@@ -173,11 +206,18 @@ class Jumblr extends React.Component {
                       <tr>
                         <td>KMD Jumblr</td>
                         <td>
-                          <button type="button" className="btn btn-animate btn-animate-side btn-default btn-sm waves-effect waves-light jumblr_show_hide_addr_kmd_btn" data-jumblr="KMDjumblr">
-                            <span><i className="icon fa-eye" aria-hidden="true"></i> {translate('JUMBLR.SHOW_HIDE')}</span>
+                          <button type="button" className="btn btn-animate btn-animate-side btn-default btn-sm waves-effect waves-light jumblr_show_hide_addr_kmd_btn">
+                            <span>
+                              <i className="icon fa-eye" aria-hidden="true"></i> { translate('JUMBLR.SHOW_HIDE') }
+                            </span>
                           </button>
-                          <span className="label label-lg label-outline label-success" id="jumblr_KMDjumblr" style={{display: 'none'}}></span>
-                          <span className="label label-lg label-outline label-default" id="jumblr_KMDjumblr_showhide">{translate('JUMBLR.HIDDEN')}</span>
+                          <span
+                            className="label label-lg label-outline label-success"
+                            id="jumblr_KMDjumblr"
+                            style={{ display: 'none' }}></span>
+                          <span
+                            className="label label-lg label-outline label-default"
+                            id="jumblr_KMDjumblr_showhide">{ translate('JUMBLR.HIDDEN') }</span>
                         </td>
                       </tr>
                     </tbody>
@@ -187,49 +227,49 @@ class Jumblr extends React.Component {
             </div>
 
             <div className="col-xlg-12 col-md-12">
-              <h4 className="font-size-14 text-uppercase">{translate('JUMBLR.JSTATUS')}</h4>
+              <h4 className="font-size-14 text-uppercase">{ translate('JUMBLR.JSTATUS') }</h4>
               <div className="panel" id="projects">
                 <div className="table-responsive">
                   <table className="table table-striped">
                     <tbody>
                       <tr>
-                        <td width="20%">{translate('JUMBLR.RESULT')}</td>
+                        <td width="20%">{ translate('JUMBLR.RESULT') }</td>
                         <td>
                           <span id="jumblr_status_result" className="label label-success"></span>
                         </td>
                       </tr>
                       <tr>
-                        <td>{translate('JUMBLR.DEPOSITED')}</td>
+                        <td>{ translate('JUMBLR.DEPOSITED') }</td>
                         <td>
                           <span id="jumblr_status_deposited"></span>
                         </td>
                       </tr>
                       <tr>
-                        <td>{translate('JUMBLR.PUB_TO_PRIV')}</td>
+                        <td>{ translate('JUMBLR.PUB_TO_PRIV') }</td>
                         <td>
                           <span id="jumblr_status_t_to_z"></span>
                         </td>
                       </tr>
                       <tr>
-                        <td>{translate('JUMBLR.PRIV_TO_PRIV')}</td>
+                        <td>{ translate('JUMBLR.PRIV_TO_PRIV') }</td>
                         <td>
                           <span id="jumblr_status_z_to_z"></span>
                         </td>
                       </tr>
                       <tr>
-                        <td>{translate('JUMBLR.PRIV_TO_PUB')}</td>
+                        <td>{ translate('JUMBLR.PRIV_TO_PUB') }</td>
                         <td>
                           <span id="jumblr_status_z_to_t"></span>
                         </td>
                       </tr>
                       <tr>
-                        <td>{translate('JUMBLR.FINISHED')}</td>
+                        <td>{ translate('JUMBLR.FINISHED') }</td>
                         <td>
                           <span id="jumblr_status_finished"></span>
                         </td>
                       </tr>
                       <tr>
-                        <td>{translate('JUMBLR.PENDING')}</td>
+                        <td>{ translate('JUMBLR.PENDING') }</td>
                         <td>
                           <span id="jumblr_status_pending"></span>
                         </td>
diff --git a/react/src/components/dashboard/loginModal.js b/react/src/components/dashboard/loginModal.js
index 0ea5629..95ed2d1 100644
--- a/react/src/components/dashboard/loginModal.js
+++ b/react/src/components/dashboard/loginModal.js
@@ -48,35 +48,56 @@ class LoginModal extends React.Component {
     if (this.props.Dashboard.activateLoginModal) {
       return (
         <div>
-          <div className={'modal modal-3d-sign add-coin-modal ' + (this.state.display ? 'show in' : 'fade hide')} id="AddCoinDilogModel-login" aria-hidden="true" aria-labelledby="AddCoinDilogModel-login" role="dialog" tabIndex="-1">
+          <div
+            className={ 'modal modal-3d-sign add-coin-modal ' + (this.state.display ? 'show in' : 'fade hide') }
+            id="AddCoinDilogModel-login"
+            aria-hidden="true"
+            aria-labelledby="AddCoinDilogModel-login"
+            role="dialog"
+            tabIndex="-1">
             <div className="modal-dialog modal-center modal-lg">
               <div className="modal-content">
                 <div className="modal-header bg-orange-a400 wallet-send-header">
-                  <button type="button" className="close white" data-dismiss="modal" aria-label="Close" onClick={this.dismiss}>
+                  <button
+                    type="button"
+                    className="close white"
+                    aria-label="Close"
+                    onClick={ this.dismiss }>
                     <span aria-hidden="true">×</span>
                   </button>
-                  <h4 className="modal-title white">{translate('INDEX.SELECT_A_COIN')}</h4>
+                  <h4 className="modal-title white">{ translate('INDEX.SELECT_A_COIN') }</h4>
                 </div>
                 <div className="modal-body">
                   <div id="wallet-login">
-                    <div className="page animsition vertical-align text-center fade-in" data-animsition-in="fade-in" data-animsition-out="fade-out">
+                    <div className="page animsition vertical-align text-center fade-in">
                       <div className="page-content vertical-align-middle">
                         <div className="brand">
                           <img className="brand-img" src="assets/images/easydex-logo-big.png" alt="SuperNET Iguana" />
                         </div>
 
-                        <div id="section-login" className={this.state.activeLoginSection === 'login' ? 'show' : 'hide'}>
-                          <h4 style={{ color: '#fff' }} id="login-welcome">{translate('INDEX.WELCOME_LOGIN')}</h4>
+                        <div id="section-login" className={ this.state.activeLoginSection === 'login' ? 'show' : 'hide' }>
+                          <h4 style={{ color: '#fff' }} id="login-welcome">{ translate('INDEX.WELCOME_LOGIN') }</h4>
                           <div className="login-form">
                             <div className="form-group form-material floating">
-                              <input type={this.state.seedInputVisibility ? 'text' : 'password'} className="form-control" name="loginPassphrase" id="password" onChange={this.updateInput} />
-                              <i className={this.state.seedInputVisibility ? 'seed-toggle fa fa-eye-slash' : 'seed-toggle fa fa-eye'} onClick={this.toggleSeedInputVisibility}></i>
+                              <input
+                                type={ this.state.seedInputVisibility ? 'text' : 'password' }
+                                className="form-control"
+                                name="loginPassphrase"
+                                id="password"
+                                onChange={ this.updateInput } />
+                              <i
+                                className={ this.state.seedInputVisibility ? 'seed-toggle fa fa-eye-slash' : 'seed-toggle fa fa-eye' }
+                                onClick={ this.toggleSeedInputVisibility }></i>
                               <label className="floating-label" htmlFor="inputPassword">{translate('INDEX.WALLET_SEED')}</label>
                             </div>
-                            <button type="button" className="btn btn-primary btn-block" id="loginbtn" onClick={this.loginSeed} disabled={!this.state.loginPassphrase || !this.state.loginPassphrase.length}>{translate('INDEX.SIGN_IN')}</button>
+                            <button
+                              type="button"
+                              className="btn btn-primary btn-block"
+                              id="loginbtn"
+                              onClick={ this.loginSeed }
+                              disabled={ !this.state.loginPassphrase || !this.state.loginPassphrase.length }>{ translate('INDEX.SIGN_IN') }</button>
                           </div>
                         </div>
-
                       </div>
                     </div>
                   </div>
diff --git a/react/src/components/dashboard/navbar.js b/react/src/components/dashboard/navbar.js
index 736031c..6325250 100644
--- a/react/src/components/dashboard/navbar.js
+++ b/react/src/components/dashboard/navbar.js
@@ -43,19 +43,24 @@ class Navbar extends React.Component {
       <nav className="site-navbar navbar navbar-default navbar-fixed-top navbar-mega" role="navigation">
         <div className="navbar-header">
           <button type="button" className="navbar-toggle hamburger hamburger-close navbar-toggle-left hided">
-            <span className="sr-only">{translate('INDEX.TOGGLE_NAV')}</span>
+            <span className="sr-only">{ translate('INDEX.TOGGLE_NAV') }</span>
             <span className="hamburger-bar"></span>
           </button>
           <button type="button" className="navbar-toggle collapsed">
             <i className="icon md-more" aria-hidden="true"></i>
           </button>
           <div className="navbar-brand navbar-brand-center site-gridmenu-toggle" data-toggle="gridmenu">
-            <img className="navbar-brand-logo hidden-xs" src="assets/images/easydex-logo-dashboard.png" title="SuperNET Igauana" />
-            <img className="navbar-brand-logo hidden-md hidden-sm hidden-lg" src="assets/images/easydex-logo-dashboard-white.png" title="SuperNET Igauana white" />
+            <img
+              className="navbar-brand-logo hidden-xs" src="assets/images/easydex-logo-dashboard.png"
+              title="SuperNET Iguana" />
+            <img
+              className="navbar-brand-logo hidden-md hidden-sm hidden-lg"
+              src="assets/images/easydex-logo-dashboard-white.png"
+              title="SuperNET Iguana white" />
             <span className="navbar-brand-text hidden-xs"></span>
           </div>
           <button type="button" className="navbar-toggle collapsed">
-            <span className="sr-only">{translate('INDEX.TOGGLE_SEARCH')}</span>
+            <span className="sr-only">{ translate('INDEX.TOGGLE_SEARCH') }</span>
             <i className="icon md-search" aria-hidden="true"></i>
           </button>
         </div>
@@ -63,45 +68,48 @@ class Navbar extends React.Component {
           <div className="collapse navbar-collapse navbar-collapse-toolbar" id="site-navbar-collapse">
             <ul className="nav navbar-toolbar">
               <li className="hidden-float" id="toggleMenubar" style={{ display: 'none' }}>
-                <a data-toggle="menubar" href="#" role="button">
+                <a role="button">
                   <i className="icon hamburger hamburger-arrow-left">
-                    <span className="sr-only">{translate('INDEX.TOGGLE_MENUBAR')}</span>
+                    <span className="sr-only">{ translate('INDEX.TOGGLE_MENUBAR') }</span>
                     <span className="hamburger-bar"></span>
                   </i>
                 </a>
               </li>
-              <li className={this.props.Dashboard.activeSection === 'wallets' ? 'active nav-top-menu' : 'nav-top-menu'}>
-                <a href="javascript:void(0)" id="nav-dashboard" onClick={() => this.dashboardChangeSection('wallets')}>
-                  <i className="site-menu-icon" aria-hidden="true"></i> {translate('INDEX.WALLETS')}
+              <li className={ this.props.Dashboard.activeSection === 'wallets' ? 'active nav-top-menu' : 'nav-top-menu' }>
+                <a id="nav-dashboard" onClick={ () => this.dashboardChangeSection('wallets') }>
+                  <i className="site-menu-icon" aria-hidden="true"></i> { translate('INDEX.WALLETS') }
                 </a>
               </li>
-              <li className={this.props.Dashboard.activeSection === 'edex' ? 'active nav-top-menu' : 'nav-top-menu'}>
-                <a href="javascript:void(0)" id="nav-easydex" onClick={() => this.dashboardChangeSection('edex')}>
+              <li className={ this.props.Dashboard.activeSection === 'edex' ? 'active nav-top-menu' : 'nav-top-menu' }>
+                <a id="nav-easydex" onClick={ () => this.dashboardChangeSection('edex') }>
                   <i className="site-menu-icon" aria-hidden="true"></i> EasyDEX
                 </a>
               </li>
-              <li className={this.props.Dashboard.activeSection === 'jumblr' ? 'active nav-top-menu' : 'nav-top-menu'} style={{display: 'none'}}>
-                <a href="javascript:void(0)" id="nav-jumblr" onClick={() => this.dashboardChangeSection('jumblr')}>
+              <li className={ this.props.Dashboard.activeSection === 'jumblr' ? 'active nav-top-menu' : 'nav-top-menu' } style={{ display: 'none' }}>
+                <a id="nav-jumblr" onClick={ () => this.dashboardChangeSection('jumblr') }>
                   <i className="site-menu-icon" aria-hidden="true"></i> Jumblr
                 </a>
               </li>
-              <li className={this.props.Dashboard.activeSection === 'atomic' ? 'active nav-top-menu' : 'nav-top-menu'}>
-                <a id="nav-iguana-atomic-explorer" onClick={() => this.dashboardChangeSection('atomic')}>
+              <li className={ this.props.Dashboard.activeSection === 'atomic' ? 'active nav-top-menu' : 'nav-top-menu' }>
+                <a id="nav-iguana-atomic-explorer" onClick={ () => this.dashboardChangeSection('atomic') }>
                   <i className="site-menu-icon" aria-hidden="true"></i> Atomic Explorer
                 </a>
               </li>
             </ul>
             <ul className="nav navbar-toolbar navbar-right navbar-toolbar-right">
               <li role="presentation">
-                <a href="javascript:void(0)" role="menuitem" id="btn_edexcoin_addcoin" data-toggle="modal" style={{ paddingBottom: '10px', paddingTop: '16px' }} onClick={this.toggleAddCoinModal}>
+                <a
+                  role="menuitem"
+                  id="btn_edexcoin_addcoin"
+                  style={{ paddingBottom: '10px', paddingTop: '16px' }}
+                  onClick={ this.toggleAddCoinModal }>
                   <span>
-                    <img src="assets/images/icons/activatecoin.png" alt="Add Coin" />
+                    <img src="assets/images/icons/activatecoin.png" alt={ translate('INDEX.ADD_COIN') } />
                   </span>
                 </a>
               </li>
-              <li className={'dropdown' + (this.state.openDropMenu ? ' open' : '')} onClick={this.openDropMenu}>
-                <a className="navbar-avatar dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false"
-                data-animation="scale-up" role="button">
+              <li className={ 'dropdown' + (this.state.openDropMenu ? ' open' : '') } onClick={ this.openDropMenu }>
+                <a className="navbar-avatar dropdown-toggle" aria-expanded="false" role="button">
                   <span className="avatar avatar-online">
                     <img src="assets/images/iguana_profile_02.jpg" alt="iguana profile pic" />
                     <i></i>
@@ -109,19 +117,25 @@ class Navbar extends React.Component {
                 </a>
                 <ul className="dropdown-menu" role="menu">
                   <li role="presentation">
-                    <a href="javascript:void(0)" role="menuitem" id="nav-iguana-wallet-settings" onClick={() => this.dashboardChangeSection('settings')}>
-                      <i className="icon md-settings" aria-hidden="true"></i> {translate('INDEX.SETTINGS')}
+                    <a
+                      role="menuitem"
+                      id="nav-iguana-wallet-settings"
+                      onClick={ () => this.dashboardChangeSection('settings') }>
+                      <i className="icon md-settings" aria-hidden="true"></i> { translate('INDEX.SETTINGS') }
                     </a>
                   </li>
                   <li role="presentation">
-                    <a href="javascript:void(0)" role="menuitem" id="nav-about-iguana" onClick={() => this.dashboardChangeSection('about')}>
-                      <i className="icon fa-users" aria-hidden="true"></i> {translate('INDEX.ABOUT_IGUANA')}
+                    <a
+                      role="menuitem"
+                      id="nav-about-iguana"
+                      onClick={ () => this.dashboardChangeSection('about') }>
+                      <i className="icon fa-users" aria-hidden="true"></i> { translate('INDEX.ABOUT_IGUANA') }
                     </a>
                   </li>
                   <li className="divider" role="presentation"></li>
                   <li role="presentation">
-                    <a href="javascript:void(0)" role="menuitem" id="logout-account" onClick={this.logout}>
-                      <i className="icon md-power" aria-hidden="true"></i> {translate('INDEX.LOGOUT')}
+                    <a role="menuitem" id="logout-account" onClick={ this.logout }>
+                      <i className="icon md-power" aria-hidden="true"></i> { translate('INDEX.LOGOUT') }
                     </a>
                   </li>
                 </ul>
diff --git a/react/src/components/dashboard/receiveCoin.js b/react/src/components/dashboard/receiveCoin.js
index 843f4ee..df40154 100644
--- a/react/src/components/dashboard/receiveCoin.js
+++ b/react/src/components/dashboard/receiveCoin.js
@@ -33,13 +33,22 @@ class ReceiveCoin extends React.Component {
       return (
         <td>
           <span className="label label-default">
-            <i className="icon fa-eye"></i> {translate('IAPI.PUBLIC_SM')}
+            <i className="icon fa-eye"></i> { translate('IAPI.PUBLIC_SM') }
           </span>
-          <button className="btn btn-default btn-xs clipboard-edexaddr margin-left-10" data-edexcoin="COIN" id="edexcoin_active_addr_clipboard" onClick={() => this._copyCoinAddress(address)}><i className="icon wb-copy" aria-hidden="true"></i> {translate('INDEX.COPY')}</button>
-          <span className="label label-default margin-left-10 action" title="Check" onClick={() => this._checkAddressBasilisk(address)}>
+          <button
+            className="btn btn-default btn-xs clipboard-edexaddr margin-left-10"
+            id="edexcoin_active_addr_clipboard"
+            onClick={ () => this._copyCoinAddress(address) }><i className="icon wb-copy" aria-hidden="true"></i> { translate('INDEX.COPY') }</button>
+          <span
+            className="label label-default margin-left-10 action"
+            title="Check"
+            onClick={ () => this._checkAddressBasilisk(address) }>
             <i className="icon fa-database"></i>
           </span>
-          <span className="label label-default margin-left-10 action" title="Import" onClick={() => this._validateAddressBasilisk(address)}>
+          <span
+            className="label label-default margin-left-10 action"
+            title="Import"
+            onClick={ () => this._validateAddressBasilisk(address) }>
             <i className="icon fa-info-circle"></i>
           </span>
         </td>
@@ -48,9 +57,12 @@ class ReceiveCoin extends React.Component {
       return (
         <td>
           <span className="label label-default">
-            <i className="icon fa-eye"></i> {translate('IAPI.PUBLIC_SM')}
+            <i className="icon fa-eye"></i> { translate('IAPI.PUBLIC_SM') }
           </span>
-          <button className="btn btn-default btn-xs clipboard-edexaddr margin-left-10" data-edexcoin="COIN" id="edexcoin_active_addr_clipboard" onClick={() => this._copyCoinAddress(address)}><i className="icon wb-copy" aria-hidden="true"></i> {translate('INDEX.COPY')}</button>
+          <button
+            className="btn btn-default btn-xs clipboard-edexaddr margin-left-10"
+            id="edexcoin_active_addr_clipboard"
+            onClick={ () => this._copyCoinAddress(address) }><i className="icon wb-copy" aria-hidden="true"></i> { translate('INDEX.COPY') }</button>
         </td>
       );
     }
@@ -65,19 +77,21 @@ class ReceiveCoin extends React.Component {
       for (let i = 0; i < this.props.addresses.public.length; i++) {
         let address = this.props.addresses.public[i];
 
-        if (this.props.mode === 'basilisk' && address.amount === 'N/A') {
+        if (this.props.mode === 'basilisk' &&
+            address.amount === 'N/A') {
           address.amount = this.props.cache && this.props.cache[this.props.coin][address.address] && this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.balance ? this.props.cache[this.props.coin][address.address].getbalance.data.balance : 'N/A';
         }
-        if (this.props.mode === 'basilisk' && (address.interest === 'N/A' || !address.interest)) {
+        if (this.props.mode === 'basilisk' &&
+            (address.interest === 'N/A' || !address.interest)) {
           address.interest = this.props.cache && this.props.cache[this.props.coin][address.address] && this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.interest ? this.props.cache[this.props.coin][address.address].getbalance.data.interest : 'N/A';
         }
 
         items.push(
-          <tr key={address.address}>
-            {this.renderAddressActions(address.address)}
-            <td>{address.address}</td>
-            <td>{address.amount}</td>
-            <td>{address.interest ? address.interest : 'N/A'}</td>
+          <tr key={ address.address }>
+            { this.renderAddressActions(address.address) }
+            <td>{ address.address }</td>
+            <td>{ address.amount }</td>
+            <td>{ address.interest ? address.interest : 'N/A' }</td>
           </tr>
         );
       }
@@ -89,38 +103,40 @@ class ReceiveCoin extends React.Component {
   }
 
   render() {
-    if (this.props && this.props.receive && this.props.mode !== 'native') {
+    if (this.props &&
+        this.props.receive &&
+        this.props.mode !== 'native') {
       return (
-        <div data-edexcoin="COIN" id="edexcoin_recieve">
+        <div id="edexcoin_recieve">
           <div className="col-xs-12 margin-top-20">
             <div className="panel nav-tabs-horizontal">
-              <div data-edexcoin="COIN" id="edexcoin_recieve_section">
+              <div id="edexcoin_recieve_section">
                 <div className="col-xlg-12 col-lg-12 col-sm-12 col-xs-12">
                   <div className="panel">
                     <header className="panel-heading">
                       <div className="panel-actions">
                       </div>
-                      <h4 className="panel-title">{translate('INDEX.RECEIVING_ADDRESS')}</h4>
+                      <h4 className="panel-title">{ translate('INDEX.RECEIVING_ADDRESS') }</h4>
                     </header>
                     <div className="panel-body">
-                      <table className="table table-hover dataTable table-striped" data-edexcoin="COIN" id="edexcoin-recieve-addr-tbl">
+                      <table className="table table-hover dataTable table-striped" id="edexcoin-recieve-addr-tbl">
                         <thead>
                           <tr>
-                            <th>{translate('INDEX.TYPE')}</th>
-                            <th>{translate('INDEX.ADDRESS')}</th>
-                            <th>{translate('INDEX.BALANCE')}</th>
-                            <th>{translate('INDEX.INTEREST')}</th>
+                            <th>{ translate('INDEX.TYPE') }</th>
+                            <th>{ translate('INDEX.ADDRESS') }</th>
+                            <th>{ translate('INDEX.BALANCE') }</th>
+                            <th>{ translate('INDEX.INTEREST') }</th>
                           </tr>
                         </thead>
                         <tbody>
-                          {this.renderAddressList()}
+                          { this.renderAddressList() }
                         </tbody>
                         <tfoot>
                           <tr>
-                            <th>{translate('INDEX.TYPE')}</th>
-                            <th>{translate('INDEX.ADDRESS')}</th>
-                            <th>{translate('INDEX.BALANCE')}</th>
-                            <th>{translate('INDEX.INTEREST')}</th>
+                            <th>{ translate('INDEX.TYPE') }</th>
+                            <th>{ translate('INDEX.ADDRESS') }</th>
+                            <th>{ translate('INDEX.BALANCE') }</th>
+                            <th>{ translate('INDEX.INTEREST') }</th>
                           </tr>
                         </tfoot>
                       </table>
diff --git a/react/src/components/dashboard/sendCoin.js b/react/src/components/dashboard/sendCoin.js
index 3defd3e..1e5911a 100644
--- a/react/src/components/dashboard/sendCoin.js
+++ b/react/src/components/dashboard/sendCoin.js
@@ -154,7 +154,7 @@ class SendCoin extends React.Component {
             style={{ marginTop: '10px' }}
             className={ isReadyToUpdate ? 'btn btn-primary waves-effect waves-light' : 'hide' }
             onClick={ this._fetchNewUTXOData } disabled={ waitUntilCallIsFinished }>
-            {waitUntilCallIsFinished ? translate('SEND.LOCKED_PLEASE_WAIT') + '...' : translate('SEND.UPDATE')}
+            { waitUntilCallIsFinished ? translate('SEND.LOCKED_PLEASE_WAIT') + '...' : translate('SEND.UPDATE') }
           </button>
         </div>
       );
@@ -249,7 +249,7 @@ class SendCoin extends React.Component {
 
       return (
         <span>
-          <i className={this.state.addressType === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash'}></i>  <span className="text">[ { _amount } {this.props.ActiveCoin.coin} ]  {this.state.sendFrom}</span>
+          <i className={ this.state.addressType === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash' }></i>  <span className="text">[ { _amount } { this.props.ActiveCoin.coin } ]  { this.state.sendFrom }</span>
         </span>
       );
     } else if (this.state.sendApiType) {
@@ -258,28 +258,36 @@ class SendCoin extends React.Component {
 
       return (
         <span>
-          <i className={this.state.addressType === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash'}></i>  <span className="text">[ {mainAddressAmount} {this.props.ActiveCoin.coin} ]  {mainAddress}</span>
+          <i className={ this.state.addressType === 'public' ? 'icon fa-eye' : 'icon fa-eye-slash' }></i>  <span className="text">[ { mainAddressAmount } { this.props.ActiveCoin.coin } ]  { mainAddress }</span>
         </span>
       );
     } else {
       return (
-        <span>- Select Transparent or Private Address -</span>
+        <span>- { translate('SEND.SELECT_T_OR_Z_ADDR') } -</span>
       );
     }
   }
 
   renderAddressList() {
     return (
-      <div className={'btn-group bootstrap-select form-control form-material showkmdwalletaddrs show-tick ' + (this.state.addressSelectorOpen ? 'open' : '')}>
-        <button type="button" className="btn dropdown-toggle btn-info" data-toggle="dropdown" data-id="kmd_wallet_send_from" title="- Select Transparent or Private Address -" aria-expanded="true" onClick={this.openDropMenu}>
-          <span className="filter-option pull-left">{this.renderSelectorCurrentLabel()} </span>&nbsp;<span className="bs-caret"><span className="caret"></span></span>
+      <div className={ 'btn-group bootstrap-select form-control form-material showkmdwalletaddrs show-tick ' + (this.state.addressSelectorOpen ? 'open' : '') }>
+        <button
+          type="button"
+          className="btn dropdown-toggle btn-info"
+          title={ '-' + translate('SEND.SELECT_T_OR_Z_ADDR') + '-' }
+          aria-expanded="true"
+          onClick={ this.openDropMenu }>
+          <span className="filter-option pull-left">{ this.renderSelectorCurrentLabel() } </span>&nbsp;
+          <span className="bs-caret">
+            <span className="caret"></span>
+          </span>
         </button>
         <div className="dropdown-menu open">
           <ul className="dropdown-menu inner" role="menu">
             <li className="selected">
-              <a tabIndex="0"><span className="text"> - Select Transparent or Private Address - </span><span className="glyphicon glyphicon-ok check-mark"></span></a>
+              <a tabIndex="0"><span className="text"> - { translate('SEND.SELECT_T_OR_Z_ADDR') } - </span><span className="glyphicon glyphicon-ok check-mark"></span></a>
             </li>
-            {this.renderAddressByType('public')}
+            { this.renderAddressByType('public') }
           </ul>
         </div>
       </div>
@@ -386,7 +394,8 @@ class SendCoin extends React.Component {
     .then(function(json) {
       console.log('sendData', sendData);
       console.log('iguanaUTXORawTXJSON', json);
-      if (json.result === 'success' && json.completed === true) {
+      if (json.result === 'success' &&
+          json.completed === true) {
         Store.dispatch(triggerToaster(true, translate('TOASTR.SIGNED_TX_GENERATED') + '.', translate('TOASTR.WALLET_NOTIFICATION'), 'success'));
 
         if (sendData.sendsig === 1) {
@@ -457,7 +466,7 @@ class SendCoin extends React.Component {
                     console.log(result);
                     resolve(result);
                     forceUpdateCache();
-                    Store.dispatch(triggerToaster(true, 'Local UTXO data is updated. Ready to send new transaction.', translate('TOASTR.WALLET_NOTIFICATION'), 'info'));
+                    Store.dispatch(triggerToaster(true, translate('TOASTR.LOCAL_UTXO_UPDATED'), translate('TOASTR.WALLET_NOTIFICATION'), 'info'));
 
                     this.setState(Object.assign({}, this.state, {
                       utxoMethodInProgress: false,
@@ -466,10 +475,10 @@ class SendCoin extends React.Component {
                 }.bind(this));
               }.bind(this);
 
-              Store.dispatch(triggerToaster(true, 'Awaiting transaction data response...', translate('TOASTR.WALLET_NOTIFICATION'), 'info'));
+              Store.dispatch(triggerToaster(true, translate('TOASTR.AWAITING_TX_RESP') + '...', translate('TOASTR.WALLET_NOTIFICATION'), 'info'));
 
               function waterfallUTXOProcess() {
-                Store.dispatch(triggerToaster(true, 'Processing UTXO...', translate('TOASTR.WALLET_NOTIFICATION'), 'info'));
+                Store.dispatch(triggerToaster(true, translate('TOASTR.PROCESSING_UTXO') + '...', translate('TOASTR.WALLET_NOTIFICATION'), 'info'));
 
                 getTxidData()
                 .then(function(gettxdata) {
@@ -544,14 +553,17 @@ class SendCoin extends React.Component {
     } else if (key === 'rawtx') {
       return this.renderSignedTx(true);
     } else if (key === 'complete' || key === 'completed' || key === 'result') {
-      if (this.props.ActiveCoin.lastSendToResponse[key] === true || this.props.ActiveCoin.lastSendToResponse[key] === 'success') {
+      if (this.props.ActiveCoin.lastSendToResponse[key] === true ||
+          this.props.ActiveCoin.lastSendToResponse[key] === 'success') {
         return (
-          <span className="label label-success">{this.props.ActiveCoin.lastSendToResponse[key] === true ? 'true' : 'success'}</span>
+          <span className="label label-success">{ this.props.ActiveCoin.lastSendToResponse[key] === true ? 'true' : 'success' }</span>
         );
       } else {
-        if (key === 'result' && this.props.ActiveCoin.lastSendToResponse.result && typeof this.props.ActiveCoin.lastSendToResponse.result !== 'object') {
+        if (key === 'result' &&
+          this.props.ActiveCoin.lastSendToResponse.result &&
+          typeof this.props.ActiveCoin.lastSendToResponse.result !== 'object') {
           return (
-            <span>{this.props.ActiveCoin.lastSendToResponse.result}</span>
+            <span>{ this.props.ActiveCoin.lastSendToResponse.result }</span>
           );
         } else {
           return (
@@ -562,11 +574,11 @@ class SendCoin extends React.Component {
     } else if (key === 'error') {
       if (Object.keys(this.props.ActiveCoin.lastSendToResponse[key]).length) {
         return (
-          <span>{JSON.stringify(this.props.ActiveCoin.lastSendToResponse[key], null, '\t')}</span>
+          <span>{ JSON.stringify(this.props.ActiveCoin.lastSendToResponse[key], null, '\t') }</span>
         );
       } else {
         return (
-          <span className="label label-danger">{this.props.ActiveCoin.lastSendToResponse[key]}</span>
+          <span className="label label-danger">{ this.props.ActiveCoin.lastSendToResponse[key] }</span>
         );
       }
     } else if (key === 'sendrawtransaction') {
@@ -581,7 +593,7 @@ class SendCoin extends React.Component {
       }
     } else if (key === 'txid' || key === 'sent') {
       return (
-        <span>{this.props.ActiveCoin.lastSendToResponse[key]}</span>
+        <span>{ this.props.ActiveCoin.lastSendToResponse[key] }</span>
       );
     } else if (key === 'tag') {
       return null;
@@ -596,9 +608,9 @@ class SendCoin extends React.Component {
       for (let key in _response) {
         if (key !== 'tag') {
           items.push(
-            <tr key={key}>
-              <td>{key}</td>
-              <td>{this.renderKey(key)}</td>
+            <tr key={ key }>
+              <td>{ key }</td>
+              <td>{ this.renderKey(key) }</td>
             </tr>
           );
         }
@@ -607,10 +619,10 @@ class SendCoin extends React.Component {
       return items;
     } else {
       return (
-        <div style={{padding: '20px', textAlign: 'center'}}>
-          <div style={{padding: '10px 0'}}>
-            Processing transaction...<br />
-            Note: it may take a few minutes to complete the transaction.
+        <div style={{ padding: '20px', textAlign: 'center' }}>
+          <div style={{ padding: '10px 0' }}>
+            { translate('SEND.PROCESSING_TRANSACTION') }...<br />
+            { translate('SEND.NOTE_IT_WILL_TAKE') }.
           </div>
           <div className="loader-wrapper active">
             <div className="loader-layer loader-blue">
@@ -687,11 +699,25 @@ class SendCoin extends React.Component {
       return (
         <div className="row">
           <div className="col-lg-6 form-group form-material">
-            <label className="control-label" htmlFor="kmd_wallet_sendto">Fetch OpenAlias recipient address</label>
-            <input type="text" className="form-control" name="sendToOA" onChange={this.updateInput} id="kmd_wallet_sendto" placeholder="Enter an alias as address@site.com" autoComplete="off" required />
+            <label
+              className="control-label"
+              htmlFor="kmd_wallet_sendto">Fetch OpenAlias recipient address</label>
+            <input
+              type="text"
+              className="form-control"
+              name="sendToOA"
+              onChange={ this.updateInput }
+              id="kmd_wallet_sendto"
+              placeholder="Enter an alias as address@site.com"
+              autoComplete="off"
+              required />
           </div>
           <div className="col-lg-6 form-group form-material">
-            <button type="button" className="btn btn-primary waves-effect waves-light" id="kmd_wallet_send_coins_btn" onClick={this.getOAdress}>
+            <button
+              type="button"
+              className="btn btn-primary waves-effect waves-light"
+              id="kmd_wallet_send_coins_btn"
+              onClick={ this.getOAdress }>
               Get address
             </button>
           </div>
@@ -710,7 +736,10 @@ class SendCoin extends React.Component {
             <div className="pull-left margin-right-10">
               <input type="checkbox" id="edexcoin_send_api_type" />
             </div>
-            <label className="padding-top-3" htmlFor="edexcoin_send_api_type" onClick={this.toggleSendAPIType}>Send via sendtoaddress API</label>
+            <label
+              className="padding-top-3"
+              htmlFor="edexcoin_send_api_type"
+              onClick={ this.toggleSendAPIType }>{ translate('SEND.SEND_VIA') } sendtoaddress API</label>
           </div>
         </div>
       );
@@ -720,80 +749,119 @@ class SendCoin extends React.Component {
   }
 
   render() {
-    if (this.props.ActiveCoin && this.props.ActiveCoin.send && this.props.ActiveCoin.mode !== 'native') {
+    if (this.props.ActiveCoin &&
+        this.props.ActiveCoin.send &&
+        this.props.ActiveCoin.mode !== 'native') {
       return (
         <div className="col-sm-12 padding-top-10" id="edexcoin_send">
           <div className="col-xlg-12 col-md-12 col-sm-12 col-xs-12">
-            <div className="steps row" style={{marginTop: '10px'}}>
-              <div className={this.state.currentStep === 0 ? 'step col-md-4 current' : 'step col-md-4'} id="edexcoin_send_step_1">
+            <div className="steps row" style={{ marginTop: '10px' }}>
+              <div
+                className={ this.state.currentStep === 0 ? 'step col-md-4 current' : 'step col-md-4' }
+                id="edexcoin_send_step_1">
                 <span className="step-number">1</span>
                 <div className="step-desc">
-                  <span className="step-title">{translate('INDEX.FILL_SEND_FORM')}</span>
-                  <p>{translate('INDEX.FILL_SEND_DETAILS')}</p>
+                  <span className="step-title">{ translate('INDEX.FILL_SEND_FORM') }</span>
+                  <p>{ translate('INDEX.FILL_SEND_DETAILS') }</p>
                 </div>
               </div>
-              <div className={this.state.currentStep === 1 ? 'step col-md-4 current' : 'step col-md-4'} id="edexcoin_send_step_2">
+              <div
+                className={ this.state.currentStep === 1 ? 'step col-md-4 current' : 'step col-md-4' }
+                id="edexcoin_send_step_2">
                 <span className="step-number">2</span>
                 <div className="step-desc">
-                  <span className="step-title">{translate('INDEX.CONFIRMING')}</span>
-                  <p>{translate('INDEX.CONFIRM_DETAILS')}</p>
+                  <span className="step-title">{ translate('INDEX.CONFIRMING') }</span>
+                  <p>{ translate('INDEX.CONFIRM_DETAILS') }</p>
                 </div>
               </div>
-              <div className={this.state.currentStep === 2 ? 'step col-md-4 current' : 'step col-md-4'} id="edexcoin_send_step_3">
+              <div
+                className={ this.state.currentStep === 2 ? 'step col-md-4 current' : 'step col-md-4' }
+                id="edexcoin_send_step_3">
                 <span className="step-number">3</span>
                 <div className="step-desc">
-                  <span className="step-title">{translate('INDEX.PROCESSING_TX')}</span>
-                  <p>{translate('INDEX.PROCESSING_DETAILS')}</p>
+                  <span className="step-title">{ translate('INDEX.PROCESSING_TX') }</span>
+                  <p>{ translate('INDEX.PROCESSING_DETAILS') }</p>
                 </div>
               </div>
             </div>
 
-            <div className={this.state.currentStep === 0 ? 'panel' : 'panel hide'} id="edexcoin-send-screen">
+            <div className={ this.state.currentStep === 0 ? 'panel' : 'panel hide' } id="edexcoin-send-screen">
               <div className="panel-heading">
-                <h3 data-edexcoin="COIN" className="panel-title">
-                  {translate('INDEX.SEND')} {this.props.ActiveCoin.coin}
+                <h3 className="panel-title">
+                  { translate('INDEX.SEND') } { this.props.ActiveCoin.coin }
                 </h3>
               </div>
               <div className="panel-body container-fluid">
-                <form className="edexcoin-send-form" data-edexcoin="COIN" method="post" role="form" autoComplete="off">
+                <form className="edexcoin-send-form" method="post" role="form" autoComplete="off">
                   {this.renderSendApiTypeSelector()}
                   <div className="row">
-                    <div className={this.props.ActiveCoin.mode === 'basilisk' ? 'col-xlg-12 form-group form-material' : 'hide'}>
-                      <label className="control-label" data-edexcoin="COIN" htmlFor="edexcoin_send_from">{translate('INDEX.SEND_FROM')}</label>
-                      {this.renderAddressList()}
+                    <div className={ this.props.ActiveCoin.mode === 'basilisk' ? 'col-xlg-12 form-group form-material' : 'hide' }>
+                      <label className="control-label" htmlFor="edexcoin_send_from">{ translate('INDEX.SEND_FROM') }</label>
+                      { this.renderAddressList() }
                     </div>
                   </div>
-                  {this.renderOASendUI()}
+                  { this.renderOASendUI() }
                   <div className="row">
                     <div className="col-xlg-12 form-group form-material">
-                      <label className="control-label" data-edexcoin="COIN" htmlFor="edexcoin_sendto">{translate('INDEX.SEND_TO')}</label>
-                      <input type="text" className="form-control" id="edexcoin_sendto" name="sendTo" placeholder="Enter address" autoComplete="off" value={this.state.sendTo} onChange={this.updateInput} required />
+                      <label className="control-label" htmlFor="edexcoin_sendto">{ translate('INDEX.SEND_TO') }</label>
+                      <input
+                        type="text"
+                        className="form-control"
+                        id="edexcoin_sendto"
+                        name="sendTo"
+                        placeholder={ translate('SEND.ENTER_AN_ADDRESS') }
+                        autoComplete="off"
+                        value={ this.state.sendTo }
+                        onChange={ this.updateInput }
+                        required />
                     </div>
                     <div className="col-lg-6 form-group form-material">
-                      <label className="control-label" htmlFor="edexcoin_amount" data-edexcoin="COIN" id="edexcoin_amount_label">
-                        {this.props.ActiveCoin.coin}
+                      <label className="control-label" htmlFor="edexcoin_amount" id="edexcoin_amount_label">
+                        { this.props.ActiveCoin.coin }
                       </label>
-                      <input type="text" className="form-control" id="edexcoin_amount" name="amount" placeholder="0.000" autoComplete="off" onChange={this.updateInput} />
+                      <input
+                        type="text"
+                        className="form-control"
+                        id="edexcoin_amount"
+                        name="amount"
+                        placeholder="0.000"
+                        autoComplete="off"
+                        onChange={ this.updateInput } />
                     </div>
                     <div className="col-lg-6 form-group form-material">
-                      <label className="control-label" data-edexcoin="COIN" htmlFor="edexcoin_fee">{translate('INDEX.FEE')}</label>
-                      <input type="text" className="form-control" id="edexcoin_fee" name="fee" defaultValue={this.state.fee} value={this.state.fee} placeholder="0.000" autoComplete="off" onChange={this.updateInput} />
+                      <label className="control-label" htmlFor="edexcoin_fee">{ translate('INDEX.FEE') }</label>
+                      <input
+                        type="text"
+                        className="form-control"
+                        id="edexcoin_fee"
+                        name="fee"
+                        defaultValue={ this.state.fee }
+                        value={ this.state.fee }
+                        placeholder="0.000"
+                        autoComplete="off"
+                        onChange={ this.updateInput } />
                     </div>
                     <div className="col-lg-12">
                       <span data-edexcoin="KMD">
-                        <b>{translate('INDEX.TOTAL')} ({translate('INDEX.AMOUNT_SM')} - txfee):</b> <span id="edexcoin_total_value">{Number(this.state.amount) - Number(this.state.fee)}</span> {this.props.ActiveCoin.coin}
+                        <strong>{ translate('INDEX.TOTAL') } ({ translate('INDEX.AMOUNT_SM') } - txfee):</strong> <span id="edexcoin_total_value">{ Number(this.state.amount) - Number(this.state.fee) }</span> { this.props.ActiveCoin.coin }
                       </span>
                     </div>
                     <div className="col-lg-10 margin-top-10">
                       <div className="pull-left margin-right-10">
-                        <input type="checkbox" id="edexcoin_send_sig" data-plugin="switchery" data-size="small" />
+                        <input type="checkbox" id="edexcoin_send_sig" />
                       </div>
-                      <label className="padding-top-3" htmlFor="edexcoin_send_sig" onClick={this.toggleSendSig}>{translate('INDEX.DONT_SEND')}</label>
+                      <label
+                        className="padding-top-3"
+                        htmlFor="edexcoin_send_sig"
+                        onClick={ this.toggleSendSig }>{ translate('INDEX.DONT_SEND') }</label>
                     </div>
-                    {this.renderUTXOCacheInfo()}
+                    { this.renderUTXOCacheInfo()} 
                     <div className="col-lg-12">
-                      <button type="button" className="btn btn-primary waves-effect waves-light pull-right edexcoin_send_coins_btn_step1" onClick={() => this.changeSendCoinStep(1)}>
-                        {translate('INDEX.SEND')} {Number(this.state.amount) - Number(this.state.fee)} {this.props.ActiveCoin.coin}
+                      <button
+                        type="button"
+                        className="btn btn-primary waves-effect waves-light pull-right edexcoin_send_coins_btn_step1"
+                        onClick={ () => this.changeSendCoinStep(1) }>
+                        { translate('INDEX.SEND') } { Number(this.state.amount) - Number(this.state.fee) } { this.props.ActiveCoin.coin }
                       </button>
                     </div>
                   </div>
@@ -802,64 +870,78 @@ class SendCoin extends React.Component {
             </div>
           </div>
 
-          <div className={this.state.currentStep === 1 ? 'col-xlg-12 col-md-12 col-sm-12 col-xs-12' : 'col-xlg-12 col-md-12 col-sm-12 col-xs-12 hide'}>
+          <div className={ this.state.currentStep === 1 ? 'col-xlg-12 col-md-12 col-sm-12 col-xs-12' : 'col-xlg-12 col-md-12 col-sm-12 col-xs-12 hide' }>
             <div className="panel" id="edexcoin-send-confirm-screen">
               <div className="panel-body">
                 <div className="row">
                   <div className="col-xs-12">
-                    <b>{translate('INDEX.TO')}</b>
+                    <strong>{translate('INDEX.TO')}</strong>
                   </div>
-                  <div className="col-lg-6 col-sm-6 col-xs-12" id="mdl_confirm_currency_sendto_addr">{this.state.sendTo}</div>
+                  <div className="col-lg-6 col-sm-6 col-xs-12" id="mdl_confirm_currency_sendto_addr">{ this.state.sendTo }</div>
                   <div className="col-lg-6 col-sm-6 col-xs-6">
-                    <span id="mdl_confirm_currency_send_amount">{this.state.amount}</span> {this.props.ActiveCoin.coin}
+                    <span id="mdl_confirm_currency_send_amount">{this.state.amount}</span> { this.props.ActiveCoin.coin }
                   </div>
-                  <div className="col-lg-6 col-sm-6 col-xs-12">{translate('INDEX.TX_FEE_REQ')}</div>
+                  <div className="col-lg-6 col-sm-6 col-xs-12">{ translate('INDEX.TX_FEE_REQ') }</div>
                   <div className="col-lg-6 col-sm-6 col-xs-6">
-                    <span id="mdl_confirm_currency_send_fee">{this.state.fee}</span> {this.props.ActiveCoin.coin}
+                    <span id="mdl_confirm_currency_send_fee">{ this.state.fee }</span> { this.props.ActiveCoin.coin }
                   </div>
                 </div>
                 <br />
 
                 <div className="row">
                   <div className="col-xs-12">
-                    <b>{translate('INDEX.FROM')}</b>
+                    <strong>{ translate('INDEX.FROM') }</strong>
                   </div>
-                  <div className="col-lg-6 col-sm-6 col-xs-12" id="mdl_confirm_currency_sendfrom_addr">{this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin]}</div>
-                  <div className="col-lg-6 col-sm-6 col-xs-6" style={{color: '#f44336'}}>
-                    <span id="mdl_confirm_currency_sendfrom_total_dedcut">{Number(this.state.amount) - Number(this.state.fee)}</span> {this.props.ActiveCoin.coin}
+                  <div className="col-lg-6 col-sm-6 col-xs-12" id="mdl_confirm_currency_sendfrom_addr">{ this.props.Dashboard.activeHandle[this.props.ActiveCoin.coin] }</div>
+                  <div className="col-lg-6 col-sm-6 col-xs-6" style={{ color: '#f44336' }}>
+                    <span id="mdl_confirm_currency_sendfrom_total_dedcut">{ Number(this.state.amount) - Number(this.state.fee) }</span> { this.props.ActiveCoin.coin }
                   </div>
                 </div>
                 <div className="widget-body-footer">
-                  <a className="btn btn-default waves-effect waves-light" id="edexcoin_send_coins_back_btn" onClick={() => this.changeSendCoinStep(0)}>{translate('INDEX.BACK')}</a>
+                  <a
+                    className="btn btn-default waves-effect waves-light"
+                    id="edexcoin_send_coins_back_btn"
+                    onClick={ () => this.changeSendCoinStep(0) }>{ translate('INDEX.BACK') }</a>
                   <div className="widget-actions pull-right">
-                    <button type="button" className="btn btn-primary" id="edexcoin_send_coins_btn" onClick={() => this.changeSendCoinStep(2)}>{translate('INDEX.CONFIRM')}</button>
+                    <button
+                      type="button"
+                      className="btn btn-primary"
+                      id="edexcoin_send_coins_btn"
+                      onClick={ () => this.changeSendCoinStep(2) }>{ translate('INDEX.CONFIRM') }</button>
                   </div>
                 </div>
               </div>
             </div>
           </div>
 
-          <div className={this.state.currentStep === 2 ? 'col-xlg-12 col-md-12 col-sm-12 col-xs-12' : 'col-xlg-12 col-md-12 col-sm-12 col-xs-12 hide'}>
+          <div className={ this.state.currentStep === 2 ? 'col-xlg-12 col-md-12 col-sm-12 col-xs-12' : 'col-xlg-12 col-md-12 col-sm-12 col-xs-12 hide' }>
             <div className="panel" id="edexcoin-send-txdetails-screen">
               <div className="panel-heading">
-                <h4 className="panel-title">{translate('INDEX.TRANSACTION_RESULT')}</h4>
-                <div className={!this.state.sendSig ? 'hide' : 'center'}>
-                  You picked option "{translate('INDEX.DONT_SEND')}"
+                <h4 className="panel-title">{ translate('INDEX.TRANSACTION_RESULT') }</h4>
+                <div className={ !this.state.sendSig ? 'hide' : 'center' }>
+                  { translate('INDEX.YOU_PICKED_OPT') } "{ translate('INDEX.DONT_SEND') }"
                 </div>
-                <table className="table table-hover table-striped edexcoin_sendto_result" id="edexcoin_sendto_result">
+                <table
+                  className="table table-hover table-striped edexcoin_sendto_result"
+                  id="edexcoin_sendto_result">
                   <thead>
                     <tr>
-                      <th>{translate('INDEX.KEY')}</th>
-                      <th>{translate('INDEX.INFO')}</th>
+                      <th>{ translate('INDEX.KEY') }</th>
+                      <th>{ translate('INDEX.INFO') }</th>
                     </tr>
                   </thead>
                   <tbody>
-                  {this.renderSendCoinResponse()}
+                  { this.renderSendCoinResponse() }
                   </tbody>
                 </table>
                 <div className="widget-body-footer">
                   <div className="widget-actions margin-bottom-15 margin-right-15">
-                    <button type="button" className="btn btn-primary" id="edexcoin_send_coins_anothertx_btn" onClick={() => this.changeSendCoinStep(0)} disabled={this.state.utxoMethodInProgress}>{!this.state.utxoMethodInProgress ? translate('INDEX.MAKE_ANOTHER_TX') : 'Please wait...'}</button>
+                    <button
+                      type="button"
+                      className="btn btn-primary"
+                      id="edexcoin_send_coins_anothertx_btn"
+                      onClick={ () => this.changeSendCoinStep(0) }
+                      disabled={ this.state.utxoMethodInProgress }>{ !this.state.utxoMethodInProgress ? translate('INDEX.MAKE_ANOTHER_TX') : translate('SEND.PLEASE_WAIT') + '...' }</button>
                   </div>
                 </div>
               </div>
diff --git a/react/src/components/dashboard/settings.js b/react/src/components/dashboard/settings.js
index 256f364..bf21bff 100644
--- a/react/src/components/dashboard/settings.js
+++ b/react/src/components/dashboard/settings.js
@@ -92,7 +92,9 @@ class Settings extends React.Component {
       if (this.props.Settings.rawPeers &&
           this.state.getPeersCoin &&
           this.props.Settings.rawPeers[coin]) {
-        return this.props.Settings.rawPeers[coin].map((ip) => <div key={ip}>{ip}</div>);
+        return this.props.Settings.rawPeers[coin].map((ip) =>
+          <div key={ ip }>{ ip }</div>
+        );
       } else {
         return null;
       }
@@ -107,70 +109,74 @@ class Settings extends React.Component {
     if (releaseInfo) {
       return (
         <div className="panel" id="AppInfo">
-          <div className="panel-heading" role="tab" onClick={() => this.openTab('AppInfo', 8)}>
-            <a className={this.state.activeTab === 8 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#AppInfoAccordion">
-              <i className="icon md-info" aria-hidden="true"></i>App Info
+          <div className="panel-heading" role="tab" onClick={ () => this.openTab('AppInfo', 8) }>
+            <a className={this.state.activeTab === 8 ? 'panel-title' : 'panel-title collapsed'}>
+              <i className="icon md-info" aria-hidden="true"></i>{ translate('SETTINGS.APP_INFO') }
             </a>
           </div>
-          <div className={this.state.activeTab === 8 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 8 ? this.state.activeTabHeight + 'px' : '10px'}} aria-labelledby="DebugLog" role="tabpanel">
+          <div
+            className={ this.state.activeTab === 8 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+            style={{ height: this.state.activeTab === 8 ? this.state.activeTabHeight + 'px' : '10px' }}
+            aria-labelledby="DebugLog"
+            role="tabpanel">
             <div className="panel-body">
-              <div className="col-sm-12" style={{paddingTop: '15px'}}>
+              <div className="col-sm-12" style={{ paddingTop: '15px' }}>
                 <div className="row">
-                  <h5>App Release</h5>
+                  <h5>{ translate('SETTINGS.APP_RELEASE') }</h5>
                   <div>
-                    Name: {this.props.Settings.appInfo.releaseInfo.name}
+                    { translate('SETTINGS.NAME') }: { this.props.Settings.appInfo.releaseInfo.name }
                   </div>
                   <div>
-                    Version: {this.props.Settings.appInfo.releaseInfo.version}
+                    { translate('SETTINGS.VERSION') }: { this.props.Settings.appInfo.releaseInfo.version }
                   </div>
                 </div>
               </div>
-              <div className="col-sm-12" style={{paddingTop: '20px'}}>
+              <div className="col-sm-12" style={{ paddingTop: '20px' }}>
                 <div className="row">
-                  <h5>System Info</h5>
+                  <h5>{ translate('SETTINGS.SYS_INFO') }</h5>
                   <div>
-                    Architecture: {this.props.Settings.appInfo.sysInfo.arch}
+                    { translate('SETTINGS.ARCH') }: { this.props.Settings.appInfo.sysInfo.arch }
                   </div>
                   <div>
-                    OS Type: {this.props.Settings.appInfo.sysInfo.os_type}
+                    { translate('SETTINGS.OS_TYPE') }: { this.props.Settings.appInfo.sysInfo.os_type }
                   </div>
                   <div>
-                    OS Platfrom: {this.props.Settings.appInfo.sysInfo.platform}
+                    { translate('SETTINGS.OS_PLATFORM') }: { this.props.Settings.appInfo.sysInfo.platform }
                   </div>
                   <div>
-                    OS Release: {this.props.Settings.appInfo.sysInfo.os_release}
+                    { translate('SETTINGS.OS_RELEASE') }: { this.props.Settings.appInfo.sysInfo.os_release }
                   </div>
                   <div>
-                    CPU: {this.props.Settings.appInfo.sysInfo.cpu}
+                    { translate('SETTINGS.CPU') }: { this.props.Settings.appInfo.sysInfo.cpu }
                   </div>
                   <div>
-                    CPU Cores: {this.props.Settings.appInfo.sysInfo.cpu_cores}
+                    { translate('SETTINGS.CPU_CORES') }: { this.props.Settings.appInfo.sysInfo.cpu_cores }
                   </div>
                   <div>
-                    Memory: {this.props.Settings.appInfo.sysInfo.totalmem_readable}
+                    { translate('SETTINGS.MEM') }: { this.props.Settings.appInfo.sysInfo.totalmem_readable }
                   </div>
                 </div>
               </div>
-              <div className="col-sm-12" style={{paddingTop: '20px'}}>
+              <div className="col-sm-12" style={{ paddingTop: '20px' }}>
                 <div className="row">
-                  <h5>Locations</h5>
+                  <h5>{ translate('SETTINGS.LOCATIONS') }</h5>
                   <div>
-                    Cache: {this.props.Settings.appInfo.dirs.cacheLocation}
+                    { translate('SETTINGS.CACHE') }: { this.props.Settings.appInfo.dirs.cacheLocation }
                   </div>
                   <div>
-                    Config: {this.props.Settings.appInfo.dirs.configLocation}
+                    { translate('SETTINGS.CONFIG') }: { this.props.Settings.appInfo.dirs.configLocation }
                   </div>
                   <div>
-                    Iguana Bin: {this.props.Settings.appInfo.dirs.iguanaBin}
+                    Iguana { translate('SETTINGS.BIN') }: { this.props.Settings.appInfo.dirs.iguanaBin }
                   </div>
                   <div>
-                    Iguana Dir: {this.props.Settings.appInfo.dirs.iguanaDir}
+                    Iguana { translate('SETTINGS.DIR') }: { this.props.Settings.appInfo.dirs.iguanaDir }
                   </div>
                   <div>
-                    Komodo Bin: {this.props.Settings.appInfo.dirs.komododBin}
+                    Komodo { translate('SETTINGS.BIN') }: { this.props.Settings.appInfo.dirs.komododBin }
                   </div>
                   <div>
-                    Komodo Dir: {this.props.Settings.appInfo.dirs.komodoDir}
+                    Komodo { translate('SETTINGS.DIR') }: { this.props.Settings.appInfo.dirs.komodoDir }
                   </div>
                 </div>
               </div>
@@ -190,7 +196,9 @@ class Settings extends React.Component {
       if (this.props.Settings.supernetPeers &&
           this.state.getPeersCoin &&
           this.props.Settings.supernetPeers[coin]) {
-        return this.props.Settings.supernetPeers[coin].map((ip) => <div key={ip}>{ip}</div>);
+        return this.props.Settings.supernetPeers[coin].map((ip) =>
+          <div key={ ip }>{ ip }</div>
+        );
       } else {
         return null;
       }
@@ -217,15 +225,12 @@ class Settings extends React.Component {
     for (let key in _appSettings) {
       if (key.indexOf('__') === -1) {
         _appSettingsPristine[key] = _appSettings[key];
-        // console.log('key changed: ' + key + ', value: ' + _appSettings[key]);
       } else {
         const _nestedKey = key.split('__');
         _appSettingsPristine[_nestedKey[0]][_nestedKey[1]] = _appSettings[key];
-        // console.log('key changed: ' + _nestedKey[0] + '.' + _nestedKey[1] + ', value: ' + _appSettings[key]);
       }
     }
 
-    // console.log('changed settings obj', _appSettingsPristine);
     Store.dispatch(saveAppConfig(_appSettingsPristine));
   }
 
@@ -236,34 +241,42 @@ class Settings extends React.Component {
     for (let key in _appConfig) {
       if (typeof _appConfig[key] === 'object') {
         items.push(
-          <tr key={`app-settings-${key}`}>
-            <td style={{padding: '15px'}}>
-              {key}
+          <tr key={ `app-settings-${key}` }>
+            <td style={{ padding: '15px' }}>
+              { key }
             </td>
-            <td style={{padding: '15px'}}></td>
+            <td style={{ padding: '15px' }}></td>
           </tr>
         );
 
         for (let _key in _appConfig[key]) {
           items.push(
-            <tr key={`app-settings-${key}-${_key}`}>
-              <td style={{padding: '15px', paddingLeft: '30px'}}>
-                {_key}
+            <tr key={ `app-settings-${key}-${_key}` }>
+              <td style={{ padding: '15px', paddingLeft: '30px' }}>
+                { _key }
               </td>
-              <td style={{padding: '15px'}}>
-                <input type="text" name={`${key}__${_key}`} defaultValue={_appConfig[key][_key]} onChange={this.updateInputSettings} />
+              <td style={{ padding: '15px' }}>
+                <input
+                  type="text"
+                  name={ `${key}__${_key}` }
+                  defaultValue={ _appConfig[key][_key] }
+                  onChange={ this.updateInputSettings } />
               </td>
             </tr>
           );
         }
       } else {
         items.push(
-          <tr key={`app-settings-${key}`}>
-            <td style={{padding: '15px'}}>
-              {key}
+          <tr key={ `app-settings-${key}` }>
+            <td style={{ padding: '15px' }}>
+              { key }
             </td>
-            <td style={{padding: '15px'}}>
-              <input type="text" name={`${key}`} defaultValue={_appConfig[key]} onChange={this.updateInputSettings} />
+            <td style={{ padding: '15px' }}>
+              <input
+                type="text"
+                name={ `${key}` }
+                defaultValue={ _appConfig[key] }
+                onChange={ this.updateInputSettings } />
             </td>
           </tr>
         );
@@ -284,7 +297,7 @@ class Settings extends React.Component {
 
     return _translationComponents.map((_translation) =>
       <span>
-        {_translation}
+        { _translation }
         <br />
       </span>
     );
@@ -298,58 +311,63 @@ class Settings extends React.Component {
             <div className="col-xlg-12 col-md-12">
               <div className="row" id="iguana-wallet-settings">
                 <div className="col-xlg-12 col-md-12">
-                  <h4 className="font-size-14 text-uppercase">{translate('INDEX.WALLET_SETTINGS')}</h4>
+                  <h4 className="font-size-14 text-uppercase">{ translate('INDEX.WALLET_SETTINGS') }</h4>
                   <div className="panel-group" id="SettingsAccordion" aria-multiselectable="true" role="tablist">
                     <div className="panel" id="WalletInfo">
-                      <div className="panel-heading" role="tab" onClick={() => this.openTab('WalletInfo', 0)}>
-                        <a className={this.state.activeTab === 0 ? 'panel-title' : 'panel-title collapsed'}>
-                          <i className="icon md-balance-wallet" aria-hidden="true"></i>{translate('INDEX.WALLET_INFO')}
+                      <div className="panel-heading" role="tab" onClick={ () => this.openTab('WalletInfo', 0) }>
+                        <a className={ this.state.activeTab === 0 ? 'panel-title' : 'panel-title collapsed' }>
+                          <i className="icon md-balance-wallet" aria-hidden="true"></i>{ translate('INDEX.WALLET_INFO') }
                         </a>
                       </div>
-                      <div className={this.state.activeTab === 0 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 0 ? this.state.activeTabHeight + 'px' : '10px'}} id="WalletInfoTab" aria-labelledby="WalletInfo" role="tabpanel">
+                      <div
+                        className={ this.state.activeTab === 0 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+                        style={{ height: this.state.activeTab === 0 ? this.state.activeTabHeight + 'px' : '10px' }}
+                        id="WalletInfoTab"
+                        aria-labelledby="WalletInfo"
+                        role="tabpanel">
                         <div className="panel-body">
                           <table className="table" id="wallet-info-table">
                             <thead>
                               <tr>
-                                <th width="10%">{translate('INDEX.KEY')}</th>
-                                <th>{translate('INDEX.VALUE')}</th>
+                                <th width="10%">{ translate('INDEX.KEY') }</th>
+                                <th>{ translate('INDEX.VALUE') }</th>
                               </tr>
                             </thead>
                             <tbody>
                               <tr>
-                                <td style={{fontWeight: 'bold'}}>pubkey</td>
+                                <td style={{ fontWeight: 'bold' }}>pubkey</td>
                                 <td>
-                                  <div id="winfo_pubkey_value">{this.props.Main.activeHandle.pubkey}</div>
+                                  <div id="winfo_pubkey_value">{ this.props.Main.activeHandle.pubkey }</div>
                                 </td>
                               </tr>
                               <tr>
-                                <td style={{fontWeight: 'bold'}}>btcpubkey</td>
+                                <td style={{ fontWeight: 'bold' }}>btcpubkey</td>
                                 <td>
-                                  <div id="winfo_btcpubkey_value">{this.props.Main.activeHandle.btcpubkey}</div>
+                                  <div id="winfo_btcpubkey_value">{ this.props.Main.activeHandle.btcpubkey }</div>
                                 </td>
                               </tr>
                               <tr>
-                                <td style={{fontWeight: 'bold'}}>rmd160</td>
+                                <td style={{ fontWeight: 'bold' }}>rmd160</td>
                                 <td>
-                                  <div id="winfo_rmd160_value">{this.props.Main.activeHandle.rmd160}</div>
+                                  <div id="winfo_rmd160_value">{ this.props.Main.activeHandle.rmd160 }</div>
                                 </td>
                               </tr>
                               <tr>
-                                <td style={{fontWeight: 'bold'}}>NXT</td>
+                                <td style={{ fontWeight: 'bold' }}>NXT</td>
                                 <td>
-                                  <div id="winfo_NXT_value">{this.props.Main.activeHandle.NXT}</div>
+                                  <div id="winfo_NXT_value">{ this.props.Main.activeHandle.NXT }</div>
                                 </td>
                               </tr>
                               <tr>
-                                <td style={{fontWeight: 'bold'}}>notary</td>
+                                <td style={{ fontWeight: 'bold' }}>notary</td>
                                 <td>
-                                  <div id="winfo_notary_value">{this.props.Main.activeHandle.notary}</div>
+                                  <div id="winfo_notary_value">{ this.props.Main.activeHandle.notary }</div>
                                 </td>
                               </tr>
                               <tr>
-                                <td style={{fontWeight: 'bold'}}>status</td>
+                                <td style={{ fontWeight: 'bold' }}>status</td>
                                 <td>
-                                  <div id="winfo_status_value">{this.props.Main.activeHandle.status}</div>
+                                  <div id="winfo_status_value">{ this.props.Main.activeHandle.status }</div>
                                 </td>
                               </tr>
                             </tbody>
@@ -359,62 +377,89 @@ class Settings extends React.Component {
                     </div>
 
                     <div className="panel" id="AddNodeforCoin">
-                      <div className="panel-heading" role="tab" onClick={() => this.openTab('AddNodeforCoin', 1)}>
-                        <a className={this.state.activeTab === 1 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#SettingsAccordion">
-                          <i className="icon md-plus-square" aria-hidden="true"></i>{translate('INDEX.ADD_NODE')}
+                      <div className="panel-heading" role="tab" onClick={ () => this.openTab('AddNodeforCoin', 1) }>
+                        <a className={ this.state.activeTab === 1 ? 'panel-title' : 'panel-title collapsed' }>
+                          <i className="icon md-plus-square" aria-hidden="true"></i>{ translate('INDEX.ADD_NODE') }
                         </a>
                       </div>
-                      <div className={this.state.activeTab === 1 ? 'panel-collapse collapse in' : 'panel-collapse collapse'}  style={{height: this.state.activeTab === 1 ? this.state.activeTabHeight + 'px' : '10px'}} id="AddNodeforCoinTab" aria-labelledby="AddNodeforCoin" role="tabpanel">
+                      <div
+                        className={ this.state.activeTab === 1 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+                        style={{ height: this.state.activeTab === 1 ? this.state.activeTabHeight + 'px' : '10px' }}
+                        id="AddNodeforCoinTab"
+                        aria-labelledby="AddNodeforCoin"
+                        role="tabpanel">
                         <div className="panel-body">
                           <div className="row">
                             <div className="col-sm-6">
                               <div className="col-sm-12">
-                                <p>{translate('INDEX.USE_THIS_SECTION')}</p>
+                                <p>{ translate('INDEX.USE_THIS_SECTION') }</p>
                               </div>
                               <div className="col-sm-8 col-xs-12">
                                 <div className="form-group">
-                                  <select className="form-control form-material" id="settings_select_coin_options" name="getPeersCoin" onChange={this.updateInput}>
-                                    <option>{translate('INDEX.SELECT_COIN')}</option>
+                                  <select
+                                    className="form-control form-material"
+                                    id="settings_select_coin_options"
+                                    name="getPeersCoin"
+                                    onChange={ this.updateInput }>
+                                    <option>{ translate('INDEX.SELECT_COIN') }</option>
                                     <AddCoinOptionsCrypto />
                                     <AddCoinOptionsAC />
                                     <AddCoinOptionsACFiat />
                                   </select>
                                 </div>
                               </div>
-                              <div className="col-sm-4 col-xs-12" style={{textAlign: 'center'}}>
-                                <button type="button" className="btn btn-primary waves-effect waves-light" data-toggle="modal" data-dismiss="modal" id="settings_getcoinpeers_btn" onClick={this.checkNodes}>{translate('INDEX.CHECK_NODES')}</button>
+                              <div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}>
+                                <button
+                                  type="button"
+                                  className="btn btn-primary waves-effect waves-light"
+                                  id="settings_getcoinpeers_btn"
+                                  onClick={ this.checkNodes }>{ translate('INDEX.CHECK_NODES') }</button>
                               </div>
                               <div className="col-sm-12">
                                 <h5>
                                   SuperNET Peers: <span id="coin_supernetpeers_h"></span>
                                 </h5>
-                                <p id="coin_supernetpeers">{this.renderSNPeersList()}</p>
+                                <p id="coin_supernetpeers">{ this.renderSNPeersList() }</p>
                                 <h5>
                                   Raw Peers: <span id="coin_rawpeers_h"></span>
                                 </h5>
-                                <p id="coin_rawpeers">{this.renderPeersList()}</p>
+                                <p id="coin_rawpeers">{ this.renderPeersList() }</p>
                               </div>
                             </div>
 
                             <div className="col-sm-6">
                               <div className="col-sm-12">
-                                <p>{translate('INDEX.USE_THIS_SECTION_PEER')}</p>
+                                <p>{ translate('INDEX.USE_THIS_SECTION_PEER') }</p>
                               </div>
                               <div className="col-sm-8 col-xs-12">
                                 <div className="form-group">
-                                  <select className="form-control form-material" id="settings_select_coin_addpeer_options" name="addNodeCoin" onChange={this.updateInput}>
-                                    <option>{translate('INDEX.SELECT_COIN')}</option>
+                                  <select
+                                    className="form-control form-material"
+                                    id="settings_select_coin_addpeer_options"
+                                    name="addNodeCoin"
+                                    onChange={ this.updateInput }>
+                                    <option>{ translate('INDEX.SELECT_COIN') }</option>
                                     <AddCoinOptionsCrypto />
                                     <AddCoinOptionsAC />
                                     <AddCoinOptionsACFiat />
                                   </select>
                                 </div>
                                 <div className="form-group">
-                                  <input type="text" className="form-control" id="settings_add_peer_ip" name="addPeerIP" placeholder="Add Peer IP" onChange={this.updateInput} />
+                                  <input
+                                    type="text"
+                                    className="form-control"
+                                    id="settings_add_peer_ip"
+                                    name="addPeerIP"
+                                    placeholder={ translate('SETTINGS.ADD_PEER_IP') }
+                                    onChange={ this.updateInput } />
                                 </div>
                               </div>
-                              <div className="col-sm-4 col-xs-12" style={{textAlign: 'center'}}>
-                                <button type="button" className="btn btn-primary waves-effect waves-light" data-toggle="modal" data-dismiss="modal" id="settings_addcoinpeers_btn" onClick={this.addNode}>{translate('INDEX.ADD_NODE')}</button>
+                              <div className="col-sm-4 col-xs-12" style={{ textAlign: 'center' }}>
+                                <button
+                                  type="button"
+                                  className="btn btn-primary waves-effect waves-light"
+                                  id="settings_addcoinpeers_btn"
+                                  onClick={ this.addNode }>{ translate('INDEX.ADD_NODE') }</button>
                               </div>
                             </div>
                           </div>
@@ -423,66 +468,93 @@ class Settings extends React.Component {
                     </div>
 
                     <div className="panel" id="DumpWallet">
-                      <div className="panel-heading" role="tab" onClick={() => this.openTab('DumpWallet', 2)}>
-                        <a className={this.state.activeTab === 2 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#SettingsAccordion">
-                          <i className="icon wb-briefcase" aria-hidden="true"></i>{translate('INDEX.WALLET_BACKUP')}
+                      <div className="panel-heading" role="tab" onClick={ () => this.openTab('DumpWallet', 2) }>
+                        <a className={this.state.activeTab === 2 ? 'panel-title' : 'panel-title collapsed'}>
+                          <i className="icon wb-briefcase" aria-hidden="true"></i>{ translate('INDEX.WALLET_BACKUP') }
                         </a>
                       </div>
-                      <div className={this.state.activeTab === 2 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 2 ? this.state.activeTabHeight + 'px' : '10px'}} id="DumpWalletTab" aria-labelledby="DumpWallet" role="tabpanel">
+                      <div
+                        className={ this.state.activeTab === 2 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+                        style={{ height: this.state.activeTab === 2 ? this.state.activeTabHeight + 'px' : '10px' }}
+                        id="DumpWalletTab"
+                        aria-labelledby="DumpWallet"
+                        role="tabpanel">
                         <div className="panel-body">Wallet Backup section to be updated soon.</div>
                       </div>
                     </div>
 
                     <div className="panel" id="FiatCurrencySettings">
-                      <div className="panel-heading" role="tab" onClick={() => this.openTab('FiatCurrencySettings', 3)}>
-                        <a className={this.state.activeTab === 3 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#SettingsAccordion">
-                          <i className="icon fa-money" aria-hidden="true"></i>{translate('INDEX.FIAT_CURRENCY')}
+                      <div
+                        className="panel-heading"
+                        role="tab"
+                        onClick={ () => this.openTab('FiatCurrencySettings', 3) }>
+                        <a className={ this.state.activeTab === 3 ? 'panel-title' : 'panel-title collapsed' }>
+                          <i className="icon fa-money" aria-hidden="true"></i>{ translate('INDEX.FIAT_CURRENCY') }
                         </a>
                       </div>
-                      <div className={this.state.activeTab === 3 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 3 ? this.state.activeTabHeight + 'px' : '10px'}} id="FiatCurrencySettingsTab" aria-labelledby="FiatCurrencySettings" role="tabpanel">
+                      <div
+                        className={ this.state.activeTab === 3 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+                        style={{ height: this.state.activeTab === 3 ? this.state.activeTabHeight + 'px' : '10px' }}
+                        id="FiatCurrencySettingsTab"
+                        aria-labelledby="FiatCurrencySettings"
+                        role="tabpanel">
                         <div className="panel-body">Fiat currency settings section to be updated soon.</div>
                       </div>
                     </div>
 
                     <div className="panel" id="ExportKeys">
-                      <div className="panel-heading" role="tab" onClick={() => this.openTab('ExportKeys', 4)}>
-                        <a className={this.state.activeTab === 4 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse" data-parent="#SettingsAccordion">
-                          <i className="icon md-key" aria-hidden="true"></i>{translate('INDEX.EXPORT_KEYS')}
+                      <div className="panel-heading" role="tab" onClick={ () => this.openTab('ExportKeys', 4) }>
+                        <a className={ this.state.activeTab === 4 ? 'panel-title' : 'panel-title collapsed' }>
+                          <i className="icon md-key" aria-hidden="true"></i>{ translate('INDEX.EXPORT_KEYS') }
                         </a>
                       </div>
-                      <div className={this.state.activeTab === 4 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 4 ? this.state.activeTabHeight + 'px' : '10px'}} id="ExportKeysTab" aria-labelledby="ExportKeys" role="tabpanel">
+                      <div
+                        className={ this.state.activeTab === 4 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+                        style={{ height: this.state.activeTab === 4 ? this.state.activeTabHeight + 'px' : '10px' }}
+                        id="ExportKeysTab"
+                        aria-labelledby="ExportKeys"
+                        role="tabpanel">
                         <div className="panel-body">
                           <p>
-                            <div>{this.renderLB('INDEX.ONLY_ACTIVE_WIF_KEYS')}</div><br/>
+                            <div>{ this.renderLB('INDEX.ONLY_ACTIVE_WIF_KEYS') }</div><br/>
                             <strong>
-                              <i>{translate('INDEX.PLEASE_KEEP_KEYS_SAFE')}</i>
+                              <i>{ translate('INDEX.PLEASE_KEEP_KEYS_SAFE') }</i>
                             </strong>
                           </p>
                           <div className="col-sm-12"></div>
                           <form className="wifkeys-form" method="post" action="javascript:" autoComplete="off">
                             <div className="form-group form-material floating">
-                              <input type="password" className="form-control" name="wifkeysPassphrase" id="wifkeys_passphrase" onChange={this.updateInput} />
-                              <label className="floating-label" htmlFor="wifkeys_passphrase">{translate('INDEX.PASSPHRASE')}</label>
+                              <input
+                                type="password"
+                                className="form-control"
+                                name="wifkeysPassphrase"
+                                id="wifkeys_passphrase"
+                                onChange={ this.updateInput } />
+                              <label className="floating-label" htmlFor="wifkeys_passphrase">{ translate('INDEX.PASSPHRASE') }</label>
                             </div>
-                            <div className="col-sm-12 col-xs-12" style={{textAlign: 'center'}}>
-                              <button type="button" className="btn btn-primary waves-effect waves-light" data-toggle="modal" data-dismiss="modal" id="wifkeys_passphrase_btn" onClick={this.exportWifKeys}>{translate('INDEX.GET_WIF_KEYS')}</button>
+                            <div className="col-sm-12 col-xs-12" style={{ textAlign: 'center' }}>
+                              <button
+                                type="button"
+                                className="btn btn-primary waves-effect waves-light"
+                                id="wifkeys_passphrase_btn"
+                                onClick={ this.exportWifKeys }>{ translate('INDEX.GET_WIF_KEYS') }</button>
                             </div>
                           </form>
 
-                          <div className="col-sm-12" style={{paddingTop: '15px'}}>
-                            <div className="row" id="wif-priv-keys" data-plugin="masonry">
-                              <table className={this.props.Settings && this.props.Settings.address ? 'table show' : 'table hide'}>
+                          <div className="col-sm-12" style={{ paddingTop: '15px' }}>
+                            <div className="row" id="wif-priv-keys">
+                              <table className={ this.props.Settings && this.props.Settings.address ? 'table show' : 'table hide' }>
                                 <tr>
-                                  <td style={{width: '5%'}}>
-                                    <strong>{this.props.ActiveCoin.coin}</strong>
+                                  <td style={{ width: '5%' }}>
+                                    <strong>{ this.props.ActiveCoin.coin }</strong>
                                   </td>
-                                  <td>{this.props.Settings.address}</td>
+                                  <td>{ this.props.Settings.address }</td>
                                 </tr>
                                 <tr>
                                   <td>
-                                    <strong>{this.props.ActiveCoin.coin}Wif</strong>
+                                    <strong>{ this.props.ActiveCoin.coin }Wif</strong>
                                   </td>
-                                  <td>{this.props.Settings.wifkey}</td>
+                                  <td>{ this.props.Settings.wifkey }</td>
                                 </tr>
                               </table>
                             </div>
@@ -492,12 +564,17 @@ class Settings extends React.Component {
                     </div>
 
                     <div className="panel" id="ImportKeys">
-                      <div className="panel-heading" role="tab" onClick={() => this.openTab('ImportKeys', 5)}>
-                        <a className={this.state.activeTab === 5 ? 'panel-title' : 'panel-title collapsed'} data-toggle="collapse">
-                          <i className="icon md-key" aria-hidden="true"></i>{translate('INDEX.IMPORT_KEYS')}
+                      <div className="panel-heading" role="tab" onClick={ () => this.openTab('ImportKeys', 5) }>
+                        <a className={ this.state.activeTab === 5 ? 'panel-title' : 'panel-title collapsed' }>
+                          <i className="icon md-key" aria-hidden="true"></i>{ translate('INDEX.IMPORT_KEYS') }
                         </a>
                       </div>
-                      <div className={this.state.activeTab === 5 ? 'panel-collapse collapse in' : 'panel-collapse collapse'} style={{height: this.state.activeTab === 5 ? this.state.activeTabHeight + 'px' : '10px'}} id="ImportKeysTab" aria-labelledby="ImportKeys" role="tabpanel">
+                      <div
+                        className={ this.state.activeTab === 5 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+                        style={{ height: this.state.activeTab === 5 ? this.state.activeTabHeight + 'px' : '10px' }}
+                        id="ImportKeysTab"
+                        aria-labelledby="ImportKeys"
+                        role="tabpanel">
                         <div className="panel-body">
                           <p>
                             <div>{ translate('INDEX.IMPORT_KEYS_DESC_P1') }</div><br/>
@@ -510,8 +587,15 @@ class Settings extends React.Component {
                           <div className="col-sm-12"></div>
                           <form className="wifkeys-import-form" method="post" action="javascript:" autoComplete="off">
                             <div className="form-group form-material floating">
-                              <input type="text" className="form-control" name="importWifKey" id="import_wifkey" onChange={ this.updateInput } />
-                              <label className="floating-label" htmlFor="import_wifkey">{ translate('INDEX.INPUT_PRIV_KEY') }</label>
+                              <input
+                                type="text"
+                                className="form-control"
+                                name="importWifKey"
+                                id="import_wifkey"
+                                onChange={ this.updateInput } />
+                              <label
+                                className="floating-label"
+                                htmlFor="import_wifkey">{ translate('INDEX.INPUT_PRIV_KEY') }</label>
                             </div>
                             <div className="col-sm-12 col-xs-12" style={{ textAlign: 'center' }}>
                               <button
@@ -531,13 +615,18 @@ class Settings extends React.Component {
                           <i className="icon fa-bug" aria-hidden="true"></i>{ translate('INDEX.DEBUG_LOG') }
                         </a>
                       </div>
-                      <div className={ this.state.activeTab === 6 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
-                           style={{ height: this.state.activeTab === 6 ? this.state.activeTabHeight + 'px' : '10px' }}
-                           id="DebugLogTab" aria-labelledby="DebugLog" role="tabpanel">
+                      <div
+                        className={ this.state.activeTab === 6 ? 'panel-collapse collapse in' : 'panel-collapse collapse' }
+                        style={{ height: this.state.activeTab === 6 ? this.state.activeTabHeight + 'px' : '10px' }}
+                        id="DebugLogTab" aria-labelledby="DebugLog" role="tabpanel">
                         <div className="panel-body">
                           <p>{ translate('INDEX.DEBUG_LOG_DESC') }</p>
                           <div className="col-sm-12"></div>
-                          <form className="read-debug-log-import-form" method="post" action="javascript:" autoComplete="off">
+                          <form
+                            className="read-debug-log-import-form"
+                            method="post"
+                            action="javascript:"
+                            autoComplete="off">
                             <div className="form-group form-material floating">
                               <input
                                 type="text"
@@ -546,14 +635,22 @@ class Settings extends React.Component {
                                 id="read_debug_log_lines"
                                 value={ this.state.debugLinesCount }
                                 onChange={ this.updateInput } />
-                              <label className="floating-label" htmlFor="read_debug_log_lines">{ translate('INDEX.DEBUG_LOG_LINES') }</label>
+                              <label
+                                className="floating-label"
+                                htmlFor="read_debug_log_lines">{ translate('INDEX.DEBUG_LOG_LINES') }</label>
                             </div>
                             <div className="form-group form-material floating">
-                              <select className="form-control form-material" name="debugTarget" id="settings_select_debuglog_options" onChange={ this.updateInput }>
+                              <select
+                                className="form-control form-material"
+                                name="debugTarget"
+                                id="settings_select_debuglog_options"
+                                onChange={ this.updateInput }>
                                 <option value="iguana">Iguana</option>
                                 <option value="komodo">Komodo</option>
                               </select>
-                              <label className="floating-label" htmlFor="settings_select_debuglog_options">{ translate('INDEX.TARGET') }</label>
+                              <label
+                                className="floating-label"
+                                htmlFor="settings_select_debuglog_options">{ translate('INDEX.TARGET') }</label>
                             </div>
                             <div className="col-sm-12 col-xs-12" style={{ textAlign: 'center'}}>
                               <button
diff --git a/react/src/components/dashboard/walletsData.js b/react/src/components/dashboard/walletsData.js
index c7d1ff2..788c7df 100644
--- a/react/src/components/dashboard/walletsData.js
+++ b/react/src/components/dashboard/walletsData.js
@@ -286,7 +286,7 @@ class WalletsData extends React.Component {
               className="dataTables_info"
               id="kmd-tx-history-tbl_info"
               role="status"
-              aria-live="polite">{ translate('INDEX.SHOWING') } { _paginationFrom } { translate('INDEX.TO') } { _paginationTo } { translate('INDEX.OF') } { this.props.ActiveCoin.txhistory.length } { translate('INDEX.ENTRIES_SM') }</div>
+              aria-live="polite">{ translate('INDEX.SHOWING') } { _paginationFrom } { translate('INDEX.TO_ALT') } { _paginationTo } { translate('INDEX.OF') } { this.props.ActiveCoin.txhistory.length } { translate('INDEX.ENTRIES_SM') }</div>
           </div>
           <div className="col-sm-7">
             <div className="dataTables_paginate paging_simple_numbers" id="kmd-tx-history-tbl_paginate">
@@ -628,7 +628,7 @@ class WalletsData extends React.Component {
                               </li>
                               <li
                                 role="presentation"
-                                className={ !this.state.useCache || this.props.ActiveCoin.addresses.public.length === 1 ? 'hide' : '' }>
+                                className={ !this.state.useCache || this.props.ActiveCoin.addresses && this.props.ActiveCoin.addresses.public.length === 1 ? 'hide' : '' }>
                                 <a role="menuitem" onClick={ this.basiliskRefreshAction }>
                                   <i className="icon fa-cloud-download" aria-hidden="true"></i> { translate('INDEX.FETCH_ALL_ADDR') }
                                 </a>
diff --git a/react/src/translate/en.js b/react/src/translate/en.js
index 664aa77..ae8c492 100644
--- a/react/src/translate/en.js
+++ b/react/src/translate/en.js
@@ -1,6 +1,7 @@
 export const _lang = {
   'EN': {
     'INDEX': {
+      'ADD_COIN': 'Add Coin',
       'STOP': 'Stop',
       'START': 'Start',
       'UPDATE_UTXO': 'Update UTXO',
@@ -15,7 +16,7 @@ export const _lang = {
       'SHOW': 'Show',
       'SHOWING': 'Showing',
       'OF': 'of',
-      'TO': 'to',
+      'TO_ALT': 'to',
       'SEARCH': 'Search',
       'PREVIOUS': 'Previous',
       'NEXT': 'Next',
@@ -349,7 +350,10 @@ export const _lang = {
       'FAILED_TO_ADDCOIN': 'Failed to add iguana coin',
       'FAILED_SHEPHERD_HERD': 'Failed to get execute shepherd herd',
       'COIN_SELECTION': 'Coin Selection',
-      'SELECTION_NOT_FOUND': 'Local coin list is not found'
+      'SELECTION_NOT_FOUND': 'Local coin list is not found',
+      'LOCAL_UTXO_UPDATED': 'Local UTXO data is updated. Ready to send new transaction.',
+      'PROCESSING_UTXO': 'Processing UTXO',
+      'AWAITING_TX_RESP': 'Awaiting transaction data response'
     },
     'COIN_WALLETS': {
       'TX_FAILED': 'Transaction Failed',
@@ -397,6 +401,24 @@ export const _lang = {
       'SAVE_APP_CONFIG': 'Save app config',
       'CONFIG_RESTART_REQUIRED': 'Most changes to app config require wallet restart!',
       'APP_CONFIG': 'App Config',
+      'APP_INFO': 'App Info',
+      'APP_RELEASE': 'App Release',
+      'NAME': 'Name',
+      'VERSION': 'Version',
+      'SYS_INFO': 'System Info',
+      'ARCH': 'Architecture',
+      'OS_TYPE': 'OS Type',
+      'OS_PLATFORM': 'OS Platfrom',
+      'OS_RELEASE': 'OS Release',
+      'CPU': 'CPU',
+      'CPU_CORES': 'CPU Cores',
+      'MEM': 'Memory',
+      'LOCATIONS': 'Locations',
+      'CACHE': 'Cache',
+      'CONFIG': 'Config',
+      'BIN': 'Bin',
+      'DIR': 'Dir',
+      'ADD_PEER_IP': 'Add Peer IP'
     },
     'TX_INFO': {
       'ADDRESS': 'address',
@@ -418,7 +440,13 @@ export const _lang = {
       'AWAITING': 'Awaiting in queue',
       'PROCESSING': 'Processing',
       'ERROR_CODE': 'Error Code',
-      'WAITING': 'Waiting'
+      'WAITING': 'Waiting',
+      'PROCESSING_TRANSACTION': 'Processing transaction',
+      'NOTE_IT_WILL_TAKE': 'Note: it may take a few minutes to complete the transaction',
+      'SEND_VIA': 'Send via',
+      'ENTER_AN_ADDRESS': 'Enter an address',
+      'YOU_PICKED_OPT': 'You picked option',
+      'PLEASE_WAIT': 'Please wait'
     }
   }
 };
\ No newline at end of file