added dashboard components

react/src/actions/actionCreators.js

@@ -4,6 +4,9 @@ import { translate } from '../translate/translate';
 
 export const TOASTER_MESSAGE = 'TOASTER_MESSAGE';
 export const DISPLAY_ADDCOIN_MODAL = 'DISPLAY_ADDCOIN_MODAL';
+export const GET_ACTIVE_COINS = 'GET_ACTIVE_COINS';
+export const LOGIN = 'LOGIN';
+export const ACTIVE_HANDLE = 'ACTIVE_HANDLE';
 
 function triggerToaster(display, message, title, _type) {
   return {
@@ -23,6 +26,33 @@ function toggleAddcoinModalState(display, isLogin) {
   }
 }
 
+function dashboardCoinsState(json) {
+  return {
+    type: GET_ACTIVE_COINS,
+    coins: json,
+    activeCoins: Object.keys(json.native).length || Object.keys(json.basilisk).length || Object.keys(json.full).length ? true : false
+  }
+}
+
+function iguanaWalletPassphraseState(json, dispatch) {
+  console.log('passp', json);
+  sessionStorage.setItem('IguanaActiveAccount', JSON.stringify(json));
+  dispatch(triggerToaster(true, translate('TOASTR.LOGIN_SUCCESSFULL'), translate('TOASTR.ACCOUNT_NOTIFICATION'), 'success'));
+
+  return {
+    type: LOGIN,
+    isLoggedIn: json && json.pubkey ? true : false,
+  }
+}
+
+function iguanaActiveHandleState(json) {
+  return {
+    type: ACTIVE_HANDLE,
+    isLoggedIn: JSON.parse(sessionStorage.getItem('IguanaActiveAccount')).pubkey === json.pubkey && json.status === 'unlocked' ? true : false,
+    handle: json,
+  }
+}
+
 export function toggleAddcoinModal(display, isLogin) {
   return dispatch => {
     dispatch(toggleAddcoinModalState(display, isLogin));
@@ -93,8 +123,8 @@ export function addCoinResult(coin, mode) {
   };
 
   return dispatch => {
-    //dispatch(shepherdGetConfig(coin, mode));
-    dispatch(triggerToaster(true, coin + ' ' + translate('TOASTR.COIN_STARTED') + modeToValue[defaultMode] + ' ' + translate('TOASTR.MODE'), translate('TOASTR.COIN_NOTIFICATION'), 'success'));
+    dispatch(triggerToaster(true, coin + ' ' + translate('TOASTR.COIN_STARTED') + modeToValue[mode] + ' ' + translate('TOASTR.MODE'), translate('TOASTR.COIN_NOTIFICATION'), 'success'));
+    dispatch(getDexCoins());
   }
 }
 
@@ -115,3 +145,101 @@ export function shepherdGetConfig(coin, mode) {
     .then(json => dispatch(shepherdHerd(coin, mode, json)));
   }
 }
+
+export function getDexCoins() {
+  return dispatch => {
+    return fetch('http://127.0.0.1:7778', {
+      method: 'POST',
+      //mode: 'no-cors'
+      body: JSON.stringify({
+        'userpass': 'tmpIgRPCUser@' + sessionStorage.getItem('IguanaRPCAuth'),
+        'agent': 'InstantDEX',
+        'method': 'allcoins',
+      })
+    })
+    .catch(function(error) {
+      console.log(error);
+      dispatch(triggerToaster(true, 'Error getDexCoins', 'Error', 'error'))
+
+    })
+    .then(response => response.json())
+    .then(json => dispatch(dashboardCoinsState(json)));
+  }
+}
+
+function rpcErrorHandler(json, dispatch) {
+  console.log('json', json);
+  if (json && json.error) {
+    if (json.error === 'bitcoinrpc needs coin that is active') {
+      dispatch(triggerToaster(true, 'No active coin', translate('TOASTR.SERVICE_NOTIFICATION'), 'error'));
+    }
+  }
+}
+
+export function iguanaWalletPassphrase(_passphrase) {
+  return dispatch => {
+    return fetch('http://127.0.0.1:7778', {
+      method: 'POST',
+      body: JSON.stringify({
+        'userpass': 'tmpIgRPCUser@' + sessionStorage.getItem('IguanaRPCAuth'),
+        'handle': '',
+        'password': _passphrase,
+        'timeout': '2592000',
+        'agent': 'bitcoinrpc',
+        'method': 'walletpassphrase'
+      }),
+    })
+    .catch(function(error) {
+      console.log(error);
+      dispatch(triggerToaster(true, 'Error iguanaWalletPassphrase', 'Error', 'error'))
+    })
+    .then(response => response.json())
+    .then(json => dispatch(iguanaWalletPassphraseState(json, dispatch)));
+  }
+}
+
+export function iguanaActiveHandle() {
+  return dispatch => {
+    return fetch('http://127.0.0.1:7778', {
+      method: 'POST',
+      body: JSON.stringify({
+        'userpass': 'tmpIgRPCUser@' + sessionStorage.getItem('IguanaRPCAuth'),
+        'agent': 'SuperNET',
+        'method': 'activehandle'
+      }),
+    })
+    .catch(function(error) {
+      console.log(error);
+      dispatch(triggerToaster(true, 'Error iguanaActiveHandle', 'Error', 'error'))
+    })
+    .then(response => response.json())
+    .then(json => dispatch(iguanaActiveHandleState(json)));
+  }
+}
+
+/*function Shepherd_SysInfo() {
+  return new Promise((resolve) => {
+    $.ajax({
+      type: 'GET',
+      url: 'http://127.0.0.1:17777/shepherd/sysinfo',
+      contentType: 'application/json' // send as JSON
+    })
+    .done(function(data) {
+      resolve(data);
+    });
+  });
+}
+
+function Shepherd_SendPendValue() {
+  Shepherd_SysInfo().then(function(result){
+    var ram_data = formatBytes(result.totalmem_bytes)
+    var pend_val = null;
+    if (ram_data.size === 'GB') {
+      if (ram_data.ramsize >= '63' ) { pend_val = 16; }
+      if (ram_data.ramsize >= '31' ) { pend_val = 8; }
+      if (ram_data.ramsize >= '15' ) { pend_val = 4; }
+      if (ram_data.ramsize <= '15' ) { pend_val = 1; }
+    } else { pend_val = 1; }
+    sessionStorage.setItem('IguanaPendValue', pend_val);
+  })
+}*/

react/src/components/app/app.js

@@ -7,6 +7,7 @@ function mapStateToProps(state) {
   return {
     toaster: state.toaster,
     AddCoin: state.AddCoin,
+    Main: state.Main,
   };
 }
 

react/src/components/dashboard/coinTile.js

@@ -0,0 +1,391 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+import CoinTileItem from './coinTileItem';
+
+class CoinTile extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+    };
+    this.renderTiles = this.renderTiles.bind(this);
+  }
+
+  renderTiles() {
+    const modes = [
+      'native',
+      'basilisk',
+      'full'
+    ];
+    const allCoins = this.props.Main.coins;
+    var items = [];
+    console.log('tiles', this.props.Main.coins);
+
+    if (this.props.Main && this.props.Main.coins) {
+      modes.map(function(mode) {
+        allCoins[mode].map(function(coin) {
+          console.log(coin);
+          var coinlogo = '',
+              coinname = '',
+              modecode = '',
+              modetip = '',
+              modecolor = '';
+
+          switch (mode) {
+            case 'native':
+              modecode = 'Native';
+              modetip = 'Native';
+              modecolor = 'primary';
+              break;
+            case 'basilisk':
+              modecode = 'Basilisk';
+              modetip = 'Basilisk';
+              modecolor = 'info';
+              break;
+            case 'full':
+              modecode = 'Full';
+              modetip = 'Full';
+              modecolor = 'success';
+              break;
+            case 'virtual':
+              modecode = 'Virtual';
+              modetip = 'Virtual';
+              modecolor = 'danger';
+              break;
+            case 'notarychains':
+              modecode = 'Notarychains';
+              modetip = 'Notarychains';
+              modecolor = 'dark';
+              break;
+          }
+
+          switch (coin) {
+            case 'BTC':
+              coinlogo = 'bitcoin';
+              coinname = 'Bitcoin';
+              break;
+            case 'BTCD':
+              coinlogo = 'bitcoindark';
+              coinname = 'BitcoinDark';
+              break;
+            case 'LTC':
+              coinlogo = 'litecoin';
+              coinname = 'Litecoin';
+              break;
+            case 'VPN':
+              coinlogo = 'vpncoin';
+              coinname = 'VPNcoin';
+              break;
+            case 'SYS':
+              coinlogo = 'syscoin';
+              coinname = 'Syscoin';
+              break;
+            case 'ZEC':
+              coinlogo = 'zcash';
+              coinname = 'Zcash';
+              break;
+            case 'NMC':
+              coinlogo = 'namecoin';
+              coinname = 'Namecoin';
+              break;
+            case 'DEX':
+              coinlogo = 'dex';
+              coinname = 'InstantDEX';
+              break;
+            case 'DOGE':
+              coinlogo = 'dogecoin';
+              coinname = 'Dogecoin';
+              break;
+            case 'DGB':
+              coinlogo = 'digibyte';
+              coinname = 'Digibyte';
+              break;
+            case 'MZC':
+              coinlogo = 'mazacoin';
+              coinname = 'Mazacoin';
+              break;
+            case 'UNO':
+              coinlogo = 'unobtanium';
+              coinname = 'Unobtanium';
+              break;
+            case 'ZET':
+              coinlogo = 'zetacoin';
+              coinname = 'Zetacoin';
+              break;
+            case 'KMD':
+              coinlogo = 'komodo';
+              coinname = 'Komodo';
+              break;
+            case 'BTM':
+              coinlogo = 'bitmark';
+              coinname = 'Bitmark';
+              break;
+            case 'CARB':
+              coinlogo = 'carboncoin';
+              coinname = 'Carboncoin';
+              break;
+            case 'ANC':
+              coinlogo = 'anoncoin';
+              coinname = 'AnonCoin';
+              break;
+            case 'FRK':
+              coinlogo = 'franko';
+              coinname = 'Franko';
+              break;
+            case 'GAME':
+              coinlogo = 'GAME';
+              coinname = 'GameCredits';
+              break;
+            case 'SUPERNET':
+              coinlogo = 'SUPERNET';
+              coinname = 'SUPERNET';
+              break;
+            case 'REVS':
+              coinlogo = 'REVS';
+              coinname = 'REVS';
+              break;
+            case 'WLC':
+              coinlogo = 'WLC';
+              coinname = 'WIRELESS';
+              break;
+            case 'PANGEA':
+              coinlogo = 'PANGEA';
+              coinname = 'PANGEA';
+              break;
+            case 'JUMBLR':
+              coinlogo = 'JUMBLR';
+              coinname = 'JUMBLR';
+              break;
+            case 'BET':
+              coinlogo = 'BET';
+              coinname = 'BET';
+              break;
+            case 'CRYPTO':
+              coinlogo = 'CRYPTO';
+              coinname = 'CRYPTO';
+              break;
+            case 'HODL':
+              coinlogo = 'HODL';
+              coinname = 'HODL';
+              break;
+            case 'SHARK':
+              coinlogo = 'SHARK';
+              coinname = 'SHARK';
+              break;
+            case 'BOTS':
+              coinlogo = 'BOTS';
+              coinname = 'BOTS';
+              break;
+            case 'MGW':
+              coinlogo = 'MGW';
+              coinname = 'MultiGateway';
+              break;
+            case 'MVP':
+              coinlogo = 'MVP';
+              coinname = 'MVP Lineup';
+              break;
+            case 'KV':
+              coinlogo = 'KV';
+              coinname = 'KV';
+              break;
+            case 'CEAL':
+              coinlogo = 'CEAL';
+              coinname = 'CEAL NET';
+              break;
+            case 'MESH':
+              coinlogo = 'MESH';
+              coinname = 'SpaceMesh';
+              break;
+            case 'USD':
+              coinlogo = 'usd';
+              coinname = 'US Dollar';
+              break;
+            case 'RON':
+              coinlogo = 'RON';
+              coinname = 'Romanian Leu';
+              break;
+            case 'EUR':
+              coinlogo = 'EUR';
+              coinname = 'Euro';
+              break;
+            case 'JPY':
+              coinlogo = 'JPY';
+              coinname = 'Japanese Yen';
+              break;
+            case 'GBP':
+              coinlogo = 'GBP';
+              coinname = 'British Pound';
+              break;
+            case 'AUD':
+              coinlogo = 'AUD';
+              coinname = 'Australian Dollar';
+              break;
+            case 'CAD':
+              coinlogo = 'CAD';
+              coinname = 'Canadian Dollar';
+              break;
+            case 'CHF':
+              coinlogo = 'CHF';
+              coinname = 'Swiss Franc';
+              break;
+            case 'NZD':
+              coinlogo = 'NZD';
+              coinname = 'New Zealand Dollar';
+              break;
+            case 'CNY':
+              coinlogo = 'CNY';
+              coinname = 'Chinese Yuan';
+              break;
+            case 'RUB':
+              coinlogo = 'RUB';
+              coinname = 'Russian Ruble';
+              break;
+            case 'MXN':
+              coinlogo = 'MXN';
+              coinname = 'Mexican peso';
+              break;
+            case 'BRL':
+              coinlogo = 'BRL';
+              coinname = 'Brazilian Real';
+              break;
+            case 'INR':
+              coinlogo = 'INR';
+              coinname = 'Indian Rupee';
+              break;
+            case 'HKD':
+              coinlogo = 'HKD';
+              coinname = 'Hong Kong Dollar';
+              break;
+            case 'TRY':
+              coinlogo = 'TRY';
+              coinname = 'Turkish Lira';
+              break;
+            case 'ZAR':
+              coinlogo = 'ZAR';
+              coinname = 'South African Rand';
+              break;
+            case 'PLN':
+              coinlogo = 'PLN';
+              coinname = 'Polish Zloty';
+              break;
+            case 'NOK':
+              coinlogo = 'NOK';
+              coinname = 'Norwegian Krone';
+              break;
+            case 'SEK':
+              coinlogo = 'SEK';
+              coinname = 'Swedish Krona';
+              break;
+            case 'DKK':
+              coinlogo = 'DKK';
+              coinname = 'Danish Krone';
+              break;
+            case 'CZK':
+              coinlogo = 'CZK';
+              coinname = 'Czech Koruna';
+              break;
+            case 'HUF':
+              coinlogo = 'HUF';
+              coinname = 'Hungarian Forint';
+              break;
+            case 'ILS':
+              coinlogo = 'ILS';
+              coinname = 'Israeli Shekel';
+              break;
+            case 'KRW':
+              coinlogo = 'KRW';
+              coinname = 'Korean Won';
+              break;
+            case 'MYR':
+              coinlogo = 'MYR';
+              coinname = 'Malaysian Ringgit';
+              break;
+            case 'PHP':
+              coinlogo = 'PHP';
+              coinname = 'Philippine Peso';
+              break;
+            case 'SGD':
+              coinlogo = 'SGD';
+              coinname = 'Singapore Dollar';
+              break;
+            case 'THB':
+              coinlogo = 'THB';
+              coinname = 'Thai Baht';
+              break;
+            case 'BGN':
+              coinlogo = 'BGN';
+              coinname = 'Bulgarian Lev';
+              break;
+            case 'IDR':
+              coinlogo = 'IDR';
+              coinname = 'Indonesian Rupiah';
+              break;
+            case 'HRK':
+              coinlogo = 'HRK';
+              coinname = 'Croatian Kuna';
+              break;
+          }
+
+          items.push({
+            coinlogo,
+            coinname,
+            coin,
+            mode,
+            modecolor,
+            modetip,
+            modecode,
+          });
+        });
+      });
+    }
+
+    return (
+      items.map((item, i) =>
+        <CoinTileItem key={i} i={i} item={item} />)
+    );
+  }
+
+  /*openDropMenu() {
+    this.setState(Object.assign({}, this.state, {
+      openDropMenu: !this.state.openDropMenu,
+    }));
+
+    console.log(this.state);
+  }*/
+
+  render() {
+    return (
+      <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="panel-heading">
+              <div className="panel-actions">
+                <div className="input-search input-group-sm">
+                  <button type="submit" className="input-search-btn">
+                    <i className="icon md-search" aria-hidden="true"></i>
+                  </button>
+                  <input type="text" className="form-control" name="" placeholder="Search..." disabled />
+                </div>
+              </div>
+              <h3 className="panel-title" data-lang="INDEX.ACTIVE_COINS"></h3>
+            </div>
+          </div>
+          <div className="wallet-widgets-list" data-plugin="pageAsideScroll">
+            <div data-role="container">
+              <div data-role="content">
+                <div className="list-group row wallet-widgets-row">
+                  {this.renderTiles()}
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default CoinTile;

react/src/components/dashboard/coinTileItem.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+class CoinTileItem extends React.Component {
+  render() {
+    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="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}">
+            <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>
+            </a>
+            <div className="coin-name">{item.coinname} ({item.coinlogo})</div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default CoinTileItem;

react/src/components/dashboard/dashboard.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import Navbar from './navbar';
+import CoinTile from './coinTile';
+import EDEX from './edex';
+
+class Dashboard extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      activePage: 'wallets',
+    };
+    this.renderDashboard = this.renderDashboard.bind(this);
+  }
+
+  renderDashboard() {
+    console.log('dash');
+    return (
+      <div>
+        <Navbar {...this.props} />
+        <div className={this.state.activePage === 'wallets' ? 'show' : 'hide'}>
+          <CoinTile {...this.props} />
+        </div>
+        <div className={this.state.activePage === 'edex' ? 'show' : 'hide'}>
+          <EDEX {...this.props} />
+        </div>
+      </div>
+    );
+  }
+
+  render() {
+    if (this.props && this.props.Main && this.props.Main.isLoggedIn) {
+      return this.renderDashboard();
+    } else {
+      return null;
+    }
+  }
+}
+
+export default Dashboard;

react/src/components/dashboard/dashboard.scss

@@ -0,0 +1,3 @@
+.dashboard {
+
+}

react/src/components/dashboard/edex.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+class EDEX extends React.Component {
+  render() {
+    return (
+      <div className="page animsition" data-animsition-in="fade-in" data-animsition-out="fade-out" style={{marginLeft: '0px'}}>
+        <div className="page-content" id="section-easydex">
+          <h2>Coming Soon!</h2>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default EDEX;

react/src/components/dashboard/navbar.js

@@ -0,0 +1,120 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+class Navbar extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      openDropMenu: false,
+    };
+    this.openDropMenu = this.openDropMenu.bind(this);
+  }
+
+  openDropMenu() {
+    this.setState(Object.assign({}, this.state, {
+      openDropMenu: !this.state.openDropMenu,
+    }));
+
+    console.log(this.state);
+  }
+
+  render() {
+    return (
+      <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"
+          data-toggle="menubar">
+            <span className="sr-only">{translate('INDEX.TOGGLE_NAV')}</span>
+            <span className="hamburger-bar"></span>
+          </button>
+          <button type="button" className="navbar-toggle collapsed" data-target="#site-navbar-collapse"
+          data-toggle="collapse">
+            <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" />
+            <span className="navbar-brand-text hidden-xs"></span>
+          </div>
+          <button type="button" className="navbar-toggle collapsed" data-target="#site-navbar-search"
+          data-toggle="collapse">
+            <span className="sr-only">{translate('INDEX.TOGGLE_SEARCH')}</span>
+            <i className="icon md-search" aria-hidden="true"></i>
+          </button>
+        </div>
+        <div className="navbar-container container-fluid">
+          <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">
+                  <i className="icon hamburger hamburger-arrow-left">
+                    <span className="sr-only">{translate('INDEX.TOGGLE_MENUBAR')}</span>
+                    <span className="hamburger-bar"></span>
+                  </i>
+                </a>
+              </li>
+              <li className="active nav-top-menu">
+                <a href="javascript:void(0)" id="nav-dashboard" onClick={this.dashboard}>
+                  <i className="site-menu-icon" aria-hidden="true"></i> {translate('INDEX.WALLETS')}
+                </a>
+              </li>
+              <li className="nav-top-menu">
+                <a href="javascript:void(0)" id="nav-easydex" onClick={this.edex}>
+                  <i className="site-menu-icon" aria-hidden="true"></i> EasyDEX
+                </a>
+              </li>
+              <li className="nav-top-menu">
+                <a href="javascript:void(0)" id="nav-jumblr" onClick={this.Jumblr}>
+                  <i className="site-menu-icon" aria-hidden="true"></i> Jumblr
+                </a>
+              </li>
+              <li className="nav-top-menu">
+                <a href="javascript:void(0)" id="nav-iguana-atomic-explorer" onClick={this.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" data-edexcoinmenu="COIN" id="btn_edexcoin_addcoin" data-target="#AddCoinDilogModel" data-toggle="modal" style={{ paddingBottom: '10px', paddingTop: '16px' }}  onClick={this.toggleAddCoinModal}>
+                  <span>
+                    <img src="assets/images/icons/activatecoin.png" alt="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">
+                  <span className="avatar avatar-online">
+                    <img src="assets/images/iguana_profile_02.jpg" alt="iguana profile pic" />
+                    <i></i>
+                  </span>
+                </a>
+                <ul className="dropdown-menu" role="menu">
+                  <li role="presentation">
+                    <a href="javascript:void(0)" role="menuitem" id="nav-iguana-wallet-settings" onClick={this.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.about}>
+                      <i className="icon md-settings" 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>
+                  </li>
+                </ul>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </nav>
+    );
+  }
+}
+
+export default Navbar;

react/src/components/dashboard/walletsBalance.js

@@ -0,0 +1,92 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+className WalletsBalance extends React.Component {
+  render() {
+    return (
+      <div id="wallet-widgets" data-plugin="masonry" data-edexcoin="COIN" style={{display: 'none'}}>
+        <div className="col-xs-12">
+          <div className="col-xs-12">
+            <div role="alert" className="alert alert-info alert-dismissible" data-edexcoin="COIN" id="edexcoin-wallet-waitingrt-alert" style={{display: 'none'}}>
+              <button aria-label="Close" data-dismiss="alert" className="close" type="button">
+                <span aria-hidden="true">×</span>
+              </button>
+              <h4 data-lang="INDEX.ACTIVATING_WALLET_RT"></h4>
+              <p data-edexcoin="COIN" id="edexcoin-wallet-waitingrt-alert-text" data-lang="INDEX.IGUANA_FULL_MODE_SYNC_P1"></p>
+              <p data-lang="INDEX.IGUANA_FULL_MODE_SYNC_P2"></p>
+              <p data-lang="INDEX.IGUANA_FULL_MODE_SYNC_P3" style="font-weight: 600"></p>
+            </div>
+
+            <div role="alert" className="alert alert-info alert-dismissible" data-edexcoin="COIN" id="edexcoin-wallet-waitingcache-alert" style={{display: 'none'}}>
+              <button aria-label="Close" data-dismiss="alert" className="close" type="button">
+                <span aria-hidden="true">×</span>
+              </button>
+              <h4 data-lang="INDEX.FETCHING_COIN_DATA"></h4>
+              <p data-edexcoin="COIN" id="edexcoin-wallet-waitingcache-alert-text" data-lang="INDEX.IGUANA_FULL_MODE_SYNC_P1"></p>
+              <p data-lang="INDEX.IGUANA_FULL_MODE_SYNC_P2"></p>
+              <p data-lang="INDEX.IGUANA_FULL_MODE_SYNC_P3" style="font-weight: 600"></p>
+            </div>
+          </div>
+          <div className="col-lg-12 col-xs-12" data-edexcoin="COIN" id="edexcoin_getbalance_t">
+            <!-- EasyDEX Total Balance Widget-->
+            <div className="widget widget-shadow" id="widgetLineareaOne">
+              <div className="widget-content">
+                <div className="padding-20 padding-top-10">
+                  <div className="clearfix">
+                    <div className="pull-left padding-vertical-10">
+                      <i className="icon fa-eye font-size-24 vertical-align-bottom margin-right-5"></i><span data-lang="INDEX.BALANCE"></span>
+                    </div>
+                    <span className="pull-right padding-top-10" data-edexcoin="COIN" style="font-size: 22px">
+                      <span data-edexcoin="COIN" id="edex_total_balance"></span> <span data-edexcoin="COIN" id="edex_total_balance_coincode"></span>
+                    </span>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- End EasyDEX Total Balance Widget -->
+          </div>
+
+          <div className="col-lg-4 col-xs-12" data-edexcoin="COIN" id="edexcoin_getbalance_interest" style="display: none">
+            <!-- EasyDEX Interest Balance Widget-->
+            <div className="widget widget-shadow" id="widgetLineareaOne">
+              <div className="widget-content">
+                <div className="padding-20 padding-top-10">
+                  <div className="clearfix">
+                    <div className="pull-left padding-vertical-10">
+                      <i className="icon fa-money font-size-24 vertical-align-bottom margin-right-5"></i><span data-lang="INDEX.INTEREST_EARNED"></span>
+                    </div>
+                    <span className="pull-right padding-top-10" data-edexcoin="COIN" style="font-size: 22px">
+                      <span data-edexcoin="COIN" id="edex_interest_balance"></span> <span data-edexcoin="COIN" id="edex_total_interest_coincode"></span>
+                    </span>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- End EasyDEX Interest Balance Widget -->
+          </div>
+
+          <div className="col-lg-4 col-xs-12" data-edexcoin="COIN" id="edexcoin_getbalance_total_interest" style="display: none">
+            <!-- EasyDEX Total Balance Widget-->
+            <div className="widget widget-shadow" id="widgetLineareaOne">
+              <div className="widget-content">
+                <div className="padding-20 padding-top-10">
+                  <div className="clearfix">
+                    <div className="pull-left padding-vertical-10">
+                      <i className="icon fa-bullseye font-size-24 vertical-align-bottom margin-right-5"></i><span data-lang="INDEX.TOTAL_BALANCE"></span>
+                    </div>
+                    <span className="pull-right padding-top-10" data-edexcoin="COIN" style="font-size: 22px">
+                      <span data-edexcoin="COIN" id="edex_total_balance_interest"></span> <span data-edexcoin="COIN" id="edex_total_balance_interest_coincode"></span>
+                    </span>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- End EasyDEX Total Balance Widget -->
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default WalletsBalance;

react/src/components/dashboard/walletsBasiliskRefresh.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+className WalletsBasiliskRefresh extends React.Component {
+  render() {
+    return (
+      <div data-edexcoin="COIN" id="edexcoin_dashboard_basilisk_refresh_status" style="display: none">
+        <div class="col-xs-12 margin-top-20">
+          <div class="col-xs-12">
+            <!-- Panel Tasks -->
+            <div class="panel">
+              <div class="panel-heading">
+                <h3 class="panel-title" data-lang="INDEX.FETCHING_BASILISK_DATA"></h3>
+                <div class="panel-actions">
+                  <a class="panel-action icon md-refresh-alt" data-toggle="panel-refresh" data-load-type="blue-only" aria-hidden="true"></a>
+                </div>
+              </div>
+              <div class="table-responsive">
+                <table class="table table-hover table-striped tbl_edexcoin_dashboard_basilisk_refresh_status">
+                  <thead>
+                    <tr>
+                      <th data-lang="INDEX.ADDRESS"></th>
+                      <th data-lang="INDEX.LIST_UNSPENT"></th>
+                      <th data-lang="INDEX.LIST_TRANSACTIONS"></th>
+                      <th data-lang="INDEX.GET_BALANCE"></th>
+                      <th data-lang="INDEX.REFRESH"></th>
+                    </tr>
+                  </thead>
+                  <tbody></tbody>
+                </table>
+              </div>
+            </div>
+            <!-- End Panel Tasks -->
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default WalletsBasiliskRefresh;

react/src/components/dashboard/walletsNav.js

@@ -0,0 +1,51 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+class WalletsNav extends React.Component {
+  render() {
+    return (
+      <div className="page-main" id="section-dashboard" data-edexcoin="COIN">
+        <div className="col-xs-12 padding-top-20" id="no_wallet_selected">
+          <div className="alert alert-danger alert-dismissible agamainfo_alert" role="alert" style="display: none;">
+            <button type="button" className="close" data-dismiss="alert" aria-label="Close">
+            </button>
+            <span style="font-size:24px; text-align: center">
+              <i className="icon fa-exclamation-triangle" aria-hidden="true"></i> <span className="agamainfo_msgtitle">Custom Title</span>
+            </span>
+            <br/>
+            <span className="agamainfo_msg">Custom Message</span>.
+          </div>
+
+          <div className="alert alert-info alert-dismissible" role="alert">
+            <button type="button" className="close" data-dismiss="alert" aria-label="Close">
+            </button>
+            <span style="font-size:24px; text-align: center">
+              <i className="icon fa-paw" aria-hidden="true"></i> <span data-lang="INDEX.NO_WALLET_CAPS"></span>
+            </span>
+            <br/>
+            <span data-lang="INDEX.PLEASE_SELECT_A_WALLET"></span>.
+          </div>
+        </div>
+        <div className="page-header page-header-bordered header-easydex" id="header-dashboard" data-edexcoin="COIN" style="display: none">
+          <ol className="breadcrumb" data-edexcoin="COIN">
+            <b><span data-lang="INDEX.MY"></span> <span data-edexcoin="COIN" id="edexcoin-active">-</span> <span data-lang="INDEX.ADDRESS"></span>: </b> <span data-edexcoin="COIN" id="edexcoin_active_addr">-</span> <button className="btn btn-default btn-xs clipboard-edexaddr" data-edexcoin="COIN" id="edexcoin_active_addr_clipboard" data-clipboard-text=""><i className="icon wb-copy" aria-hidden="true"></i> <span data-lang="INDEX.COPY"></span></button>
+          </ol>
+          <div className="page-header-actions" data-edexcoin="COIN" id="edexcoin-actions">
+            <div id="kmd_header_button">
+              <button type="button" className="btn btn-dark waves-effect waves-light" data-edexcoinmenu="COIN" id="btn_edexcoin_dashboard" style="display: none">
+                <i className="icon md-view-dashboard" aria-hidden="true"></i> <span data-lang="INDEX.DASHBOARD"></span>
+              </button>
+              <button type="button" className="btn btn-primary waves-effect waves-light" data-edexcoinmenu="COIN" id="btn_edexcoin_send">
+                <i className="icon fa-send" aria-hidden="true"></i> <span data-lang="INDEX.SEND"></span>
+              </button>
+              <button type="button" className="btn btn-info waves-effect waves-light" data-edexcoinmenu="COIN" id="btn_edexcoin_recieve">
+                <i className="icon fa-inbox" aria-hidden="true"></i> <span data-lang="INDEX.RECEIVE"></span>
+              </button>
+            </div>
+          </div>
+        </div>
+    );
+  }
+}
+
+export default WalletsNav;

react/src/components/dashboard/walletsProgress.js

@@ -0,0 +1,39 @@
+import React from 'react';
+import { translate } from '../../translate/translate';
+
+class WalletsProgress extends React.Component {
+  render() {
+    return (
+      <div id="edex-footer" data-edexcoin="COIN">
+        <div className="row no-space" data-edexcoin="COIN">
+          <div data-edexcoin="COIN" id="currency-progressbars" style={{display: 'none'}}>
+            <div className="progress progress-sm">
+              <div className="progress-bar progress-bar-info progress-bar-striped active" style={{width: '0%', font-size: '80%'}} role="progressbar" data-edexcoin="COIN" id="currency-bundles">
+                <span data-lang="INDEX.BUNDLES"></span> <span data-edexcoin="COIN" id="currency-bundles-percent">0%</span>
+              </div>
+            </div>
+          </div>
+          <div data-edexcoin="COIN" id="additional-progress-bars" style={{display: 'none'}}>
+            <div className="progress progress-sm">
+              <div className="progress-bar progress-bar-warning progress-bar-striped active" style={{width: '0%', font-size: '80%'}} role="progressbar" data-edexcoin="COIN" id="currency-utxo">
+                utxo <span data-edexcoin="COIN" id="currency-utxo-percent">0%</span>
+              </div>
+            </div>
+            <div className="progress progress-sm">
+              <div className="progress-bar progress-bar-danger progress-bar-striped active" style={{width: '0%', font-size: '80%'}} role="progressbar" data-edexcoin="COIN" id="currency-balances">
+                <span data-lang="INDEX.BALANCES"></span> <span data-edexcoin="COIN" id="currency-balances-percent">0%</span>
+              </div>
+            </div>
+            <div className="progress progress-sm">
+              <div className="progress-bar progress-bar-success progress-bar-striped active" style={{width: '0%', font-size: '80%'}} role="progressbar" data-edexcoin="COIN" id="currency-validated">
+                <span data-lang="INDEX.VALIDATED"></span> <span data-edexcoin="COIN" id="currency-validated-percent">0%</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+export default WalletsProgress;

react/src/components/dummy/dummy.js

@@ -1,6 +1,6 @@
 import React from 'react';
 
-function Dummy() {
+class Dummy extends React.Component () {
   return (
   );
 }

react/src/components/login/login.js

@@ -1,119 +1,158 @@
 import React from 'react';
 import { translate } from '../../translate/translate';
-import { toggleAddcoinModal } from '../../actions/actionCreators';
+import { toggleAddcoinModal, iguanaWalletPassphrase } from '../../actions/actionCreators';
 import Store from '../../store';
 
 class Login extends React.Component {
   constructor(props) {
     super(props);
     this.state = {
-      display: true,
-      ieWarning: false,
-      login: false,
-      signup: false,
-      activateCoin: true,
+      display: false,
+      activeLoginSection: 'activateCoin',
+      loginPassphrase: null,
     };
     this.toggleActivateCoinForm = this.toggleActivateCoinForm.bind(this);
+    this.updatePassphraseLoginInput = this.updatePassphraseLoginInput.bind(this);
+    this.loginSeed = this.loginSeed.bind(this);
+  }
+
+  componentWillReceiveProps(props) {
+    console.log('loginprops', props.Main);
+    if (props && props.Main && props.Main.isLoggedIn) {
+      this.setState({
+        display: false,
+      });
+      console.log(this.state);
+    }
+    if (props && props.Main && !props.Main.isLoggedIn) {
+      this.setState({
+        display: true,
+      });
+    }
+    if (props && props.Main && props.Main.activeCoins) {
+      this.setState({
+        activeLoginSection: 'login',
+      });
+    } else {
+      this.setState({
+        activeLoginSection: 'activateCoin',
+      });
+    }
   }
 
   toggleActivateCoinForm() {
     Store.dispatch(toggleAddcoinModal(true, false));
   }
 
+  updatePassphraseLoginInput(e) {
+    this.setState({
+      [e.target.name]: e.target.value,
+    });
+  }
+
+  loginSeed() {
+    Store.dispatch(iguanaWalletPassphrase(this.state.loginPassphrase));
+    console.log(this.state);
+  }
+
   render() {
-    return (
-      <div id="wallet-login" className={this.state.display ? 'show' : 'hide'}>
-        <div className="page animsition vertical-align text-center fade-in" data-animsition-in="fade-in" data-animsition-out="fade-out">
-          <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>
+    if (this.state && this.state.display) {
+      return (
+        <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-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-ie-warning" className={this.state.ieWarning ? 'show' : 'hide'}>
-              <div className="panel">
-                <div className="panel-heading">
-                  <h3 className="panel-title">{translate('INDEX.UNSUPPORTED_BROWSER')}</h3>
-                </div>
-                <div className="alert alert-danger alert-dismissible" role="alert">
-                  <button type="button" className="close" data-dismiss="alert" aria-label="Close">
-                    <span aria-hidden="true">&times;</span>
-                    <span className="sr-only">{translate('INDEX.CLOSE')}</span>
-                  </button>
-                  {translate('INDEX.IE_UNSUPPORTED')}
-                </div>
-                <div className="panel-body">
-                  <p style={{ color: '#424242' }}>
-                    {translate('INDEX.PLEASE_USE')} <a href="https://www.google.com/chrome/">Google Chrome</a> {translate('INDEX.OR')} <a href="https://www.firefox.com">Mozilla FireFox</a> {translate('INDEX.TO_USE')} EasyDEX-GUI. {translate('INDEX.PLEASE_CLICK_ON')}.
-                  </p>
-                  <div className="col-sm-6 col-xs-6">
-                    <a href="https://www.google.com/chrome/"><img className="brand-img" src="assets/images/browsers/chrome.png" alt="Google Chrome" /></a>
+              <div id="section-ie-warning" className={this.state.activeLoginSection === 'ieWarning' ? 'show' : 'hide'}>
+                <div className="panel">
+                  <div className="panel-heading">
+                    <h3 className="panel-title">{translate('INDEX.UNSUPPORTED_BROWSER')}</h3>
                   </div>
-                  <div className="col-sm-6 col-xs-6">
-                    <a href="https://www.firefox.com"><img className="brand-img" src="assets/images/browsers/firefox.png" alt="Mozilla FireFox" /></a>
+                  <div className="alert alert-danger alert-dismissible" role="alert">
+                    <button type="button" className="close" data-dismiss="alert" aria-label="Close">
+                      <span aria-hidden="true">&times;</span>
+                      <span className="sr-only">{translate('INDEX.CLOSE')}</span>
+                    </button>
+                    {translate('INDEX.IE_UNSUPPORTED')}
+                  </div>
+                  <div className="panel-body">
+                    <p style={{ color: '#424242' }}>
+                      {translate('INDEX.PLEASE_USE')} <a href="https://www.google.com/chrome/">Google Chrome</a> {translate('INDEX.OR')} <a href="https://www.firefox.com">Mozilla FireFox</a> {translate('INDEX.TO_USE')} EasyDEX-GUI. {translate('INDEX.PLEASE_CLICK_ON')}.
+                    </p>
+                    <div className="col-sm-6 col-xs-6">
+                      <a href="https://www.google.com/chrome/"><img className="brand-img" src="assets/images/browsers/chrome.png" alt="Google Chrome" /></a>
+                    </div>
+                    <div className="col-sm-6 col-xs-6">
+                      <a href="https://www.firefox.com"><img className="brand-img" src="assets/images/browsers/firefox.png" alt="Mozilla FireFox" /></a>
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
 
-            <div id="section-login" className={this.state.login ? 'show' : 'hide'}>
-              <h4 style={{ color: '#fff' }} id="login-welcome">{translate('INDEX.WELCOME_LOGIN')}</h4>
-              <form className="login-form" autoComplete="off">
-                <div className="form-group form-material floating">
-                  <input type="password" className="form-control" name="password" id="password" />
-                  <label className="floating-label" htmlFor="inputPassword">{translate('INDEX.WALLET_SEED')}</label>
-                </div>
-                <button type="submit" className="btn btn-primary btn-block" id="loginbtn">{translate('INDEX.SIGN_IN')}</button>
-                <div className="form-group form-material floating">
-                  <button className="btn btn-lg btn-flat btn-block waves-effect" id="register-btn">{translate('INDEX.CREATE_WALLET')}</button>
-                  <button className="btn btn-lg btn-flat btn-block waves-effect" id="logint-another-wallet">{translate('INDEX.LOGIN_ANOTHER_WALLET')}</button>
-                </div>
-              </form>
-            </div>
+              <div id="section-login" className={this.state.activeLoginSection === 'login' ? 'show' : 'hide'}>
+                <h4 style={{ color: '#fff' }} id="login-welcome">{translate('INDEX.WELCOME_LOGIN')}</h4>
+                <form className="login-form" autoComplete="off">
+                  <div className="form-group form-material floating">
+                    <input type="password" className="form-control" name="loginPassphrase" id="password" onChange={this.updatePassphraseLoginInput} />
+                    <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>
+                  <div className="form-group form-material floating">
+                    <button className="btn btn-lg btn-flat btn-block waves-effect" id="register-btn">{translate('INDEX.CREATE_WALLET')}</button>
+                    <button className="btn btn-lg btn-flat btn-block waves-effect" id="logint-another-wallet">{translate('INDEX.LOGIN_ANOTHER_WALLET')}</button>
+                  </div>
+                </form>
+              </div>
 
-            <div id="section-login-addcoin-btn" className={this.state.activateCoin ? 'show' : 'hide'}>
-              <h4 style={{ color: '#fff' }} id="login-welcome">{translate('INDEX.WELCOME_PLEASE_ADD')}</h4>
-              <div className="form-group form-material floating" style={{width: '540px', margin: '30px 0'}}>
-                <button className="btn btn-lg btn-primary btn-block ladda-button" id="start-coin-login" role="menuitem" data-edexcoinmenu="COIN" data-target="#AddCoinDilogModel-login" data-toggle="modal" data-style="expand-left" data-plugin="ladda" onClick={this.toggleActivateCoinForm}><span className="ladda-label">{translate('INDEX.ACTIVATE_COIN')}</span></button>
+              <div id="section-login-addcoin-btn" className={this.state.activeLoginSection === 'activateCoin' ? 'show' : 'hide'}>
+                <h4 style={{ color: '#fff' }} id="login-welcome">{translate('INDEX.WELCOME_PLEASE_ADD')}</h4>
+                <div className="form-group form-material floating" style={{width: '540px', margin: '30px 0'}}>
+                  <button className="btn btn-lg btn-primary btn-block ladda-button" id="start-coin-login" role="menuitem" data-edexcoinmenu="COIN" data-target="#AddCoinDilogModel-login" data-toggle="modal" data-style="expand-left" data-plugin="ladda" onClick={this.toggleActivateCoinForm}><span className="ladda-label">{translate('INDEX.ACTIVATE_COIN')}</span></button>
+                </div>
               </div>
-            </div>
 
-            <div id="section-register" className={this.state.signup ? 'show' : 'hide'}>
-              <form className="register-form" role="form" autoComplete="off">
-                <h4 className="hint" style={{ color: '#fff' }}>
-                  {translate('INDEX.SELECT_SEED_TYPE')}:
-                </h4>
-                <div className="form-group form-material floating">
-                  <div className="radio-custom radio-default radio-inline">
-                    <input type="radio" id="PassPhraseOptionsIguana" value="PassPhraseOptionsIguana" name="PassPhraseOptions" checked="" />
-                    <label htmlFor="PassPhraseOptionsIguana">Iguana (256 bits)</label>
+              <div id="section-register" className={this.state.activeLoginSection === 'signup' ? 'show' : 'hide'}>
+                <form className="register-form" role="form" autoComplete="off">
+                  <h4 className="hint" style={{ color: '#fff' }}>
+                    {translate('INDEX.SELECT_SEED_TYPE')}:
+                  </h4>
+                  <div className="form-group form-material floating">
+                    <div className="radio-custom radio-default radio-inline">
+                      <input type="radio" id="PassPhraseOptionsIguana" value="PassPhraseOptionsIguana" name="PassPhraseOptions" checked="" />
+                      <label htmlFor="PassPhraseOptionsIguana">Iguana (256 bits)</label>
+                    </div>
+                    <div className="radio-custom radio-default radio-inline">
+                      <input type="radio" id="PassPhraseOptionsWaves" value="PassPhraseOptionsWaves" name="PassPhraseOptions" />
+                      <label htmlFor="PassPhraseOptionsWaves">Waves</label>
+                    </div>
+                    <div className="radio-custom radio-default radio-inline">
+                      <input type="radio" id="PassPhraseOptionsNXT" value="PassPhraseOptionsNXT" name="PassPhraseOptions" />
+                      <label htmlFor="PassPhraseOptionsNXT">NXT</label>
+                    </div>
                   </div>
-                  <div className="radio-custom radio-default radio-inline">
-                    <input type="radio" id="PassPhraseOptionsWaves" value="PassPhraseOptionsWaves" name="PassPhraseOptions" />
-                    <label htmlFor="PassPhraseOptionsWaves">Waves</label>
+                  <div className="form-group form-material floating">
+                    <textarea className="form-control placeholder-no-fix" type="text" placeholder="" name="walletseed" id="walletseed" style={{ height: '100px' }}></textarea>
+                    <label className="floating-label" htmlFor="walletseed">{translate('INDEX.WALLET_SEED')}</label>
                   </div>
-                  <div className="radio-custom radio-default radio-inline">
-                    <input type="radio" id="PassPhraseOptionsNXT" value="PassPhraseOptionsNXT" name="PassPhraseOptions" />
-                    <label htmlFor="PassPhraseOptionsNXT">NXT</label>
+                  <div className="form-group form-material floating">
+                    <textarea className="form-control placeholder-no-fix" type="text" placeholder="" name="rwalletseed" id="rwalletseed" style={{ height: '100px' }}></textarea>
+                    <label className="floating-label" htmlFor="rwalletseed">{translate('INDEX.CONFIRM_SEED')}</label>
                   </div>
-                </div>
-                <div className="form-group form-material floating">
-                  <textarea className="form-control placeholder-no-fix" type="text" placeholder="" name="walletseed" id="walletseed" style={{ height: '100px' }}></textarea>
-                  <label className="floating-label" htmlFor="walletseed">{translate('INDEX.WALLET_SEED')}</label>
-                </div>
-                <div className="form-group form-material floating">
-                  <textarea className="form-control placeholder-no-fix" type="text" placeholder="" name="rwalletseed" id="rwalletseed" style={{ height: '100px' }}></textarea>
-                  <label className="floating-label" htmlFor="rwalletseed">{translate('INDEX.CONFIRM_SEED')}</label>
-                </div>
-                <button type="submit" id="register-submit-btn" className="btn btn-primary btn-block">{translate('INDEX.REGISTER')}</button>
-                <div className="form-group form-material floating">
-                  <button className="btn btn-lg btn-flat btn-block waves-effect" id="register-back-btn">{translate('INDEX.BACK_TO_LOGIN')}</button>
-                </div>
-              </form>
+                  <button type="submit" id="register-submit-btn" className="btn btn-primary btn-block">{translate('INDEX.REGISTER')}</button>
+                  <div className="form-group form-material floating">
+                    <button className="btn btn-lg btn-flat btn-block waves-effect" id="register-back-btn">{translate('INDEX.BACK_TO_LOGIN')}</button>
+                  </div>
+                </form>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-    );
+      );
+    } else {
+      return null;
+    }
   }
 }
 

react/src/components/main/main.js

@@ -2,6 +2,8 @@ import React from 'react';
 import Config from '../../config';
 import WalletMain from './walletMain';
 import { iguanaSetRPCAuth } from '../../util/auth';
+import Store from '../../store';
+import { getDexCoins, iguanaActiveHandle } from '../../actions/actionCreators';
 
 class Main extends React.Component {
   constructor(props) {
@@ -11,13 +13,28 @@ class Main extends React.Component {
     this.loading = this.loading.bind(this);
     this.isWalletUnlocked = this.isWalletUnlocked.bind(this);
     this.state = {
-      user: false,
+      isLoggedIn: false,
+      coins: null,
+      activeCoins: false,
+      activeHandleInterval: null,
     };
   }
 
+  componentDidMount() {
+    Store.dispatch(iguanaActiveHandle());
+    var _iguanaActiveHandle = setInterval(function() {
+      Store.dispatch(iguanaActiveHandle());
+    }, 30000);
+
+    this.setState(Object.assign({}, this.state, {
+      activeHandleInterval: _iguanaActiveHandle,
+    }));
+  }
+
   componentWillMount() {
     console.log('mounting main component');
     // set userpass param
+    Store.dispatch(getDexCoins());
     iguanaSetRPCAuth();
     if (sessionStorage.getItem('session')) {
       this.setState({

react/src/components/main/walletMain.js

@@ -2,11 +2,13 @@ import React from 'react';
 import Toaster from '../toaster/toaster';
 import AddCoin from '../addcoin/addcoin';
 import Login from '../login/login';
+import Dashboard from '../dashboard/dashboard';
 
 class WalletMain extends React.Component {
   render() {
     return (
       <div>
+        <Dashboard {...this.props} />
         <AddCoin {...this.props.AddCoin} />
         <Login {...this.props} />
         <Toaster {...this.props.toaster} />

react/src/reducers/index.js

@@ -3,12 +3,13 @@ import { routerReducer } from 'react-router-redux';
 
 import { AddCoin } from './addcoin';
 import { toaster } from './toaster';
+import { Main } from './main';
 //import { loader } from './loader';
 
 const rootReducer = combineReducers({
   AddCoin,
   toaster,
-  //loader,
+  Main,
   routing: routerReducer,
 });
 

react/src/reducers/main.js

@@ -0,0 +1,26 @@
+import { GET_ACTIVE_COINS, LOGIN, ACTIVE_HANDLE } from '../actions/actionCreators'
+
+export function Main(state = {
+  isLoggedIn: false,
+  activeCoins: [],
+}, action) {
+  switch (action.type) {
+    case GET_ACTIVE_COINS:
+      return Object.assign({}, state, {
+        activeCoins: action.activeCoins,
+        coins: action.coins,
+      });
+    case LOGIN:
+      return Object.assign({}, state, {
+        isLoggedIn: action.isLoggedIn,
+      });
+    case ACTIVE_HANDLE:
+      return Object.assign({}, state, {
+        isLoggedIn: action.isLoggedIn,
+      });
+    default:
+      return state;
+  }
+}
+
+export default Main;

react/src/store.js

@@ -11,6 +11,7 @@ const loggerMiddleware = createLogger();
 const defaultState = {
   toaster: null,
   AddCoin: null,
+  Main: null,
 };
 
 const enhancers = compose(window.devToolsExtension ? window.devToolsExtension() : f => f);