tsms/src/components/Report/LateStartReportGen/LateStartReportGen.tsx

//src\components\LateStartReportGen\LateStartReportGen.tsx
"use client";
import React, { useMemo, useState } from "react";
import SearchBox, { Criterion } from "../../ReportSearchBox";
import { useTranslation } from "react-i18next";
import { LateStart } from "@/app/api/report";
//import { DownloadReportButton } from './DownloadReportButton';
import axios from 'axios';
import { apiPath } from '../../../auth/utils';
//import { GET_QC_CATEGORY_COMBO } from 'utils/ApiPathConst';
interface Props {
  projects: LateStart[];
}
type SearchQuery = Partial<Omit<LateStart, "id">>;
type SearchParamNames = keyof SearchQuery;

const ProgressByClientSearch: React.FC<Props> = ({ projects }) => {
  const { t } = useTranslation("projects");
  // const  [teamCombo, setteamCombo] = useState([]);
  // const getteamCombo = () => {
  //   axios.get(`${apiPath}${GET_QC_CATEGORY_COMBO}`)
  //   .then(response => {
  //     setteamCombo(response.data.records)})
  //   .catch(error => {
  //     console.error('Error fetching data: ', error);
  //   });
  // }
  const searchCriteria: Criterion<SearchParamNames>[] = useMemo(
    () => [
      { label: "Team", paramName: "team", type: "select", options: ["AAA", "BBB", "CCC"] },
      { label: "Client", paramName: "client", type: "select", options: ["Cust A", "Cust B", "Cust C"] },
      {
        label: "Remained Date From",
        label2: "Remained Date To",
        paramName: "targetEndDate",
        type: "dateRange",
      },
    ],
    [t],
  );

  return (
    <>
      <SearchBox
        criteria={searchCriteria}
        onSearch={(query) => {
          console.log(query);
        }}
      />
      {/* <DownloadReportButton /> */}
    </>
  );
};

export default ProgressByClientSearch;