import React, { useEffect, useState } from "react";
import { Grid } from "../../../../components/grid/Grid";

import { AdvancedTable } from "../../../../components/advanced-table/AdvancedTable";
import { CheckCleanceCode } from "../../../../components/check-clearance-code/ChechClearanceCode";

export const NationalInfoDetails = ({ data }) => {
  const [tableData, setTableData] = useState([]);

  useEffect(() => {
    const d = data?.bars?.map((item, i) => {
      return [
        i + 1,
        <CheckCleanceCode key={i} clearanceCode={item?.TrackingCode} />,
        item?.IssueDatePersian,
        item?.GoodAmount?.toLocaleString(),
        item?.TrackingStatusDescription,
        item?.GoodName,
        item?.DesPartIdCode,
        item?.DesUnitName,
        item?.ResideDatePersian,
      ];
    });
    setTableData(d);
  }, [data]);
  return (
    <Grid xs={12} container justifyContent="center">
      <AdvancedTable
        name="اطلاعات حمل مرغ زنده"
        columns={[
          "ردیف",
          "کد رهگیری",
          "تاریخ ثبت وضعیت",
          "تعداد",
          "وضعیت",
          "نام کالا",
          "شناسه یکتا کشتارگاه",
          "کشتارگاه",
          "تاریخ ثبت وضعیت",
        ]}
        data={tableData}
      />
    </Grid>
  );
};
