import { Box } from '@mui/material'
import { IServer } from '../interfaces/servers'
import { useServerIps } from '../hooks/swrHooks'
import FullFeaturedCrudGrid from './TableEditable'
import { GridColDef } from '@mui/x-data-grid'
import { AxiosResponse } from 'axios'

function ServerData({ id }: IServer) {
    const { serverIps } = useServerIps(id, 0, 10)

    const serverIpsColumns: GridColDef[] = [
        { field: 'id', headerName: 'ID', type: 'number' },
        { field: 'server_id', headerName: 'Server ID', type: 'number' },
        { field: 'name', headerName: 'Название', type: 'string' },
        { field: 'is_actual', headerName: 'Действителен', type: 'boolean' },
        { field: 'ip', headerName: 'IP', type: 'string' },
        { field: 'servername', headerName: 'Название сервера', type: 'string' },
    ]

    return (
        <Box sx={{ display: 'flex', flexDirection: 'column', p: '16px' }}>
            {serverIps &&
                <FullFeaturedCrudGrid
                    initialRows={serverIps}
                    columns={serverIpsColumns}
                    actions
                    onRowClick={(params, event, details) => {
                        console.log(params.id, event, details)
                        //setCurrentServerData(params.row)
                        //setServerDataOpen(true)
                    }}
                    onSave={undefined}
                    onDelete={function (data: any): Promise<AxiosResponse<any, any>> {
                        console.log(data)
                        throw new Error('Function not implemented.')
                    }}
                    loading={false}
                />
            }
        </Box>
    )
}

export default ServerData