// material-ui
import * as React from 'react';
import {FiDataGrid} from "components/FiDataGrid";
// import dayjs from "dayjs";
// import {
//     Button
// } from '@mui/material';
import * as DateUtils from "utils/DateUtils"
import * as StatusUtils from "utils/statusUtils/PublicNoteStatusUtils";

// ==============================|| EVENT TABLE ||============================== //

export default function StatusHistoryTab({rows}) {
    const columns = [
        {
            id: 'created',
            field: 'created',
            headerName: 'Date',
            flex: 1,
            valueGetter: (params) => {
                return DateUtils.datetimeStr(params?.value);
            }
            
        },
        {
            id: 'createdBy',
            field: 'createdBy',
            headerName: 'Changed By',
            flex: 1,
        },
        {
            id: 'status',
            field: 'status',
            headerName: 'Status',
            flex: 1,
            renderCell: (params) => {
                return [StatusUtils.getStatusEng(params)]
            },
        },
    ];

    return (
        <div style={{height:'20%', width: '100%'}}>
            <FiDataGrid
                rows={rows}
                columns={columns}
                customPageSize={5}
            />
        </div>
    );
}
