import {
  DataTableNumberCell,
  type DataTableColDef,
} from "@/components/ui/data-table";
import type { ReactNode } from "react";

import {
  IssuesAgencyCell,
  IssuesStatusCell,
  IssuesTextCell,
  IssuesUpdateMenuActionCell,
} from "./progress-report-issues-cells";
import type { MinistryProgressReportDecisionRow } from "./progress-report-decisions-data";

type GetColumnsOptions = {
  onUpdateIssue?: (row: MinistryProgressReportDecisionRow) => void;
  onViewComment?: (row: MinistryProgressReportDecisionRow) => void;
  renderAction?: (row: MinistryProgressReportDecisionRow) => ReactNode;
  renderStatus?: (row: MinistryProgressReportDecisionRow) => ReactNode;
};

function fixed(
  column: DataTableColDef<MinistryProgressReportDecisionRow>,
): DataTableColDef<MinistryProgressReportDecisionRow> {
  return {
    flex: 0,
    minWidth: column.width,
    sortable: false,
    ...column,
  };
}

export function getMinistryProgressReportDecisionColumns({
  onUpdateIssue,
  onViewComment,
  renderAction,
  renderStatus,
}: GetColumnsOptions = {}): DataTableColDef<MinistryProgressReportDecisionRow>[] {
  return [
    fixed({
      field: "id",
      headerName: "N.O",
      width: 50,
      align: "center",
      headerAlign: "center",
      filterable: false,
      disableColumnMenu: true,
      renderCell: (params) => (
        <DataTableNumberCell
          value={params.api.getRowIndexRelativeToVisibleRows(params.row.id) + 1}
        />
      ),
    }),
    fixed({
      field: "primaryAgency",
      headerName: "Ministry",
      width: 170,
      renderCell: (params) => (
        <IssuesAgencyCell
          name={params.row.primaryAgency}
          logo={params.row.primaryAgencyLogo}
          logoSize={28}
        />
      ),
    }),
    fixed({
      field: "rgcDecision",
      headerName: "RGC Decision",
      width: 500,
      renderCell: (params) => <IssuesTextCell value={params.row.rgcDecision} />,
    }),
    fixed({
      field: "focalPerson",
      headerName: "Focal Person (H.E)",
      width: 190,
      renderCell: (params) => <IssuesTextCell value={params.row.focalPerson} />,
    }),
    fixed({
      field: "meetingDate",
      headerName: "Meeting Date",
      width: 200,
      renderCell: (params) => <IssuesTextCell value={params.row.meetingDate} />,
    }),
    fixed({
      field: "category",
      headerName: "Category of RGC Decision",
      width: 200,
      renderCell: (params) => <IssuesTextCell value={params.row.category} />,
    }),
    fixed({
      field: "status",
      headerName: "Status",
      width: 200,
      align: "center",
      headerAlign: "center",
      renderCell: (params) =>
        renderStatus?.(params.row) ?? (
          <IssuesStatusCell status={params.row.status} />
        ),
    }),
    fixed({
      field: "progressSolution",
      headerName: "Progress Solution",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell
          value={params.row.progressSolution}
          muted={params.row.progressSolution === "No data"}
        />
      ),
    }),
    fixed({
      field: "indicators",
      headerName: "Solution Indicators",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell
          value={params.row.indicators}
          muted={params.row.indicators === "No data"}
        />
      ),
    }),
    fixed({
      field: "implementationChallenges",
      headerName: "Challenge",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell
          value={params.row.implementationChallenges}
          muted={params.row.implementationChallenges === "No data"}
        />
      ),
    }),
    fixed({
      field: "request",
      headerName: "Request",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell
          value={params.row.request}
          muted={params.row.request === "No data"}
        />
      ),
    }),
    fixed({
      field: "nextStep",
      headerName: "Next Step",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell
          value={params.row.nextStep}
          muted={params.row.nextStep === "No data"}
        />
      ),
    }),
    fixed({
      field: "dateOfIssueSolution",
      headerName: "Date of Issue Solution",
      width: 206,
      renderCell: (params) => (
        <IssuesTextCell
          value={params.row.dateOfIssueSolution}
          muted={params.row.dateOfIssueSolution === "No data"}
        />
      ),
    }),
    fixed({
      field: "sourceOfVerification",
      headerName: "Source of Verification",
      width: 206,
      renderCell: (params) => (
        <IssuesTextCell
          value={params.row.sourceOfVerification}
          muted={params.row.sourceOfVerification === "No data"}
        />
      ),
    }),
    fixed({
      field: "linkToVerificationSource",
      headerName: "Link to Verification Source",
      width: 206,
      renderCell: (params) => (
        <IssuesTextCell
          value={params.row.linkToVerificationSource}
          muted={params.row.linkToVerificationSource === "No data"}
        />
      ),
    }),
    ...(onUpdateIssue || renderAction
      ? [
          fixed({
            field: "action",
            headerName: "Action",
            width: 100,
            align: "center",
            headerAlign: "center",
            filterable: false,
            disableColumnMenu: true,
            renderCell: (params) =>
              renderAction?.(params.row) ?? (
                <IssuesUpdateMenuActionCell
                  onUpdate={() => onUpdateIssue?.(params.row)}
                  onViewComment={
                    params.row.cdcComment
                      ? () => onViewComment?.(params.row)
                      : undefined
                  }
                />
              ),
          }),
        ]
      : []),
  ];
}