"use client";
import { headMakeprfmnc } from "@/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/TableHead";
import type { TableUpperProps } from "@/app/store/common/type/header";
import type {
} from "@/app/store/prfmncReg/chkgdnReg/rainChkgdn";
import type { chHeadType } from "@/app/store/prfmncReg/chkgdnReg/rainChkgdn/headList";
import { InputTableBody } from "@/components/lib/func/TableData";
import {
  Table,
  TableBody,
  TableHeader,
} from "@common/components/ui";
import { useEffect, useState } from "react";

export function GuideDetailsTable({
  chgRes,
  headList,
  upheadList,
  setChGuidData,
  readonly
}: {
  chgRes: any[];
  headList: TableUpperProps[];
  upheadList: chHeadType[];
  type: string;
  setChGuidData: (chgRes: any[]) => void;
  readonly?: boolean;
}) {
  const [inputData, setInputData] = useState<any[]>();

  useEffect(() => {
    setInputData(chgRes);
  }, [chgRes]);

  useEffect(() => {
    setChGuidData(inputData ?? []);

  }, [inputData]);


  return (
    <>
      <div className={`card !m-[1.2rem] !p-0r `}>
        <Table variant="secondary">
          <TableHeader className="font-bold">{headMakeprfmnc(headList, upheadList)}</TableHeader>
          <TableBody >
            {InputTableBody(inputData ?? [], headList, setInputData, readonly)}
          </TableBody>
        </Table>
      </div>
    </>
  );
}