import DialogLoading from "@/core/components/DialogLoading";
import ShowPlak from "@/core/components/ShowPlak";
import { GET_MACHINES_BY_ID } from "@/core/utils/routes";
import useRequest from "@/lib/hooks/useRequest";
import {
    DialogContent,
    Table,
    TableBody,
    TableCell,
    TableContainer,
    TableHead,
    TableRow,
    Typography,
} from "@mui/material";
import { useEffect, useState } from "react";

const MachinesContent = ({ rowId }) => {
    const [loading, setLoading] = useState(true);
    const [data, setData] = useState(null);
    const request = useRequest();

    useEffect(() => {
        const fetchData = async () => {
            try {
                setLoading(true);
                const response = await request(`${GET_MACHINES_BY_ID}/${rowId}`);
                setData(response.data.data);
            } catch (error) {
            } finally {
                setLoading(false);
            }
        };

        fetchData();
    }, [rowId]);

    return (
        <>
            <DialogContent>
                {loading ? (
                    <DialogLoading />
                ) : data ? (
                    <TableContainer>
                        <Table stickyHeader>
                            <TableHead>
                                <TableRow>
                                    <TableCell>کد ماشین</TableCell>
                                    <TableCell>نام خودرو</TableCell>
                                </TableRow>
                            </TableHead>
                            <TableBody>
                                {data.map((machine) => {
                                    return (
                                        <TableRow
                                            key={machine.id}
                                            sx={{ "&:last-child td, &:last-child th": { border: 0 } }}
                                        >
                                            <TableCell>{machine.machine_code}</TableCell>
                                            <TableCell>{machine.car_name}</TableCell>
                                        </TableRow>
                                    );
                                })}
                            </TableBody>
                        </Table>
                    </TableContainer>
                ) : (
                    <Typography textAlign={"center"}>اطلاعات خودرویی در سامانه یافت نشد</Typography>
                )}
            </DialogContent>
        </>
    );
};
export default MachinesContent;