import React, { Component } from "react";
import SimpleStorageContract from "./data/SimpleStorage.json";
import getWeb3 from "../../client/src/utils/getWeb3";
import truffleContract from "truffle-contract";

import "./App.css";

class App extends Component {
  state = { storageValue: 0, web3: null, accounts: null, contract: null };

  componentDidMount = async () => {
    try {
      const web3 = await getWeb3();
      const accounts = await web3.eth.getAccounts();
      const Contract = truffleContract(SimpleStorageContract);
      Contract.setProvider(web3.currentProvider);
      const instance = await Contract.deployed();
      this.setState({ web3, accounts, contract: instance }, this.runExample);
    } catch (error) {
      alert(`Failed to load web3, accounts, or contract. Check console for details.`);
      console.log(error);
    }
  };

  runExample = async () => {
    const { accounts, contract } = this.state;
    await contract.set(5, { from: accounts[0] });
    const response = await contract.get();
    this.setState({ storageValue: response.toNumber() });
  };

  render() { ... snipped ... }
}

export default App;