<commit_before>import React from 'react';
import { palette } from 'styles/muiTheme';
import {
  Table,
  TableBody,
  TableHeader,
  TableHeaderColumn,
  TableRow,
  TableRowColumn,
} from 'material-ui/Table';
import classes from './ShipmentsTable.scss';

const moment = require('moment');

const timeFormat = 'MMM Do, h:mm a';

const styles = {
  wrapper: {
    border: `1px solid ${palette.borderColor}`,
    marginBottom: '2rem',
  },
  header: {
    fontWeight: '700',
    paddingTop: '1.5rem',
    paddingBottom: '0.5rem',
  },
  meta: {
    color: palette.textColor,
    fontSize: '0.875rem',
    fontWeight: '300',
    paddingTop: '0.5rem',
    paddingBottom: '0.5rem',
  },
};

export const ShipmentsTable = (props) => (
  <Table wrapperStyle={styles.wrapper}>
    <TableHeader displaySelectAll={false} adjustForCheckbox={false}>
      <TableRow>
        <TableHeaderColumn style={styles.meta} colSpan="5">Active Shipments ({props.shipments.length})</TableHeaderColumn>
      </TableRow>
      <TableRow>
        <TableHeaderColumn style={styles.header}>Shipment #</TableHeaderColumn>
        <TableHeaderColumn style={styles.header}>Status</TableHeaderColumn>
        <TableHeaderColumn style={styles.header}>Destination</TableHeaderColumn>
        <TableHeaderColumn style={styles.header}>Date Placed</TableHeaderColumn>
        <TableHeaderColumn style={styles.header}>Estimated Time of Arrival</TableHeaderColumn>
      </TableRow>
    </TableHeader>
    <TableBody displayRowCheckbox={false}>
      { console.log(props.shipments)}
      {props.shipments.map((shipment, i) =>
        <TableRow>
          <TableRowColumn>{shipment.id}</TableRowColumn>
          <TableRowColumn>{shipment.status}</TableRowColumn>
          <TableRowColumn>{shipment.toId}</TableRowColumn>
          <TableRowColumn>{moment(shipment.createdAt).format(timeFormat)}</TableRowColumn>
          <TableRowColumn>{moment(shipment.estimatedTimeOfArrival).format(timeFormat)}</TableRowColumn>
        </TableRow>
      )}
    </TableBody>
  </Table>
);

ShipmentsTable.propTypes = {
  shipments: React.PropTypes.array,
};

ShipmentsTable.defaultProps = {
  shipments: [],
};

export default ShipmentsTable;
<commit_msg>table rows need key<commit_after>import React from 'react';
import { palette } from 'styles/muiTheme';
import {
  Table,
  TableBody,
  TableHeader,
  TableHeaderColumn,
  TableRow,
  TableRowColumn,
} from 'material-ui/Table';
import classes from './ShipmentsTable.scss';

const moment = require('moment');

const timeFormat = 'MMM Do, h:mm a';

const styles = {
  wrapper: {
    border: `1px solid ${palette.borderColor}`,
    marginBottom: '2rem',
  },
  header: {
    fontWeight: '700',
    paddingTop: '1.5rem',
    paddingBottom: '0.5rem',
  },
  meta: {
    color: palette.textColor,
    fontSize: '0.875rem',
    fontWeight: '300',
    paddingTop: '0.5rem',
    paddingBottom: '0.5rem',
  },
};

export const ShipmentsTable = (props) => (
  <Table wrapperStyle={styles.wrapper}>
    <TableHeader displaySelectAll={false} adjustForCheckbox={false}>
      <TableRow>
        <TableHeaderColumn style={styles.meta} colSpan="5">Active Shipments ({props.shipments.length})</TableHeaderColumn>
      </TableRow>
      <TableRow>
        <TableHeaderColumn style={styles.header}>Shipment #</TableHeaderColumn>
        <TableHeaderColumn style={styles.header}>Status</TableHeaderColumn>
        <TableHeaderColumn style={styles.header}>Destination</TableHeaderColumn>
        <TableHeaderColumn style={styles.header}>Date Placed</TableHeaderColumn>
        <TableHeaderColumn style={styles.header}>Estimated Time of Arrival</TableHeaderColumn>
      </TableRow>
    </TableHeader>
    <TableBody displayRowCheckbox={false}>
      {props.shipments.map((shipment, i) =>
        <TableRow key={shipment.id}>
          <TableRowColumn>{shipment.id}</TableRowColumn>
          <TableRowColumn>{shipment.status}</TableRowColumn>
          <TableRowColumn>{shipment.toId}</TableRowColumn>
          <TableRowColumn>{moment(shipment.createdAt).format(timeFormat)}</TableRowColumn>
          <TableRowColumn>{moment(shipment.estimatedTimeOfArrival).format(timeFormat)}</TableRowColumn>
        </TableRow>
      )}
    </TableBody>
  </Table>
);

ShipmentsTable.propTypes = {
  shipments: React.PropTypes.array,
};

ShipmentsTable.defaultProps = {
  shipments: [],
};

export default ShipmentsTable;

{'fraction_non_alphanumeric': 0.13967242948134667, 'fraction_numerical': 0.009554140127388535, 'mean_word_length': 3.940449438202247, 'pattern_counts': {'":': 0, '<': 71, '<?xml version=': 0, '>': 75, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '417910', 'n_tokens_mistral': 1362, 'n_tokens_neox': 1349, 'n_words': 229}