"use client"
import type { EmployeeRecord } from "@/app/(profile)/profile/home/employees/_types";

import { Fragment, ReactNode, useState } from "react";
import Button from "@/core/components/Button";
import ModalComponent from "@/app/(profile)/profile/_components/Modal";
import AddNewEmployee from "@/app/(profile)/profile/home/employees/_components/AddNewEmployee";

interface AddEmployeeProps {
  
}
/**
 * TODO:
 *  Functionality redo!
 */
export default function AddEmployee({  }: Readonly<AddEmployeeProps>): ReactNode {
  const [isOpenModal, setIsOpenModal] = useState<boolean>(false);
  const [,setEmployees] = useState<EmployeeRecord[]>([]); // TODO: WARN! That's temporary, just to compatibility of the prop types after refactoring!!!

  return (
    <Fragment>
      <ModalComponent title={"Add new employee"}
                      width={374}
                      isOpen={isOpenModal}
                      onCancel={() => setIsOpenModal((prevState) => !prevState)}>
        <AddNewEmployee onClose={() => setIsOpenModal((prevState) => !prevState)}
                        mode={"mode"}
                        editEmployee={null}
                        setEmployees={setEmployees} />
      </ModalComponent>
      <Button className={"self-center !w-[200px] !h-[42px]"}
              onClick={() => setIsOpenModal((prevState) => !prevState)}>
        + Add new employee
      </Button>
    </Fragment>
  );
}