{"size": 3658, "ext": "js", "max_stars_repo_path": "frontend/src/components/Ledger.js", "max_stars_repo_name": "ledgersafe/Compliafy", "max_stars_repo_stars_event_min_datetime": "2019-07-21T18:19:15.000Z", "max_stars_repo_stars_event_max_datetime": "2021-03-14T18:46:01.000Z", "max_issues_repo_path": "frontend/src/components/Ledger.js", "max_issues_repo_name": "ledgersafe/LedgerSafe", "max_issues_repo_issues_event_min_datetime": "2020-06-18T15:14:19.000Z", "max_issues_repo_issues_event_max_datetime": "2022-02-26T10:54:05.000Z", "max_forks_repo_path": "frontend/src/components/Ledger.js", "max_forks_repo_name": "ledgersafe/LedgerSafe", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 2, "max_issues_count": 10, "max_forks_count": null, "avg_line_length": 44.0722891566, "max_line_length": 133, "alphanum_fraction": 0.3501913614}
import React, { Component } from 'react';
import { Table, Button } from 'reactstrap'
import './Ledger.css'

class Ledger extends Component {
    constructor(props) {
        super(props);
        this.ledger = this.props.ledger;
        this.callForHistory = this.callForHistory.bind(this)
    }

    callForHistory(key) {
        if (!this.props.isClosed) {
            if(this.props.selectedAssetID !== null && key === this.props.selectedAssetID){
                this.props.updateCollapsible();
            }
            else{
                this.props.updateSelectedAssetID(key);
            }
        }
        else {
            this.props.updateSelectedAssetID(key);
            this.props.updateCollapsible();
        }
    }

    render() {
        console.log("Ledger rendering")
        // console.log('isClosed status:', this.props.isClosed)
        return (
            <div id="ledtable">
                <h3 style={this.props.style}>All Assets</h3>
                <div class="table-wrapper-scroll-y my-custom-scrollbar">
                    <Table responsive bordered style={this.props.style}>
                        <thead style={{ backgroundColor: '#ffffff' }}>
                            <tr>
                                <th>ID</th>
                                <th>History</th>
                                <th>Business</th>
                                <th>Type</th>
                                <th>Quantity</th>
                                <th>Manufacturer</th>
                                <th>Amount</th>
                            </tr>
                        </thead>
                        <tbody>
                            {this.props.ledger.length > 0 ? (
                                this.props.ledger.map((output, i) => {
                                    return <tr key={i} style={{ backgroundColor: '#ffffff' }}>
                                        <th className="t-id" scope="row" row={i}>{output.key}</th>
                                        <td>{<Button color="success" onClick={() => this.callForHistory(output.key)}><span role="img"
                                            aria-label={this.props.label ? this.props.label : ""}
                                            aria-hidden={this.props.label ? "false" : "true"}>
                                            🔍
                                      </span></Button>}</td>
                                        <td>{output.holder.charAt(0).toUpperCase() + output.holder.slice(1).toLowerCase()}</td>
                                        <td>{output.assetType}</td>
                                        <td>{output.quantity}</td>
                                        <td>{output.manufacturer}</td>
                                        <td>{output.amount}</td>
                                    </tr>
                                })
                            ) : (
                                    <tr style={{ backgroundColor: '#ffffff' }}>
                                        <th className="t-id" scope="row">N/A</th>
                                        <td>N/A</td>
                                        <td>N/A</td>
                                        <td>N/A</td>
                                        <td>N/A</td>
                                        <td>N/A</td>
                                        <td>N/A</td>
                                    </tr>
                                )
                            }
                        </tbody>
                    </Table>
                </div>
            </div>
        );
    }
}

export default Ledger;