fix: react pt-3.

examples/react/src/App.js

@@ -1,9 +1,9 @@
 import React from "react";
 import Phoenix from "phoenix";
-import { web3, MyContract, onWeb3Available } from "./ethService";
 import { scan } from 'rxjs/operators';
-
 import MyComponentObserver from "./MyComponentObserver";
+import web3 from './web3';
+import MyContract from './MyContract';
 
 let MyContractInstance;
 
@@ -12,13 +12,12 @@ class App extends React.Component {
     myEventObservable$: null
   };
 
-  componentDidMount() {
+  async componentDidMount() {
-    // Verify if web3 connection is available
+    MyContractInstance = await MyContract.getInstance(); //
-    onWeb3Available(async () => {
-      MyContractInstance = await MyContract.deploy().send({ from: web3.eth.defaultAccount });
 
     const eventSyncer = new Phoenix(web3.currentProvider);
-      eventSyncer.init().then(() => {
+    await eventSyncer.init();
+    
     const myEventObservable$ = eventSyncer.trackEvent(MyContractInstance, "MyEvent", {filter: {}, fromBlock: 1 });
 
     // If you want to return all the events in an array, you can pipe the scan operator to the observable
@@ -27,8 +26,6 @@ class App extends React.Component {
     // Your observable component would receive the eventData as an array instead of an object
 
     this.setState({ myEventObservable$ });
-      });
-    });
   }
 
   createTrx = () => {

examples/react/src/MyContract.js

@@ -1,37 +1,4 @@
-import Web3 from 'web3';
+import web3 from './web3';
-
-export const web3 = new Web3("ws://localhost:8545");
-
-let web3AvailableCB;
-export const onWeb3Available = (cb) => {
-  web3AvailableCB = cb;
-}
-
-web3.eth.getAccounts().then(async accounts => {
-  web3.eth.defaultAccount = accounts[0];
-  if(web3AvailableCB){
-    web3AvailableCB();
-  }
-  /*SimpleStorageContract.deploy().send({ from: web3.eth.defaultAccount }).then(instance => {
-    SimpleStorage = instance;
-  });*/
-});
-
-
-
-// pragma solidity ^0.5.0;
-//
-// contract MyContract {
-//     event MyEvent(uint someValue, bytes32 anotherValue);
-//    
-//     function myFunction() public {
-//         uint a = block.timestamp * block.number; // Just to have a pseudo random value
-//         bytes32 b = keccak256(abi.encodePacked(a));
-//        
-//         emit MyEvent(a, b);
-//     }
-// }
-
 
 const abi = [
 	{
@@ -64,4 +31,14 @@ const abi = [
 
 const data = "0x6080604052348015600f57600080fd5b5060f38061001e6000396000f3fe6080604052600436106039576000357c010000000000000000000000000000000000000000000000000000000090048063c3780a3a14603e575b600080fd5b348015604957600080fd5b5060506052565b005b60004342029050600081604051602001808281526020019150506040516020818303038152906040528051906020012090507fc3d6130248b5b68a864c047b2f68d895d420924130388d02d64b648005fe9ac78282604051808381526020018281526020019250505060405180910390a1505056fea165627a7a72305820613e35c5d1e8684ef5b31a7d993a139f1b5bbb409039d92db0fe78ed571d2ce20029";
 
-export const MyContract = new web3.eth.Contract(abi, {data, gas: "470000"});
+const MyContract = new web3.eth.Contract(abi, {data, gas: "470000"});
+
+MyContract.getInstance = async() => {
+	if(!web3.eth.defaultAccount){
+		const accounts = await web3.eth.getAccounts();
+		web3.eth.defaultAccount = accounts[0];
+	}
+	return MyContract.deploy().send({from: web3.eth.defaultAccount});
+}
+
+export default MyContract;

examples/react/src/web3.js

@@ -0,0 +1,5 @@
+import Web3 from 'web3';
+
+const web3 = new Web3("ws://localhost:8545");
+
+export default web3;