From 7380ebf2fab055c98245cfd54efaf0e0d07b87df Mon Sep 17 00:00:00 2001 From: Petr Balashov Date: Mon, 3 Apr 2017 17:04:18 +0200 Subject: [PATCH] added dashboard components #2 --- react/src/actions/actionCreators.js | 40 +++++- react/src/components/app/app.js | 2 + react/src/components/dashboard/coinTile.js | 8 -- .../src/components/dashboard/coinTileItem.js | 4 +- react/src/components/dashboard/dashboard.js | 12 +- react/src/components/dashboard/navbar.js | 27 +++- .../components/dashboard/walletsBalance.js | 122 +++++++++--------- .../dashboard/walletsBasiliskRefresh.js | 34 +++-- .../src/components/dashboard/walletsHeader.js | 108 ++++++++++++++++ react/src/components/dashboard/walletsNav.js | 20 +-- react/src/reducers/activeCoin.js | 16 +++ react/src/reducers/dashboard.js | 16 +++ react/src/reducers/index.js | 5 +- react/www/index.html | 2 +- 14 files changed, 298 insertions(+), 118 deletions(-) create mode 100644 react/src/components/dashboard/walletsHeader.js create mode 100644 react/src/reducers/activeCoin.js create mode 100644 react/src/reducers/dashboard.js diff --git a/react/src/actions/actionCreators.js b/react/src/actions/actionCreators.js index 077bdfd..571591b 100644 --- a/react/src/actions/actionCreators.js +++ b/react/src/actions/actionCreators.js @@ -7,6 +7,8 @@ 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'; +export const DASHBOARD_SECTION_CHANGE = 'DASHBOARD_SECTION_CHANGE'; +export const DASHBOARD_ACTIVE_COIN_CHANGE = 'DASHBOARD_ACTIVE_COIN_CHANGE'; function triggerToaster(display, message, title, _type) { return { @@ -48,11 +50,37 @@ function iguanaWalletPassphraseState(json, dispatch) { function iguanaActiveHandleState(json) { return { type: ACTIVE_HANDLE, - isLoggedIn: JSON.parse(sessionStorage.getItem('IguanaActiveAccount')).pubkey === json.pubkey && json.status === 'unlocked' ? true : false, + isLoggedIn: sessionStorage.getItem('IguanaActiveAccount') && JSON.parse(sessionStorage.getItem('IguanaActiveAccount')).pubkey === json.pubkey && json.status === 'unlocked' ? true : false, handle: json, } } +function dashboardChangeSectionState(sectionName) { + return { + type: DASHBOARD_SECTION_CHANGE, + activeSection: sectionName, + } +} + +export function dashboardChangeSection(sectionName) { + return dispatch => { + dispatch(dashboardChangeSectionState(sectionName)); + } +} + +function dashboardChangeActiveCoinState(coin) { + return { + type: DASHBOARD_SECTION_CHANGE, + coin: coin, + } +} + +export function dashboardChangeActiveCoin(coin) { + return dispatch => { + dispatch(dashboardChangeSectionState(coin)); + } +} + export function toggleAddcoinModal(display, isLogin) { return dispatch => { dispatch(toggleAddcoinModalState(display, isLogin)); @@ -117,14 +145,14 @@ export function shepherdHerd(coin, mode, path) { export function addCoinResult(coin, mode) { const modeToValue = { - 'full': 1, - 'basilisk': 0, - 'native': -1, + '1': 'full', + '0': 'basilisk', + '-1': 'native' }; + console.log('mode', mode); return dispatch => { - dispatch(triggerToaster(true, coin + ' ' + translate('TOASTR.COIN_STARTED') + modeToValue[mode] + ' ' + translate('TOASTR.MODE'), translate('TOASTR.COIN_NOTIFICATION'), 'success')); - dispatch(getDexCoins()); + dispatch(triggerToaster(true, coin + ' ' + translate('TOASTR.STARTED_IN') + ' ' + modeToValue[mode] + ' ' + translate('TOASTR.MODE'), translate('TOASTR.COIN_NOTIFICATION'), 'success')); } } diff --git a/react/src/components/app/app.js b/react/src/components/app/app.js index 2f23c36..27dff68 100644 --- a/react/src/components/app/app.js +++ b/react/src/components/app/app.js @@ -8,6 +8,8 @@ function mapStateToProps(state) { toaster: state.toaster, AddCoin: state.AddCoin, Main: state.Main, + Dashboard: state.Dashboard, + ActiveCoin: state.ActiveCoin, }; } diff --git a/react/src/components/dashboard/coinTile.js b/react/src/components/dashboard/coinTile.js index fbf4e33..294e235 100644 --- a/react/src/components/dashboard/coinTile.js +++ b/react/src/components/dashboard/coinTile.js @@ -344,14 +344,6 @@ class CoinTile extends React.Component { ); } - /*openDropMenu() { - this.setState(Object.assign({}, this.state, { - openDropMenu: !this.state.openDropMenu, - })); - - console.log(this.state); - }*/ - render() { return (
diff --git a/react/src/components/dashboard/coinTileItem.js b/react/src/components/dashboard/coinTileItem.js index 84a99dc..81d6313 100644 --- a/react/src/components/dashboard/coinTileItem.js +++ b/react/src/components/dashboard/coinTileItem.js @@ -1,5 +1,7 @@ import React from 'react'; import { translate } from '../../translate/translate'; +import { dashboardChangeSection, toggleAddcoinModal } from '../../actions/actionCreators'; +import Store from '../../store'; class CoinTileItem extends React.Component { render() { @@ -8,7 +10,7 @@ class CoinTileItem extends React.Component { return (
-
+
  • - + this.dashboardChangeSection('wallets')}> {translate('INDEX.WALLETS')}
  • - + this.dashboardChangeSection('edex')}> EasyDEX
  • - + this.dashboardChangeSection('jumblr')}> Jumblr
  • - + this.dashboardChangeSection('atomic')}> Atomic Explorer
  • @@ -92,12 +105,12 @@ class Navbar extends React.Component {
    • - + this.dashboardChangeSection('settings')}> {translate('INDEX.SETTINGS')}
    • - + this.dashboardChangeSection('about')}> {translate('INDEX.ABOUT_IGUANA')}
    • diff --git a/react/src/components/dashboard/walletsBalance.js b/react/src/components/dashboard/walletsBalance.js index 0c50201..192ca3c 100644 --- a/react/src/components/dashboard/walletsBalance.js +++ b/react/src/components/dashboard/walletsBalance.js @@ -1,91 +1,89 @@ import React from 'react'; import { translate } from '../../translate/translate'; -className WalletsBalance extends React.Component { +class WalletsBalance extends React.Component { render() { - return ( -
      -
      + if (this.props && this.props.coin) { + return ( +
      - +
      + - -
      -
      - -
      -
      -
      -
      -
      - +
      +
      +
      +
      +
      +
      + {translate('INDEX.BALANCE')} +
      + + +
      - - -
      - -
      -