Make tokenreg dapp fast again (#3474)

* Using proper TokenReg Instance in TokenReg dApp #3371

* remove unnecessary logs in tokereg dapp

* Improved Redux managment in TokeReg dApp #3371

* Fixfing linting

js/src/contracts/contracts.js

@@ -18,6 +18,7 @@ import DappReg from './dappreg';
 import Registry from './registry';
 import SignatureReg from './signaturereg';
 import TokenReg from './tokenreg';
+import GithubHint from './githubhint';
 
 let instance = null;
 
@@ -30,6 +31,7 @@ export default class Contracts {
     this._dappreg = new DappReg(api, this._registry);
     this._signaturereg = new SignatureReg(api, this._registry);
     this._tokenreg = new TokenReg(api, this._registry);
+    this._githubhint = new GithubHint(api, this._registry);
   }
 
   get registry () {
@@ -48,6 +50,10 @@ export default class Contracts {
     return this._tokenreg;
   }
 
+  get githubHint () {
+    return this._githubhint;
+  }
+
   static create (api) {
     return new Contracts(api);
   }

js/src/contracts/githubhint.js

@@ -0,0 +1,32 @@
+// Copyright 2015, 2016 Ethcore (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/>.
+
+export default class GithubHint {
+  constructor (api, registry) {
+    this._api = api;
+    this._registry = registry;
+
+    this.getInstance();
+  }
+
+  getContract () {
+    return this._registry.getContract('githubhint');
+  }
+
+  getInstance () {
+    return this.getContract().instance;
+  }
+}

js/src/contracts/registry.js

@@ -42,7 +42,7 @@ export default class Registry {
     });
   }
 
-  getContractInstance (_name) {
+  getContract (_name) {
     const name = _name.toLowerCase();
 
     return new Promise((resolve, reject) => {
@@ -54,13 +54,19 @@ export default class Registry {
       this
         .lookupAddress(name)
         .then((address) => {
-          this._contracts[name] = this._api.newContract(abis[name], address).instance;
+          this._contracts[name] = this._api.newContract(abis[name], address);
           resolve(this._contracts[name]);
         })
         .catch(reject);
     });
   }
 
+  getContractInstance (_name) {
+    return this
+      .getContract(_name)
+      .then((contract) => contract.instance);
+  }
+
   lookupAddress (_name) {
     const name = _name.toLowerCase();
     const sha3 = this._api.util.sha3(name);

js/src/contracts/tokenreg.js

@@ -22,8 +22,12 @@ export default class TokenReg {
     this.getInstance();
   }
 
+  getContract () {
+    return this._registry.getContract('tokenreg');
+  }
+
   getInstance () {
-    return this._registry.getContractInstance('tokenreg');
+    return this.getContract().instance;
   }
 
   tokenCount () {

js/src/dapps/tokenreg/Accounts/actions.js

@@ -46,8 +46,6 @@ export const loadAccounts = () => (dispatch) => {
           address
         }));
 
-      console.log('accounts', accountsList);
-
       dispatch(setAccounts(accountsList));
       dispatch(setAccountsInfo(accountsInfo));
       dispatch(setSelectedAccount(accountsList[0].address));

js/src/dapps/tokenreg/Actions/Query/query.js

@@ -42,12 +42,9 @@ export default class QueryAction extends Component {
 
     onClose: PropTypes.func.isRequired,
     handleQueryToken: PropTypes.func.isRequired,
-    handleQueryMetaLookup: PropTypes.func.isRequired,
 
     data: PropTypes.object,
-    notFound: PropTypes.bool,
-    metaLoading: PropTypes.bool,
-    metaData: PropTypes.object
+    notFound: PropTypes.bool
   }
 
   state = initState;
@@ -131,11 +128,8 @@ export default class QueryAction extends Component {
     return (
       <Token
         fullWidth
-        handleMetaLookup={ this.props.handleQueryMetaLookup }
-        isMetaLoading={ this.props.metaLoading }
-        meta={ this.props.metaData }
-        { ...data }
-        />
+        tla={ data.tla }
+      />
     );
   }
 

js/src/dapps/tokenreg/Actions/actions.js

@@ -16,8 +16,6 @@
 
 import { getTokenTotalSupply } from '../utils';
 
-const { sha3, bytesToHex } = window.parity.api.util;
-
 export const SET_REGISTER_SENDING = 'SET_REGISTER_SENDING';
 export const setRegisterSending = (isSending) => ({
   type: SET_REGISTER_SENDING,
@@ -41,8 +39,6 @@ export const registerCompleted = () => ({
 });
 
 export const registerToken = (tokenData) => (dispatch, getState) => {
-  console.log('registering token', tokenData);
-
   const state = getState();
   const contractInstance = state.status.contract.instance;
   const fee = state.status.contract.fee;
@@ -83,8 +79,6 @@ export const registerToken = (tokenData) => (dispatch, getState) => {
     })
     .then((gasEstimate) => {
       options.gas = gasEstimate.mul(1.2).toFixed(0);
-      console.log(`transfer: gas estimated as ${gasEstimate.toFixed(0)} setting to ${options.gas}`);
-
       return contractInstance.register.postTransaction(options, values);
     })
     .then((result) => {
@@ -183,34 +177,3 @@ export const queryToken = (key, query) => (dispatch, getState) => {
       dispatch(setQueryLoading(false));
     });
 };
-
-export const queryTokenMeta = (id, query) => (dispatch, getState) => {
-  console.log('loading token meta', query);
-
-  const state = getState();
-  const contractInstance = state.status.contract.instance;
-
-  const key = sha3(query);
-
-  const startDate = Date.now();
-  dispatch(setQueryMetaLoading(true));
-
-  contractInstance
-    .meta
-    .call({}, [ id, key ])
-    .then((value) => {
-      const meta = {
-        key, query,
-        value: value.find(v => v !== 0) ? bytesToHex(value) : null
-      };
-
-      dispatch(setQueryMeta(meta));
-
-      setTimeout(() => {
-        dispatch(setQueryMetaLoading(false));
-      }, 500 - (Date.now() - startDate));
-    })
-    .catch((e) => {
-      console.error('load meta query error', e);
-    });
-};

js/src/dapps/tokenreg/Actions/component.js

@@ -37,7 +37,6 @@ export default class Actions extends Component {
 
     handleQueryToken: PropTypes.func.isRequired,
     handleQueryClose: PropTypes.func.isRequired,
-    handleQueryMetaLookup: PropTypes.func.isRequired,
     query: PropTypes.object.isRequired
   };
 
@@ -82,7 +81,6 @@ export default class Actions extends Component {
           show={ this.state.show[ QUERY_ACTION ] }
           onClose={ this.onQueryClose }
           handleQueryToken={ this.props.handleQueryToken }
-          handleQueryMetaLookup={ this.props.handleQueryMetaLookup }
           { ...this.props.query } />
       </div>
     );

js/src/dapps/tokenreg/Actions/container.js

@@ -19,7 +19,7 @@ import { connect } from 'react-redux';
 
 import Actions from './component';
 
-import { registerToken, registerReset, queryToken, queryReset, queryTokenMeta } from './actions';
+import { registerToken, registerReset, queryToken, queryReset } from './actions';
 
 class TokensContainer extends Component {
 
@@ -49,9 +49,6 @@ const mapDispatchToProps = (dispatch) => {
     },
     handleQueryClose: () => {
       dispatch(queryReset());
-    },
-    handleQueryMetaLookup: (id, query) => {
-      dispatch(queryTokenMeta(id, query));
     }
   };
 };

js/src/dapps/tokenreg/Application/application.css

@@ -19,6 +19,7 @@
   display: flex;
   flex-direction: column;
   align-items: center;
+  padding-bottom: 10em;
 }
 
 .warning {

js/src/dapps/tokenreg/Status/actions.js

@@ -14,11 +14,7 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
-import {
-  registry as registryAbi,
-  tokenreg as tokenregAbi,
-  githubhint as githubhintAbi
-} from '../../../contracts/abi';
+import Contracts from '../../../contracts';
 
 import { loadToken, setTokenPending, deleteToken, setTokenData } from '../Tokens/actions';
 
@@ -34,51 +30,39 @@ export const FIND_CONTRACT = 'FIND_CONTRACT';
 export const loadContract = () => (dispatch) => {
   dispatch(setLoading(true));
 
-  api.parity
-    .registryAddress()
-    .then((registryAddress) => {
-      console.log(`registry found at ${registryAddress}`);
-      const registry = api.newContract(registryAbi, registryAddress).instance;
-
-      return Promise.all([
-        registry.getAddress.call({}, [api.util.sha3('tokenreg'), 'A']),
-        registry.getAddress.call({}, [api.util.sha3('githubhint'), 'A'])
-      ]);
-    })
-    .then(([ tokenregAddress, githubhintAddress ]) => {
-      console.log(`tokenreg was found at ${tokenregAddress}`);
-
-      const tokenregContract = api
-        .newContract(tokenregAbi, tokenregAddress);
-
-      const githubhintContract = api
-        .newContract(githubhintAbi, githubhintAddress);
+  const { tokenReg, githubHint } = new Contracts(api);
 
+  return Promise
+    .all([
+      tokenReg.getContract(),
+      githubHint.getContract()
+    ])
+    .then(([ tokenRegContract, githubHintContract ]) => {
       dispatch(setContractDetails({
-        address: tokenregAddress,
-        instance: tokenregContract.instance,
-        raw: tokenregContract
+        address: tokenRegContract.address,
+        instance: tokenRegContract.instance,
+        raw: tokenRegContract
       }));
 
       dispatch(setGithubhintDetails({
-        address: githubhintAddress,
-        instance: githubhintContract.instance,
-        raw: githubhintContract
+        address: githubHintContract.address,
+        instance: githubHintContract.instance,
+        raw: githubHintContract
       }));
 
       dispatch(loadContractDetails());
       dispatch(subscribeEvents());
     })
     .catch((error) => {
-      console.error('loadContract error', error);
+      throw error;
     });
 };
 
 export const LOAD_CONTRACT_DETAILS = 'LOAD_CONTRACT_DETAILS';
 export const loadContractDetails = () => (dispatch, getState) => {
   const state = getState();
 
-  const instance = state.status.contract.instance;
+  const { instance } = state.status.contract;
 
   Promise
     .all([
@@ -87,8 +71,6 @@ export const loadContractDetails = () => (dispatch, getState) => {
       instance.fee.call()
     ])
     .then(([accounts, owner, fee]) => {
-      console.log(`owner as ${owner}, fee set at ${fee.toFormat()}`);
-
       const isOwner = accounts.filter(a => a === owner).length > 0;
 
       dispatch(setContractDetails({
@@ -119,14 +101,14 @@ export const setGithubhintDetails = (details) => ({
 export const subscribeEvents = () => (dispatch, getState) => {
   const state = getState();
 
-  const contract = state.status.contract.raw;
+  const { raw } = state.status.contract;
   const previousSubscriptionId = state.status.subscriptionId;
 
   if (previousSubscriptionId) {
-    contract.unsubscribe(previousSubscriptionId);
+    raw.unsubscribe(previousSubscriptionId);
   }
 
-  contract
+  raw
     .subscribe(null, {
       fromBlock: 'latest',
       toBlock: 'pending',
@@ -187,7 +169,7 @@ export const subscribeEvents = () => (dispatch, getState) => {
           ));
         }
 
-        console.log('new log event', log);
+        console.warn('unknown log event', log);
       });
     })
     .then((subscriptionId) => {

js/src/dapps/tokenreg/Status/reducer.js

@@ -27,15 +27,13 @@ const initialState = {
   contract: {
     address: null,
     instance: null,
-    raw: null,
     owner: null,
     isOwner: false,
     fee: null
   },
   githubhint: {
     address: null,
-    instance: null,
-    raw: null
+    instance: null
   }
 };
 

js/src/dapps/tokenreg/Tokens/Token/index.js

@@ -14,4 +14,4 @@
 // You should have received a copy of the GNU General Public License
 // along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 
-export default from './token';
+export default from './tokenContainer';