Now that we have a working contract instance, we can work on the required functionality for the index file so that we are keeping the functionality contained inside smaller components as shown in the following code:
- Implement the displayProducts() function to display products sorted by properties:
async displayProducts() { let productsHtml = [] if(this.state.products.length == 0) { productsHtml = ( <div key="0" className="center">There are no products yet...</div> ) } await this.state.products.asyncForEach(product => { productsHtml.push(( <div key={product.id} className="product"> <img className="product-image" src={product.image} /> <div className="product-data"> <h3 className="product-title">{product.title}</h3> ...