tsms/src/components/Report/FinancialStatusReportGen/FinancialStatusReportGen.tsx

//src\components\LateStartReportGen\LateStartReportGen.tsx
"use client";
import React, { useMemo, useState } from "react";
// import SearchBox, { Criterion } from "../ReportSearchBoxe1";
import { useTranslation } from "react-i18next";
import { FinancialStatus, ProjectCombo } from "@/app/api/reporte1";
import SearchBox, { Criterion } from "@/components/SearchBox";
import { FinancialStatusReportFilter } from "@/app/api/reports";
import { fetchAllClientSubsidiaryProjects } from "@/app/api/clientprojects/actions";
import { fetchProjectsFinancialStatusReport } from "@/app/api/reporte1/action";
import { downloadFile } from "@/app/utils/commonUtil";
//import { DownloadReportButton } from './DownloadReportButton';
interface Props {
  projects: FinancialStatus[];
  projectCombo : ProjectCombo[];
}
type SearchQuery = Partial<Omit<ProjectCombo, "id">>;
type SearchParamNames = keyof SearchQuery;

const GenFinancialStatusReport: React.FC<Props> = ({ projects, projectCombo }) => {
  const { t } = useTranslation("projects");

  const combo = projectCombo.map(project => {return `${project.code} - ${project.name}`})

  const searchCriteria: Criterion<SearchParamNames>[] = useMemo(
    () => [
      { label: t("Project No"), paramName: "code", type: "select", options: combo,  },
      // {
      //   label: "Status",
      //   label2: "Remained Date To",
      //   paramName: "targetEndDate",
      //   type: "dateRange",
      // },
    ],
    [t],
  );

  return (
    <>
      <SearchBox
        criteria={searchCriteria}
        onSearch={async (query) => {
          const projectIndex = projectCombo.findIndex((project) => `${project.code} - ${project.name}` === query.code)
          console.log(projectCombo[projectIndex].id)
          const response = await fetchProjectsFinancialStatusReport({ projectId: projects[projectIndex].id })
          if (response) {
              downloadFile(new Uint8Array(response.blobValue), response.filename!!)
          }
        }}
      />
      {/* <DownloadReportButton /> */}
    </>
  );
};

export default GenFinancialStatusReport;