github.com/shyftnetwork/go-empyrean@v1.8.3-0.20191127201940-fbfca9338f04/shyftBlockExplorerUI/src/components/table/transactions/blockTx.js (about) 1 import React, { Component } from 'react'; 2 import TransactionsTable from './transactionTable'; 3 import classes from './table.css'; 4 5 class BlockTransactionTable extends Component { 6 constructor(props) { 7 super(props); 8 this.state = { 9 data: [] 10 }; 11 } 12 13 render() { 14 const table = this.props.data.map((data, i) => { 15 const conversion = data.Cost / 10000000000000000000; 16 return <TransactionsTable 17 key={`${data.TxHash}${i}`} 18 age={data.Age} 19 txHash={data.TxHash} 20 blockNumber={data.BlockNumber} 21 to={data.To} 22 from={data.From} 23 value={data.Amount} 24 cost={conversion} 25 getBlockTransactions={this.props.getBlockTransactions} 26 detailTransactionHandler={this.props.detailTransactionHandler} 27 detailAccountHandler={this.props.detailAccountHandler} 28 /> 29 }) 30 31 let combinedClasses = ['responsive-table', classes.table]; 32 return ( 33 <table key={this.props.data.TxHash} className={combinedClasses.join(' ')}> 34 <thead> 35 <tr> 36 <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>TxHash</th> 37 <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Block</th> 38 <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Age</th> 39 <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>From</th> 40 <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}></th> 41 <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>To</th> 42 <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>Value</th> 43 <th scope="col" style={{fontSize: "8pt", backgroundColor: "white", color: "#4f2e7e"}}>TxFee</th> 44 </tr> 45 </thead> 46 {table} 47 </table> 48 ); 49 } 50 } 51 export default BlockTransactionTable;