import React from 'react'
import { Table } from 'antd'
import commontStyles from '../../../Utils/Common.less'
import { type PermissionApproveExpandView } from '../../../Types/ToApproveViewAll/PermissionApproval'

const PermissionExpandView = (
    props: PermissionApproveExpandView
): React.ReactElement => {
    const { expandData } = props

    const columns = [
        {
            title: 'Level',
            dataIndex: 'levelName',
        },
        {
            title: 'Approver',
            dataIndex: 'approverName',
        },
        {
            title: 'Approval Date',
            dataIndex: 'approvedDate',
        },
        {
            title: 'Status',
            dataIndex: 'approvalStatus',
        },
        {
            title: 'Remarks',
            dataIndex: 'remarks',
        },
    ]

    const newData = [expandData]

    return (
        <div className={commontStyles.expandCard}>
            <Table columns={columns} dataSource={newData} pagination={false} />
        </div>
    )
}

export default PermissionExpandView
