Fix Token Transfer in transaction list (#6589)

* Fix Token Transfer in TX LIST

* Add TokenReg logs logging

js/src/redux/providers/tokens.js

@@ -18,8 +18,11 @@ import { updateTokensFilter } from './balancesActions';
 import { loadTokens, fetchTokens } from './tokensActions';
 import { padRight } from '~/api/util/format';
 
+import { LOG_KEYS, getLogger } from '~/config';
 import Contracts from '~/contracts';
 
+const log = getLogger(LOG_KEYS.Balances);
+
 let instance = null;
 
 export default class Tokens {
@@ -155,6 +158,8 @@ export default class Tokens {
     const { dispatch, getState } = this._store;
     const tokenIds = logs.map((log) => log.params.id.value.toNumber());
 
+    log.debug('got TokenRegistry logs', logs, tokenIds);
+
     return fetchTokens(tokenIds)(dispatch, getState)
       .then(() => updateTokensFilter()(dispatch, getState));
   }

js/src/redux/providers/tokensActions.js

@@ -155,7 +155,7 @@ export function loadTokensBasics (_tokenIndexes, options) {
   };
 }
 
-export function fetchTokens (_tokenIndexes, options = {}) {
+export function fetchTokens (_tokenIndexes) {
   const tokenIndexes = uniq(_tokenIndexes || []);
   const tokenChunks = chunk(tokenIndexes, 64);
 

js/src/ui/MethodDecoding/methodDecoding.js

@@ -23,6 +23,7 @@ import { connect } from 'react-redux';
 
 import { TypedInput, InputAddress } from '../Form';
 import MethodDecodingStore from './methodDecodingStore';
+import TokenValue from './tokenValue';
 
 import styles from './methodDecoding.css';
 
@@ -602,9 +603,10 @@ class MethodDecoding extends Component {
     const { token } = this.props;
 
     return (
-      <span className={ styles.tokenValue }>
-        { value.div(token.format).toFormat(5) }<small> { token.tag }</small>
-      </span>
+      <TokenValue
+        id={ token.id }
+        value={ value }
+      />
     );
   }
 

js/src/ui/MethodDecoding/tokenValue.js

@@ -0,0 +1,102 @@
+// Copyright 2015-2017 Parity Technologies (UK) Ltd.
+// This file is part of Parity.
+
+// Parity is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// Parity is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with Parity.  If not, see <http://www.gnu.org/licenses/>.
+
+import React, { Component, PropTypes } from 'react';
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
+
+import { fetchTokens } from '../../redux/providers/tokensActions';
+import styles from './methodDecoding.css';
+
+class TokenValue extends Component {
+  static propTypes = {
+    id: PropTypes.string.isRequired,
+    value: PropTypes.object.isRequired,
+
+    fetchTokens: PropTypes.func,
+    token: PropTypes.object
+  };
+
+  componentWillMount () {
+    const { token } = this.props;
+
+    if (!token.fetched) {
+      this.props.fetchTokens([ token.index ]);
+    }
+  }
+
+  render () {
+    const { token, value } = this.props;
+
+    if (!token.format) {
+      console.warn('token with no format', token);
+    }
+
+    const format = token.format
+      ? token.format
+      : 1;
+
+    const precision = token.format
+      ? 5
+      : 0;
+
+    const tag = token.format
+      ? token.tag
+      : 'TOKENS';
+
+    return (
+      <span className={ styles.tokenValue }>
+        { value.div(format).toFormat(precision) }<small> { tag }</small>
+      </span>
+    );
+  }
+}
+
+function mapStateToProps (initState, initProps) {
+  const { id } = initProps;
+  let token = Object.assign({}, initState.tokens[id]);
+
+  if (token.fetched) {
+    return () => ({ token });
+  }
+
+  let update = true;
+
+  return (state) => {
+    if (update) {
+      const { tokens } = state;
+      const nextToken = tokens[id];
+
+      if (nextToken.fetched) {
+        token = Object.assign({}, nextToken);
+        update = false;
+      }
+    }
+
+    return { token };
+  };
+}
+
+function mapDispatchToProps (dispatch) {
+  return bindActionCreators({
+    fetchTokens
+  }, dispatch);
+}
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(TokenValue);