import React from 'react';
import superagent from 'superagent';
import cookie from 'react-cookies';
import MenuPageWrapper from '../Wrappers/MenuPageWrapper.jsx';
import * as ApiUtils from '../CloudApi/ApiUtils.js';

import {
    Icon,
    Button,
    Table,
    Form,
    Label,
} from 'semantic-ui-react'

export default class EnvironmentsTable extends React.Component {
    render() {
        if (this.props.environments) {
            return (
                <Table size="small" celled striped>
                    <Table.Header fullWidth>
                        <Table.Row widths="equal">
                            <Table.HeaderCell collapsing>ID</Table.HeaderCell>
                            <Table.HeaderCell collapsing>Name</Table.HeaderCell>
                            <Table.HeaderCell collapsing>Owner</Table.HeaderCell>
                            <Table.HeaderCell collapsing>Created</Table.HeaderCell>
                        </Table.Row>
                    </Table.Header>

                    <Table.Body>
                        {this.props.environments.map((environment, index) => {
                            return (
                                <Table.Row >
                                    <Table.Cell collapsing>{environment.id}</Table.Cell>
                                    <Table.Cell collapsing>{environment.name}</Table.Cell>
                                    <Table.Cell collapsing></Table.Cell>
                                    <Table.Cell collapsing></Table.Cell>
                                </Table.Row>
                            )
                        })}
                    </Table.Body>
                </Table>
            );
        } else {
            return null;
        }
    }
}