import React, { Component } from 'react'
import PropTypes from 'prop-types'
import TableRow from './TableRow/index.js'
import Button from '../../Components/Button/index.js'

export default class Table extends Component {

  static propTypes = {
    readOnly: PropTypes.bool,
    columns: PropTypes.arrayOf(PropTypes.shape({
      name: PropTypes.string.isRequired,
      type: PropTypes.string
    }).isRequired).isRequired 
  }

  static defaultProps = {
    columns: {
      name: "",
      type: "text"
    }
  }

  state = {
    addedRows: []
  }

  addRow = () => {
    const defaultValues = this.props.columns.map(() => {return ""})
    const newRow = <TableRow key={this.state.addedRows.length + 1} editing cellTypes={this.props.columns.map((column) => {return column.type})} cellValues={defaultValues} />
    this.setState((prevState) => ({
          addedRows: prevState.addedRows.concat([newRow])
        }))
  }

  render(){
    if(this.props.readOnly){
      return(
        <div>
          <TableRow 
            readOnly 
            cellValues={this.props.columns.map((column) => {return column.name})}
            cellTypes={this.props.columns.map((column) => {return column.type})}
          />
          {this.props.children}
        </div>
      )
    }else{
      return(
        <div>
          <TableRow 
            readOnly 
            cellValues={this.props.columns.map((column) => {return column.name})}
            cellTypes={this.props.columns.map((column) => {return column.type})}
          />
          {this.props.children}
          {this.state.addedRows}
          <Button
            className="round"
            buttonText="+"
            onClick={this.addRow}
          />
        </div>
      )
    }
  }

}
@@ -433,210 +433,55 @@
 stat
-ic defaultProps = %7B%0A    columns: %7B%0A      name: %22%22,%0A      type: %22text%22%0A    %7D%0A  %7D%0A%0A  state = %7B%0A    addedRows: %5B%5D%0A  %7D%0A%0A  addRow = () =%3E %7B%0A    const defaultValues = this.props.columns.map(() =%3E %7Breturn %22%22%7D)
+e = %7B%0A    addedRows: %5B%5D%0A  %7D%0A%0A  addRow = () =%3E %7B
 %0A   
@@ -552,28 +552,24 @@
 editing cell
-Type
 s=%7Bthis.prop
@@ -606,48 +606,50 @@
 urn 
-column.type%7D)%7D cellValues=%7BdefaultValues
+%7Bvalue: %22%22, type: column.type %7C%7C %22text%22%7D%7D)
 %7D /%3E
@@ -880,37 +880,32 @@
             cell
-Value
 s=%7Bthis.props.co
@@ -910,35 +910,32 @@
 columns.map((col
-umn
 ) =%3E %7Breturn col
@@ -935,100 +935,51 @@
 urn 
-column.name%7D)%7D%0A            cellTypes=%7Bthis.props.columns.map((column) =%3E %7Breturn column.type
+%7Bvalue: col.name, type: col.type %7C%7C %22text%22%7D
 %7D)%7D%0A
@@ -1148,13 +1148,8 @@
 cell
-Value
 s=%7Bt
@@ -1166,35 +1166,32 @@
 columns.map((col
-umn
 ) =%3E %7Breturn col
@@ -1191,100 +1191,51 @@
 urn 
-column.name%7D)%7D%0A            cellTypes=%7Bthis.props.columns.map((column) =%3E %7Breturn column.type
+%7Bvalue: col.name, type: col.type %7C%7C %22text%22%7D
 %7D)%7D%0A

Remove defaultProps and use cells prop