// material-ui
import * as React from 'react';
// import { GridActionsCellItem, } from "@mui/x-data-grid";
import { FiDataGrid } from "components/FiDataGrid";
// import EditIcon from '@mui/icons-material/Edit';
import { useEffect } from "react";
import { dateStr } from "utils/DateUtils";
// import { useNavigate } from "react-router-dom";

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

function holidayRowsFromResponse(recordList) {
    if (Array.isArray(recordList)) return recordList;
    if (recordList && Array.isArray(recordList.records)) return recordList.records;
    return [];
}

export default function HolidayTable({ recordList, applyGridOnReady }) {
    const [rows, setRows] = React.useState(() => holidayRowsFromResponse(recordList));

    // const navigate = useNavigate()

    useEffect(() => {
        setRows(holidayRowsFromResponse(recordList));
    }, [recordList]);

    const columns = [
        {
            id: 'HOLIDAY_DAY',
            field: 'HOLIDAY_DAY',
            headerName: 'Date',
            flex: 4,
            renderCell: (params) => {
                let HOLIDAY_DAY = params.row.HOLIDAY_DAY;
                return <div style={{ margin: 4 }}>{dateStr(HOLIDAY_DAY)}</div>
            },
        },
        {
            id: 'DESCRIPTION',
            field: 'DESCRIPTION',
            headerName: 'Description',
            flex: 5,
        },
    ];

    // function handleRowDoubleClick(params) {
    //     navigate('/emailTemplate/' + params.id);
    // }

    return (
        <div style={{ height: "fit-content", width: '100%' }}>
            <FiDataGrid
                rows={rows}
                columns={columns}
                customPageSize={20}
                applyGridOnReady={applyGridOnReady}
                // onRowDoubleClick={handleRowDoubleClick}
                getRowHeight={() => 'auto'}
                // doLoad={React.useMemo(() => ({
                //     url: LIST_PROOF,
                //     params: _searchCriteria,
                // }), [_searchCriteria])}
            />
        </div>
    );
}