github.com/shyftnetwork/go-empyrean@v1.8.3-0.20191127201940-fbfca9338f04/shyftBlockExplorerUI/src/components/table/transactions/transactionDetailsRow.js (about) 1 import React, { Component } from 'react'; 2 import classes from './table.css'; 3 4 class DetailTransactionTable extends Component { 5 6 render() { 7 let data = this.props.data 8 let combinedClasses = ['responsive-table', classes.table]; 9 const conversion = data.Cost / 10000000000000000000; 10 return ( 11 <table className={combinedClasses.join(' ')}> 12 <tbody> 13 <tr> 14 <th scope="col">TxHash:</th> 15 <td>{data.TxHash}</td> 16 </tr> 17 <tr> 18 <th scope="col">TxReceipt Status:</th> 19 <td>{data.Status}</td> 20 </tr> 21 <tr> 22 <th scope="col">Block Height:</th> 23 <td>{data.BlockNumber}</td> 24 </tr> 25 <tr> 26 <th scope="col">TimeStamp:</th> 27 <td>{data.Age}</td> 28 </tr> 29 <tr> 30 <th scope="col">From:</th> 31 <td>{data.From}</td> 32 </tr> 33 <tr> 34 <th scope="col">To:</th> 35 <td>{ `${data.IsContract}` ? `${data.ToGet} (Contract)` : `${data.ToGet}` }</td> 36 </tr> 37 <tr> 38 <th scope="col">Value:</th> 39 <td>{data.Amount}</td> 40 </tr> 41 <tr> 42 <th scope="col">Gas Limit:</th> 43 <td>{data.GasLimit}</td> 44 </tr> 45 <tr> 46 <th scope="col">Gas Used By Txn:</th> 47 <td>{data.Gas}</td> 48 </tr> 49 <tr> 50 <th scope="col">Gas Price:</th> 51 <td>{data.GasPrice}</td> 52 </tr> 53 <tr> 54 <th scope="col">Actual Tx Cost/Fee:</th> 55 <td>{conversion}</td> 56 </tr> 57 <tr> 58 <th scope="col">Nonce:</th> 59 <td>{data.Nonce}</td> 60 </tr> 61 <tr> 62 <th scope="col">Input Data:</th> 63 <td>{data.Data}</td> 64 </tr> 65 </tbody> 66 </table> 67 ); 68 } 69 } 70 export default DetailTransactionTable;