Adding progress bar, fixing progress code, preparing for splitting files.

torrent-project/src/progressBarCell.js

@@ -0,0 +1,40 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { TableCell } from 'material-ui';
+import { withStyles } from 'material-ui/styles';
+
+const styles = theme => ({
+  progressBarCell: {
+    paddingLeft: theme.spacing.unit,
+    paddingRight: theme.spacing.unit,
+    borderBottom: `1px solid ${theme.palette.text.lightDivider}`,
+  },
+  progressBar: {
+    backgroundColor: theme.palette.primary[300],
+    float: 'left',
+    height: theme.spacing.unit,
+  },
+});
+
+export const ProgressBarCellBase = ({ value, classes, style }) => (
+  <TableCell
+    className={classes.progressBarCell}
+    style={style}
+  >
+    <div
+      className={classes.progressBar}
+      style={{ width: `${value}%` }}
+      title={`${value.toFixed(1)}%`}
+    />
+  </TableCell>
+);
+ProgressBarCellBase.propTypes = {
+  value: PropTypes.number.isRequired,
+  classes: PropTypes.object.isRequired,
+  style: PropTypes.object,
+};
+ProgressBarCellBase.defaultProps = {
+  style: {},
+};
+
+export const ProgressBarCell = withStyles(styles, { name: 'ProgressBarCell' })(ProgressBarCellBase);