text: 
  import React, { Component } from "react";
  import MyToken from "./contracts/MyToken.json";
  import MyTokenSale from "./contracts/MyTokenSale.json";
  import KycContract from "./contracts/KycContract.json";
  import getWeb3 from "./getWeb3";
  
  import "./App.css";
  
  class App extends Component {
    state = { loaded:false, kycAddress: "0x123...", tokenSaleAddress: null, userTokens:0 };
  
    componentDidMount = async () => {
      try {
        // Get network provider and web3 instance.
        this.web3 = await getWeb3();
  
        // Use web3 to get the user's accounts.
        this.accounts = await this.web3.eth.getAccounts();
  
        // Get the contract instance.
        this.networkId = await this.web3.eth.net.getId();
      
        this.tokenInstance = new this.web3.eth.Contract(
          MyToken.abi,
          MyToken.networks[this.networkId] && MyToken.networks[this.networkId].address,
        );
  
        this.tokenSaleInstance = new this.web3.eth.Contract(
          MyTokenSale.abi,
          MyTokenSale.networks[this.networkId] && MyTokenSale.networks[this.networkId].address,
        );
        this.kycInstance = new this.web3.eth.Contract(
          KycContract.abi,
          KycContract.networks[this.networkId] && KycContract.networks[this.networkId].address,
        );
  
        // Set web3, accounts, and contract to the state, and then proceed with an
        // example of interacting with the contract's methods.
        this.listenToTokenTransfer();
        this.setState({loaded:true, tokenSaleAddress:MyTokenSale.networks[this.networkId].address}, this.updateUserTokens);
      } catch (error) {
        // Catch any errors for any of the above operations.
        alert(
          `Failed to load web3, accounts, or contract. Check console for details.`,
        );
        console.error(error);
      }
    };
  
    updateUserTokens = async () => {
      let userTokens = await this.tokenInstance.methods.balanceOf(this.accounts[0]).call();
      this.setState({userTokens: userTokens});
    }
  
    listenToTokenTransfer = () => {
      this.tokenInstance.events.Transfer({to: this.accounts[0]}).on("data",this.updateUserTokens);
    }
  
    handleBuyTokens = async() => {
      await this.tokenSaleInstance.methods.buyTokens(this.accounts[0]).send({from: this.accounts[0], value: this.web3.utils.toWei("1","wei")});
    }
  
    handleInputChange = (event) => {
      const target = event.target;
      const value = target.type === "checkbox" ? target.checked : target.value;
      const name = target.name;
      this.setState({
        [name]: value
      });
    }
  
    handleKycWhitelisting = async () => {
      await this.kycInstance.methods.setKycCompleted(this.state.kycAddress).send({from: this.accounts[0]});
      alert("KYC for "+this.state.kycAddress+" is completed");
    }
  
    render() {
      if (!this.state.loaded) {
        return <div>Loading Web3, accounts, and contract...</div>;
      }
      return (
        <div className="App">
          <h1>StarDucks Cappucino Token Sale</h1>
          <p>Get your Tokens today!</p>
          <h2>Kyc Whitelisting</h2>
          Address to allow: <input type="text" name="kycAddress" value={this.state.kycAddress} onChange={this.handleInputChange} />
          <button type="button" onClick={this.handleKycWhitelisting}>Add to Whitelist</button>
          <h2>Buy Tokens</h2>
          <p>If you want to buy tokens, send Wei to this address: {this.state.tokenSaleAddress}</p>
          <p>You currently have: {this.state.userTokens} CAPPU Tokens</p>
          <button type="button" onClick={this.handleBuyTokens}>Buy more tokens</button>
        </div>
      );
    }
  }
  
  export default App;
  
  
  
  /* мой код 
  
  import React, { Component } from "react";
  import MyToken from "./contracts/MyToken.json";
  import MyTokenSale from "./contracts/MyTokenSale.json";
  import KycContract from "./contracts/KycContract.json"
  import getWeb3 from "./getWeb3";
  
  import "./App.css";
  //import { myToken } from "../../test/Mytoken.test";
  
  class App extends Component {
    state = { loaded:false, kycAddress: "0x123...", tokenSaleAddress:null, userTokens:0};
  
    componentDidMount = async () => {
      try {
        // Get network provider and web3 instance.
        this.web3 = await getWeb3();
  
        // Use web3 to get the user's accounts.
        this.accounts = await this.web3.eth.getAccounts();
  
        // Get the contract instance.
        this.networkId = await this.web3.eth.net.getId();
       
        this.tokenInstance = new this.web3.eth.Contract(
          MyToken.abi,
          MyToken.networks[this.networkId] && MyToken.networks[this.networkId].address,
        );  
        
        this.tokenSaleInstance = new this.web3.eth.Contract(
          MyTokenSale.abi,
          MyTokenSale.networks[this.networkId] && MyTokenSale.networks[this.networkId].address,
        );
  
        this.kycInstance = new this.web3.eth.Contract(
          KycContract.abi,
          KycContract.networks[this.networkId] && KycContract.networks[this.networkId].address,
        );
        
      
  
        // Set web3, accounts, and contract to the state, and then proceed with an
        // example of interacting with the contract's methods.
        this.listenToTokenTransfer();
        this.setState({loaded:true, tokenSaleAddress:MyTokenSale.networks[this.networkId].address}, this.updateUserTokens);
      } catch (error) {
        // Catch any errors for any of the above operations.
        alert(
          `Failed to load web3, accounts, or contract. Check console for details.`,
        );
        console.error(error);
      }
    };
    updateUserTokens = async () => {
      let userTokens = await this.tokenInstance.methods.balanceOf(this.accounts[0]).call();
      this.setState({userTokens: userTokens});
    }
    listenToTokenTransfer = async() => {
      this.tokenInstance.events.Transfer({to: this.accounts[0]}).on("data", this.updateUserTokens);
    }
  
    hanleBuyTokens =async() => {
      await this.tokenSaleInstance.methods.buyTokens(this.accounts[0]).send({from: this.accounts[0], value: this.web3.utils.toWei("1", "wei")});
    }
  
    handleInputChange = (event) => {
      const target = event.target;
      const value = target.type === "chekbox" ? target.cheked : target.value;
      const name = target.name;
      this.setState({
        [name]: value
      });
    }
  
    handleKycWitheListing = async () => {
      await this.kycInstance.methods.setKycCompleted(this.state.kycAddress).send({from: this.accounts[0]});
      alert("KYC for "+this.state.kycAddress+" is completed");
  
    }
  
    render() {
      if (!this.state.loaded) {
        return <div>Loading Web3, accounts, and contract...</div>;
      }
      return (
        <div className="App">
          <h1>StarDucks Cappuchino Token Sale</h1>
          <p>Get your tokens today</p>
          <h2>KYC Whitelistinig</h2>
  
          Address to allow: <input tipe="text" name="kycAddress" value={this.state.kycAddress} onChange={this.handleInputChange}/>
          <button type="button" onClick={this.handleKycWitheListing}>Add to white list</button>
           <h2>Buy Tokens</h2>
          <p>If you want to buy tokens, please send Wei to this address: {this.state.tokenSaleAddress}</p>
          <p>You currently have: {this.state.userTokens}</p>
          <button type="button" onClick={this.hanleBuyTokens}>Buy more tokens</button>
          </div>
         
      );
    }
  }
  
  export default App;*/
  