load txs watching erc20 transfers

apps/simple-wallet/client/src/actions/transactions.ts

@@ -5,6 +5,8 @@ import Web3 from 'web3';
 import { TransactionReceipt } from 'web3-core';
 // import { loadBalance } from './wallet';
 import { loadBlock } from './blocks';
+import { abi as keycardWalletABI } from '../contracts/KeycardWallet';
+import { addPadding } from "../utils";
 
 export const TXS_LOADING = "TXS_LOADING";
 export interface TxsLoadingAction {
@@ -83,46 +85,46 @@ export const watchPendingTransaction = (web3: Web3, dispatch: Dispatch, walletAd
   });
 }
 
-export const loadTransactions = (web3: Web3, dispatch: Dispatch, getState: () => RootState, wallet: Contract) => {
-  const state = getState();
-  const walletAddress = state.wallet.walletAddress;
-  if (walletAddress === undefined) {
-    return;
-  }
+export const loadTransactions = (web3: Web3, erc20: Contract) => {
+  return (dispatch: Dispatch, getState: () => RootState) => {
+    const state = getState();
+    const walletAddress = state.wallet.walletAddress;
+    if (walletAddress === undefined) {
+      return;
+    }
 
-  dispatch(loadingTransactions());
-  wallet.getPastEvents('allEvents', {fromBlock: 0, toBlock: 'latest'}).then((events: any) => {
-    //FIXME: add loading event
-    //FIXME: use the right type for event
-    events.forEach((event: any) => {
-      const values = event.returnValues;
-      dispatch<any>(loadBlock(event.blockNumber));
-      switch (event.event) {
-        case "TopUp":
-          dispatch(transactionDiscovered("TopUp", event.id, event.blockNumber, event.transactionHash, false, values.from, walletAddress, values.value));
-          break;
-        case "NewPaymentRequest":
-          dispatch(transactionDiscovered("NewPaymentRequest", event.id, event.blockNumber, event.transactionHash, false, walletAddress, values.to, values.amount));
-          break;
-      }
+    const wallet = new web3.eth.Contract(keycardWalletABI, walletAddress);
+    const topic = web3.utils.sha3("Transfer(address,address,uint256)");
+    const options = {
+      fromBlock: 0,
+      toBlock: "latest",
+      topics: [
+        topic,
+        null,
+        addPadding(64, walletAddress),
+      ]
+    };
+
+    erc20.getPastEvents("allEvents", options).then((events: any) => {
+      events.forEach((event: any) => {
+        const values = event.returnValues;
+        dispatch<any>(loadBlock(event.blockNumber));
+        dispatch(transactionDiscovered("TopUp", event.id, event.blockNumber, event.transactionHash, false, values.from, walletAddress, values.value));
+      });
+      dispatch(transactionsLoaded());
     });
-    dispatch(transactionsLoaded());
-  }).catch(error => {
-    //FIXME: handle error
-    console.log("error", error)
-  });
 
-  web3.eth.getBlockNumber().then((blockNumber: number) => {
-    wallet.events.TopUp({fromBlock: blockNumber}).on('data', (event: any) => {
-      const values = event.returnValues;
-      dispatch(transactionDiscovered("TopUp", event.id, event.blockNumber, event.transactionHash, true, values.from, walletAddress, values.value));
-      watchPendingTransaction(web3, dispatch, walletAddress, wallet, event.transactionHash);
-    })
+    dispatch(loadingTransactions());
 
-    wallet.events.NewPaymentRequest({fromBlock: blockNumber}).on('data', (event: any) => {
-      const values = event.returnValues;
-      dispatch(transactionDiscovered("NewPaymentRequest", event.id, event.blockNumber, event.transactionHash, true, walletAddress, values.to, values.amount));
-      watchPendingTransaction(web3, dispatch, walletAddress, wallet, event.transactionHash);
-    })
-  });
+    const filter = {
+      to: walletAddress,
+    };
+    web3.eth.getBlockNumber().then((blockNumber: number) => {
+      erc20.events.Transfer({filter: filter}).on('data', (event: any) => {
+        const values = event.returnValues;
+        dispatch(transactionDiscovered("TopUp", event.id, event.blockNumber, event.transactionHash, true, values.from, walletAddress, values.value));
+        watchPendingTransaction(web3, dispatch, walletAddress, wallet, event.transactionHash);
+      })
+    });
+  };
 }

apps/simple-wallet/client/src/actions/wallet.ts

@@ -2,7 +2,6 @@ import { Dispatch } from 'redux';
 import { RootState } from '../reducers';
 import Web3 from 'web3';
 import { abi as keycardWalletFactoryABI } from '../contracts/KeycardWalletFactory';
-import { abi as keycardWalletABI } from '../contracts/KeycardWallet';
 import { abi as erc20DetailedABI } from '../contracts/ERC20Detailed';
 import { isEmptyAddress } from '../utils';
 import { loadTransactions } from './transactions';
@@ -217,6 +216,7 @@ export const loadWallet = async (web3: Web3, dispatch: Dispatch, getState: () =>
     .then(() => dispatch<any>(loadERC20(web3, factory)))
     .then((erc20: Contract) => dispatch<any>(loadERC20Symbol(web3, erc20)))
     .then((erc20: Contract) => dispatch<any>(loadWalletBalance(web3, erc20)))
+    .then((erc20: Contract) => dispatch<any>(loadTransactions(web3, erc20)))
     .catch((err: string) => {
       console.error("global catch", err)
       return;
@@ -245,21 +245,6 @@ const loadWalletAddress = (web3: Web3, factory: Contract, keycardAddress: string
   }
 }
 
-
-//export const loadBalance = (web3: Web3, walletAddress: string, wallet: Contract) => {
-//  return async (dispatch: Dispatch) => {
-//    dispatch(loadingWalletBalance(walletAddress));
-//    try {
-//      // const balance = await web3.eth.getBalance(walletAddress);
-//      // const availableBalance = await wallet.methods.availableBalance().call();
-//      dispatch(balanceLoaded("0", "0"));
-//    } catch (err) {
-//      //FIXME: manage error
-//      console.error(err)
-//    }
-//  }
-//}
-
 const loadERC20 = (web3: Web3, factory: Contract) => {
   return async (dispatch: Dispatch) => {
     return factory.methods.currency().call().then((address: string) => {
@@ -300,6 +285,7 @@ const loadWalletBalance = (web3: Web3, erc20: Contract) => {
     dispatch(loadingWalletBalance(address));
     return erc20.methods.balanceOf(address).call().then((balance: string) => {
       dispatch(balanceLoaded(balance, balance));
+      return erc20;
     }).catch((err: string) => {
       console.error("err", err)
       throw({

apps/simple-wallet/client/src/containers/ReceiveDialog.ts

@@ -7,6 +7,7 @@ import { hideWalletQRCode } from '../actions/wallet';
 
 export interface StateProps {
   open: boolean
+  tokenSymbol: string | undefined
   address: string | undefined
   networkID: number | undefined
 }
@@ -20,6 +21,7 @@ export type Props = StateProps & DispatchProps;
 const mapStateToProps = (state: RootState): StateProps => {
   return {
     open: state.wallet.showWalletQRCode,
+    tokenSymbol: state.wallet.erc20Symbol,
     address: state.wallet.walletAddress,
     networkID: state.web3.networkID,
   }

apps/simple-wallet/client/src/utils.ts

@@ -7,3 +7,14 @@ export const compressedAddress = (a: string, padding: number = 4) => {
 export const isEmptyAddress = (a: string) =>
   a === emptyAddress;
 
+export const addPadding = (n: number, hex: string) => {
+  if (hex.startsWith("0x")) {
+    hex = hex.slice(2);
+  }
+
+  for (let i = hex.length; i < n; i++) {
+    hex = `0${hex}`;
+  }
+
+  return `0x${hex}`;
+};