componentDidMount() {
    this.props.client
      .query({
        query: ALL_SKUS
      })
      .then(({ data }) => {
        const skus = removeTypename(data.allSkuTypes);
        const newData = skus.map((sku, index) => ({
          serial: index + 1,
          ...sku
        }));
        this.setState({ data: newData });
      })
      .catch(err => {
        console.log(err);
      });
  }

{
        Header: 'SKU Name',
        headerClassName: 'vt-table-header',
        accessor: 'name',
        maxWidth: 350,
        Cell: this.renderEditable
      },

renderEditable = ({ index, column }) => {
    const { data } = this.state;

    return (
      <InputGroup
        onChange={e => {
          const newData = [...data];
          newData[index][column.id] = e.target.value;
          this.setState({ data: newData });
        }}
        value={data[index][column.id]}
      />
    );
  };

<ReactTable
          loading={data.length === 0 ? true : false}
          showPagination={false}
          className="mt-3 text-center"
          data={data}
          columns={columns}
        />