github.com/shyftnetwork/go-empyrean@v1.8.3-0.20191127201940-fbfca9338f04/shyftBlockExplorerUI/src/components/table/blocks/blockRows.js (about) 1 import React, { Component } from 'react'; 2 import BlockTable from './blockTable'; 3 import classes from './table.css'; 4 import axios from "axios/index"; 5 import ErrorMessage from './errorMessage'; 6 import {API_URL} from "../../../constants/apiURL"; 7 8 class BlocksTable extends Component { 9 constructor(props) { 10 super(props); 11 this.state = { 12 data: [], 13 emptyDataSet: true 14 }; 15 } 16 17 async componentDidMount() { 18 try { 19 const response = await axios.get(`${API_URL}/get_all_blocks/`); 20 if(response.data === "\n") { 21 this.setState({emptyDataSet: true}) 22 } else { 23 this.setState({emptyDataSet: false}) 24 } 25 await this.setState({data: response.data}); 26 } catch (err) { 27 console.log(err); 28 } 29 } 30 31 render() { 32 let table; 33 34 if(this.state.emptyDataSet === false && this.state.data.length > 0 ) { 35 table = this.state.data.map((data, i) => { 36 const conversion = data.Rewards / 10000000000000000000; 37 return <BlockTable 38 key={`${data.TxHash}${i}`} 39 Hash={data.Hash} 40 Number={data.Number} 41 Coinbase={data.Coinbase} 42 AgeGet={data.AgeGet} 43 GasUsed={data.GasUsed} 44 GasLimit={data.GasLimit} 45 UncleCount={data.UncleCount} 46 TxCount={data.TxCount} 47 Reward={conversion} 48 detailBlockHandler={this.props.detailBlockHandler} 49 getBlocksMined={this.props.getBlocksMined} 50 /> 51 }); 52 } 53 54 let combinedClasses = ['responsive-table', classes.table]; 55 return ( 56 <div> 57 { 58 this.state.emptyDataSet === false && this.state.data.length > 0 ? 59 <table className={combinedClasses.join(' ')}> 60 <thead> 61 <tr> 62 <th scope="col" className={classes.thItem}> Height </th> 63 <th scope="col" className={classes.thItem}> Block Hash </th> 64 <th scope="col" className={classes.thItem}> Age </th> 65 <th scope="col" className={classes.thItem}> Txn </th> 66 <th scope="col" className={classes.thItem}> Uncles </th> 67 <th scope="col" className={classes.thItem}> Coinbase </th> 68 <th scope="col" className={classes.thItem}> GasUsed </th> 69 <th scope="col" className={classes.thItem}> GasLimit </th> 70 <th scope="col" className={classes.thItem}> Avg.GasPrice </th> 71 <th scope="col" className={classes.thItem}> Reward </th> 72 </tr> 73 </thead> 74 {table} 75 </table> 76 : <ErrorMessage /> 77 } 78 </div> 79 ); 80 } 81 } 82 export default BlocksTable;