1

I had asked this question before. I looked carefully at the exchange section, which I advised, and I think there is no problem with the exchange section. At least in my opinion there is no problem and I hardly know the cause of the problem. And I was so frustrated that I put everything in the code. If anyone can provide us with a clue to this problem, please reply to me

enter image description here

interactions.js

import Web3 from 'web3'
import {
  web3Loaded,
  web3AccountLoaded,
  tokenLoaded,
  exchangeLoaded,
  cancelledOrdersLoaded
} from './actions'
import Token from '../abis/Token.json'
import Exchange from '../abis/Exchange.json'

export const loadWeb3 = (dispatch) => {
  const web3 = new Web3(Web3.givenProvider || 'http://localhost:7545')
  dispatch(web3Loaded(web3))
  return web3
}

export const loadAccount = async (web3, dispatch) => {
  const accounts = await web3.eth.getAccounts()
  const account = accounts[0]
  dispatch(web3AccountLoaded(account))
  return account
}

export const loadToken = async (web3, networkId, dispatch) => {
    try {
        const token = new web3.eth.Contract(Token.abi, Token.networks[networkId].address)       
        dispatch(tokenLoaded(token))
        return token
    } catch (error) {
        console.log('Contract not deployed to the current network. Please select another network with Metamask.')
        return null
    }
} 

export const loadExchange = async (web3, networkId, dispatch) => {
  try {
    const exchange = new web3.eth.Contract(Exchange.abi, Exchange.networks[networkId].address)      
    dispatch(exchangeLoaded(exchange))
    return exchange
  } catch (error) {
    console.log('Contract not deployed to the current network. Please select another network with Metamask.')
    return null
  }
}
export const loadAllOrders = async (exchange, dispatch) => {
  // if (exchange) { // Make sure exchange has been defined
    // const exchange = new web3.eth.Contract(Exchange.abi, Exchange.networks[networkId].address)
     const cancelStream = await exchange.getPastEvents('Cancel', { fromBlock: 0, toBlock: 'latest' })
     // // await loadAllOrders(this.props.exchange, dispatch)
     console.log(cancelStream)
  }

Content.js

import React, { Component } from 'react'
import { connect } from 'react-redux'
import { exchangeSelector } from '../store/selectors'
import { loadAllOrders } from '../store/interactions'

class Content extends Component {
  componentWillMount() {
    this.loadBlockchainData(this.props.dispatch)
  }

  // async loadBlockchainData(exchange, dispatch) {
  async loadBlockchainData(dispatch) {
    await loadAllOrders(this.props.exchange, dispatch)
    // this.loadBlockchainData(this.props.exchange)
      // await loadAllOrders(exchange, dispatch)
  }

function mapStateToProps(state) {
  return {
    exchange: state.exchangeSelector
  }
}

export default connect(mapStateToProps)(Content)

App.js

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import Navbar from './Navbar'
import Web3 from 'web3';   
import Content from './Content'
import { connect } from 'react-redux'
// import Token from '../abis/Token.json'
import {
  loadWeb3,
  loadAccount,
  loadToken,
  loadExchange
} from '../store/interactions'
import { contractsLoadedSelector } from '../store/selectors'

class App extends Component {
  componentWillMount() {    
    this.loadBlockchainData(this.props.dispatch)
  }

async loadBlockchainData(dispatch) {
    const web3 = loadWeb3(dispatch)
    const network = await web3.eth.net.getNetworkType()
    const networkId = await web3.eth.net.getId()
    const accounts = await loadAccount(web3, dispatch)
    const token = await loadToken(web3, networkId, dispatch)
    if(!token) {
      window.alert('Token smart contract not detected on the current network. Please select another network with Metamask.')
      return
    }
    const exchange = await loadExchange(web3, networkId, dispatch)
    if(!exchange) {
      window.alert('Exchange smart contract not detected on the current network. Please select another network with Metamask.')
      return
    }
  }

  render() {
    return (
      <div>
      <Navbar />
        { this.props.contractsLoaded ? <Content /> : <div className="content"></div> }
           </div>
           );
         }
       }

function mapStateToProps(state) {
  return {
    contractsLoaded: contractsLoadedSelector(state)
  }
}

export default connect(mapStateToProps)(App);
3
  • I think those methods need WebSocket and not Http connection, but im 100% not sure.
    – Majd TL
    Oct 16, 2019 at 12:42
  • From your error message you are trying to use exchange before it is assigned a value. This is related to Ethereum but how your events are being dispatched. Also you have two different loadBlockchainData, are you sure you are calling the right one?
    – Ismael
    Oct 16, 2019 at 16:28
  • Well, thank you for all the comment. I will try hard. Oct 17, 2019 at 1:52

1 Answer 1

1

I solved the issue by:

  1. Checking Ganache UI for the 'Current Block' number.
  2. Pasting that number in as a replacement for 'toBlock: 'Latest'}' in the interactions.js file.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.