import React, { Component } from 'react';
import {getDomains} from '../helpers/api';
import Domain from './Domain';

import ReactTable from "react-table";
import "react-table/react-table.css";

class DomainList extends Component {

  constructor(props){
    super(props);
  
    getDomains().then(l => l.text()).then(l => {
      let parsedList = JSON.parse(l);
      this.setState({domains:parsedList});
    });

    this.state = {domains:[]};
  }

  render() {
    return (
      <ReactTable
        data = {this.state.domains}
        columns={[
          {
            Header: 'Domain name',
            accessor: 'domainName',
          },
          {
            Header: 'TLD domain',
            accessor: 'tld',
          },
          {
            Header: 'Expiration date',
            accessor: 'expirationDate',
          }
        ]}
        defaultPageSize={10}
        className="-striped -highlight"
      />
    )
  }
}

export default DomainList;