{"size": 1084, "ext": "js", "max_stars_repo_path": "react-ui/src/components/reports/tableHeaderComponent.js", "max_stars_repo_name": "princecharmx/cra-node-build", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "react-ui/src/components/reports/tableHeaderComponent.js", "max_issues_repo_name": "princecharmx/cra-node-build", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "react-ui/src/components/reports/tableHeaderComponent.js", "max_forks_repo_name": "princecharmx/cra-node-build", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 31.8823529412, "max_line_length": 94, "alphanum_fraction": 0.6153136531}
import React from 'react';
import { TableHeaderColumn, TableRow } from 'material-ui/Table';

export const TableHeaderComponent = ({ title, showYearlyView }) => (
  <TableRow displayBorder={false} style={{ backgroundColor: '#f9f9fb', textColor: 'Black' }}>
    <TableHeaderColumn
      // tooltip="Particulars"
      style={{ fontWeight: 'bold', fontSize: '15px', textColor: 'Black', textAlign: 'left' }}
    >
      {title}
    </TableHeaderColumn>
    <TableHeaderColumn
      // tooltip="Debit"
      style={{ fontWeight: 'bold', fontSize: '15px', textColor: 'Black', textAlign: 'end' }}
    >
      Debit
    </TableHeaderColumn>
    <TableHeaderColumn
      // tooltip="Credit"
      style={{ fontWeight: 'bold', fontSize: '15px', textColor: 'Black', textAlign: 'end' }}
    >
      Credit
    </TableHeaderColumn>
    {showYearlyView && (
      <TableHeaderColumn
        // tooltip="closing Balance"
        style={{ fontWeight: 'bold', fontSize: '15px', textColor: 'Black', textAlign: 'end' }}
      >
        Closing Balance
      </TableHeaderColumn>
    )}
  </TableRow>
);
