import * as React from 'react';
import { Table, TableBody, TableCell, TableFoot, TableHead, TableHeaderCell, TableRow } from '.';

interface ITablePreviewProps {
    data?: object[],
}

export const TablePreview = ({  }: ITablePreviewProps) => (
    <Table>
        <TableHead>
            <TableRow>
                <TableHeaderCell>
                    This is table header 1
                </TableHeaderCell>
                <TableHeaderCell>
                    This is table header 2
                </TableHeaderCell>
                <TableHeaderCell>
                    This is table header 3
                </TableHeaderCell>
            </TableRow>
        </TableHead>

        <TableBody>
            <TableRow>
                <TableCell>
                    Cell 1 1
                </TableCell>

                <TableCell>
                    Cell 1 2
                </TableCell>

                <TableCell>
                    Cell 1 3
                </TableCell>
            </TableRow>

            <TableRow>
                <TableCell>
                    Cell 2 1
                </TableCell>

                <TableCell>
                    Cell 2 2
                </TableCell>

                <TableCell>
                    Cell 2 3
                </TableCell>
            </TableRow>

            <TableRow>
                <TableCell>
                    Cell 3 1
                </TableCell>

                <TableCell>
                    Cell 3 2
                </TableCell>

                <TableCell>
                    Cell 3 3
                </TableCell>
            </TableRow>

            <TableRow>
                <TableCell>
                    Cell 4 1
                </TableCell>

                <TableCell>
                    Cell 4 2
                </TableCell>

                <TableCell>
                    Cell 4 3
                </TableCell>
            </TableRow>

            <TableRow>
                <TableCell>
                    Cell 5 1
                </TableCell>

                <TableCell>
                    Cell 5 2
                </TableCell>

                <TableCell>
                    Cell 5 3
                </TableCell>
            </TableRow>
        </TableBody>

        <TableFoot>
            <TableRow>
                <TableCell colSpan={3}>
                    This is table foot
                </TableCell>
            </TableRow>
        </TableFoot>
    </Table>
);