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 { MinistryProgressReportIssueRow } from "./progress-report-issues-data";

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

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

export function getMinistryProgressReportIssueColumns({
  onUpdateIssue,
  onViewComment,
  renderAction,
  renderStatus,
}: GetColumnsOptions = {}): DataTableColDef<MinistryProgressReportIssueRow>[] {
  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: "pswg",
      headerName: "PSWG Secretariat",
      width: 250,
      renderCell: (params) => <IssuesTextCell value={params.row.pswg} />,
    }),
    fixed({
      field: "issue",
      headerName: "Issue",
      width: 350,
      renderCell: (params) => <IssuesTextCell value={params.row.issue} />,
    }),
    fixed({
      field: "category",
      headerName: "Category of Issues",
      width: 200,
      renderCell: (params) => <IssuesTextCell value={params.row.category} />,
    }),
    fixed({
      field: "issueDescription",
      headerName: "Issue Description",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell value={params.row.issueDescription} />
      ),
    }),
    fixed({
      field: "recommendation",
      headerName: "Recommendation",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell value={params.row.recommendation} />
      ),
    }),
    fixed({
      field: "rgcDecision",
      headerName: "RGC Decision",
      width: 500,
      renderCell: (params) => <IssuesTextCell value={params.row.rgcDecision} />,
    }),
    fixed({
      field: "status",
      headerName: "Status",
      width: 200,
      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 />
      ),
    }),
    fixed({
      field: "indicators",
      headerName: "Indicators",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell value={params.row.indicators} muted />
      ),
    }),
    fixed({
      field: "dateOfIssueSolution",
      headerName: "Date of Issue Solution",
      width: 206,
      renderCell: (params) => (
        <IssuesTextCell value={params.row.dateOfIssueSolution} muted />
      ),
    }),
    fixed({
      field: "sourceOfVerification",
      headerName: "Source of Verification",
      width: 206,
      renderCell: (params) => (
        <IssuesTextCell value={params.row.sourceOfVerification} muted />
      ),
    }),
    fixed({
      field: "linkToVerificationSource",
      headerName: "Link to Verification Source",
      width: 206,
      renderCell: (params) => (
        <IssuesTextCell value={params.row.linkToVerificationSource} muted />
      ),
    }),
    fixed({
      field: "implementationChallenges",
      headerName: "Implementation Challenges",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell value={params.row.implementationChallenges} muted />
      ),
    }),
    fixed({
      field: "request",
      headerName: "Request",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell value={params.row.request} muted />
      ),
    }),
    fixed({
      field: "nextStep",
      headerName: "Next Step",
      width: 500,
      renderCell: (params) => (
        <IssuesTextCell value={params.row.nextStep} muted />
      ),
    }),
    fixed({
      field: "primaryAgency",
      headerName: "Gov't primary Agency",
      width: 222,
      renderCell: (params) => (
        <IssuesAgencyCell
          name={params.row.primaryAgency}
          logo={params.row.primaryAgencyLogo}
        />
      ),
    }),
    fixed({
      field: "secondAgency",
      headerName: "Gov't second Agency",
      width: 222,
      renderCell: (params) => (
        <IssuesAgencyCell
          name={params.row.secondAgency}
          logo={params.row.secondAgencyLogo}
        />
      ),
    }),
    fixed({
      field: "thirdAgency",
      headerName: "Gov't third Agency",
      width: 222,
      renderCell: (params) => (
        <IssuesAgencyCell
          name={params.row.thirdAgency}
          logo={params.row.thirdAgencyLogo}
        />
      ),
    }),
    fixed({
      field: "fourthAgency",
      headerName: "Gov't fourth Agency",
      width: 222,
      renderCell: (params) => (
        <IssuesAgencyCell
          name={params.row.fourthAgency}
          logo={params.row.fourthAgencyLogo}
        />
      ),
    }),
    fixed({
      field: "fifthAgency",
      headerName: "Gov't fifth Agency",
      width: 222,
      renderCell: (params) => (
        <IssuesAgencyCell
          name={params.row.fifthAgency}
          logo={params.row.fifthAgencyLogo}
        />
      ),
    }),
    ...(onUpdateIssue || renderAction
      ? [
          fixed({
            field: "action",
            headerName: "Action",
            width: 149,
            align: "center",
            headerAlign: "center",
            filterable: false,
            disableColumnMenu: true,
            renderCell: (params) =>
              renderAction?.(params.row) ?? (
                <IssuesUpdateMenuActionCell
                  updateLabel="Update Issue"
                  onUpdate={() => onUpdateIssue?.(params.row)}
                  onViewComment={
                    params.row.cdcComment
                      ? () => onViewComment?.(params.row)
                      : undefined
                  }
                />
              ),
          }),
        ]
      : []),
  ];
}