// Copyright (C) The Arvados Authors. All rights reserved.
//
// SPDX-License-Identifier: AGPL-3.0

import * as React from 'react';
import { Theme } from "@material-ui/core";
import { StyleRulesCallback, WithStyles } from "@material-ui/core/styles";
import Paper from "@material-ui/core/Paper/Paper";
import withStyles from "@material-ui/core/es/styles/withStyles";
import Table from "@material-ui/core/Table/Table";
import TableHead from "@material-ui/core/TableHead/TableHead";
import TableRow from "@material-ui/core/TableRow/TableRow";
import TableCell from "@material-ui/core/TableCell/TableCell";
import TableBody from "@material-ui/core/TableBody/TableBody";

type CssRules = 'root' | 'table';

const styles: StyleRulesCallback<CssRules> = (theme: Theme) => ({
    root: {
        width: '100%',
        marginTop: theme.spacing.unit * 3,
        overflowX: 'auto',
    },
    table: {
        minWidth: 700,
    },
});

interface ProjectListProps {
}

class ProjectList extends React.Component<ProjectListProps & WithStyles<CssRules>, {}> {
    render() {
        const {classes} = this.props;
        return <Paper className={classes.root}>
            <Table className={classes.table}>
                <TableHead>
                    <TableRow>
                        <TableCell>Name</TableCell>
                        <TableCell>Status</TableCell>
                        <TableCell>Type</TableCell>
                        <TableCell>Shared by</TableCell>
                        <TableCell>File size</TableCell>
                        <TableCell>Last modified</TableCell>
                    </TableRow>
                </TableHead>
                <TableBody>
                    <TableRow>
                        <TableCell>Project 1</TableCell>
                        <TableCell>Complete</TableCell>
                        <TableCell>Project</TableCell>
                        <TableCell>John Doe</TableCell>
                        <TableCell>1.5 GB</TableCell>
                        <TableCell>9:22 PM</TableCell>
                    </TableRow>
                </TableBody>
            </Table>
        </Paper>
    }
}

export default withStyles(styles)(ProjectList);