import { JSONPath as jsonpath } from "jsonpath-plus";
import useTranslation from "next-translate/useTranslation";
import Link from "next/link";
import { useRouter } from "next/router";
import { parseCookies } from "nookies";
import { useCallback, useState } from "react";
import { connect } from "react-redux";
import {
    deleteAwaitingSubmissionsFromBlob,
    deleteMyRepresentationsFromBlob,
    deleteWatchedCases,
    getAwaitingSubmissionFromBlobProxy,
    getRepsFromBlobProxy,
    getWatchedCasesProxy,
    getWatchedCases,
    createWatchedCases,
} from "../../actions";
import { getDetailsProxy, getFormCollectionByID } from "../../components/utils";
import transLookup from "../../data/lookuptranslations.json";
import { setAwaitingSubmissionFromBlob } from "../../store/awaitingSubmission/action";
import {
    setSearchDetails,
    setSearchResults,
} from "../../store/searchOutput/action";

import { setAwaitingSubmissionDetails } from "../../store/awaitingSubmission/action";
import {
    setWatchedCases,
    setWatchedCasesDetails,
} from "../../store/watchedCases/action";

import {
    setCurrentReference,
    setCurrentView,
} from "../../store/currentView/action";
import {
    setMyRepresentations,
    setMyRepresentationsDetails,
} from "../../store/myRepresentations/action";

import RepsOnResults from "../search/repsonresults";

const ViewAllResults = (props) => {
    const {
        searchString,
        searchResultsObj,
        setCurrentReference,
        myportal,
        setSearchResults,
        accountDetails,
        setAwaitingSubmissionFromBlob,
        setAwaitingSubmissionDetails,
        setWatchedCasesDetails,
        setWatchedCases,
        setMyRepresentations,
        setMyRepresentationsDetails,
    } = props;

    let { t } = useTranslation();

    const router = useRouter();
    const { locale } = router;
    const repRaisedDate = (datePart) => {
        var dateObj = new Date(
            datePart.split("-")[0] +
                "-" +
                datePart.split("-")[1] +
                "-" +
                datePart.split("-")[2] +
                " " +
                datePart.split("-")[3].split("_")[0].slice(0, 2) +
                ":" +
                datePart.split("-")[3].split("_")[0].slice(2, 4) +
                ":" +
                datePart.split("-")[3].split("_")[0].slice(4, 6)
        );

        return dateObj.toLocaleString();
    };

    let currentView = props.currentView.currentView;
    //console.log("viewAllKey:", typeof viewAllKey);

    // typeof viewAllKey == "undefined"
    //     ? console.log("no currentview")
    //     : console.log("has currentview");

    var viewAllKey = currentView?.viewKey || router.query.viewKey;

    var resultsArr =
        viewAllKey == "awaitingSubmissionDetails"
            ? props["awaitingSubmission"].awaitingSubmissionDetails.case
            : viewAllKey == "mySubmittedReps"
            ? props[viewAllKey][viewAllKey]
            : props[viewAllKey][viewAllKey].value || [];

    const [orderByState, setOrderbyState] = useState("createdon");
    const [fieldSortState, setfieldSortState] = useState("asc");
    const [showSpinnerState, setShowSpinnerState] = useState(false);
    const [selectedOption, setSelectedOption] = useState(10);

    function formatDates(dateObj) {
        var dateObj = new Date(dateObj);
        var dd = String(dateObj.getDate()).padStart(2, "0");
        var mm = String(dateObj.getMonth() + 1).padStart(2, "0"); //January is 0!
        var yyyy = dateObj.getFullYear();

        return dd + "/" + mm + "/" + yyyy;
    }

    var searchDetailsObj =
        viewAllKey == "awaitingSubmissionDetails"
            ? props["awaitingSubmission"].awaitingSubmissionDetails.value
            : viewAllKey == "myRepresentations"
            ? props["myRepresentations"].myRepresentations.value
            : props[viewAllKey][viewAllKey + "Details"] || [];

    let resultsRowArr = [];

    const downloadPDF = async (docProps, ticketnumber) => {
        try {
            const res = await fetch("/api/file/generateappealpdfcopy", {
                method: "POST",
                headers: { "Content-Type": "application/json" },
                body: JSON.stringify({ docProps }),
            });

            if (!res.ok) throw new Error("PDF generation failed");

            const blob = await res.blob();
            const url = URL.createObjectURL(blob);
            const a = document.createElement("a");
            a.href = url;
            a.download = `Appeal_${ticketnumber || "summary"}.pdf`;
            a.click();
            URL.revokeObjectURL(url);
        } catch (err) {
            console.error("Download error:", err);
            alert("Could not generate PDF.");
        }
    };

    const buildResultsRowArr = () => {
        resultsArr.map((item, key) => {
            let detailsObj = jsonpath({
                path:
                    "$" +
                    (viewAllKey == "myRepresentations" ? "" : "..value") +
                    '[?(@ && @.pinswg_name=="' +
                    (viewAllKey == "awaitingSubmissionDetails"
                        ? item.title
                        : viewAllKey == "watchedCases"
                        ? item.ticketnumber
                        : viewAllKey == "myRepresentations"
                        ? item.pinswg_name
                        : item.pinswg_title) +
                    '")]',
                json: searchDetailsObj,
                eval: true,
            });
            detailsObj = detailsObj[0];

            //console.log(searchDetailsObj[key]);

            // searchDetailsObj[key] =
            //     viewAllKey == "myRepresentations"
            //         ? searchDetailsObj[key].value[0]
            //         : searchDetailsObj[key];

            //console.log(resultsArr[key]);
            resultsRowArr.push(
                <div className="govuk-summary-list__row" key={key}>
                    <dd className="govuk-summary-list__value govuk-!-font-size-16  govuk-!-padding-left-2">
                        {viewAllKey == "myCases" &&
                        resultsArr[key].pinswg_publishtoweb === false ? (
                            <>
                                <div className="cardModuleReference">
                                    {resultsArr[key].ticketnumber}{" "}
                                    <b> {t("myportal:appeal-pending-label")}</b>
                                </div>
                                <span
                                    className="  govuk-link govuk-link--no-underline "
                                    style={{ cursor: "pointer" }}
                                    onClick={() => {
                                        confirm(
                                            "Do you want to download a pdf copy of your appeal for " +
                                                resultsArr[key].ticketnumber
                                        ) &&
                                            downloadPDF(
                                                resultsArr[key].incidentid,
                                                resultsArr[key].ticketnumber
                                            );
                                    }}
                                >
                                    <img
                                        src={
                                            "/assets/images/documenttypes/pdf.png"
                                        }
                                        alt={resultsArr[key].ticketnumber}
                                        width={25}
                                        height={25}
                                        title={
                                            "Download summary for " +
                                            resultsArr[key].ticketnumber
                                        }
                                    />
                                </span>
                            </>
                        ) : (
                            <>
                                <Link
                                    href={
                                        viewAllKey == "myRepresentations"
                                            ? {
                                                  pathname:
                                                      "/myportal/representation",
                                                  query: {
                                                      case: resultsArr[key]
                                                          .caseRef,
                                                      state: "edit",
                                                      created:
                                                          resultsArr[key]
                                                              .repfile_name,
                                                  },
                                              }
                                            : viewAllKey ==
                                              "awaitingSubmissionDetails"
                                            ? router.locale == "cy"
                                                ? "/fymhorth/parhauigyflwyno"
                                                : "/myportal" +
                                                  "/" +
                                                  getFormCollectionByID(
                                                      resultsArr[key]
                                                          .pinswg_appealcasetype
                                                  ).UrlName +
                                                  "?lpa=" +
                                                  resultsArr[key][
                                                      "_pinswg_associatedlpa_value"
                                                  ] +
                                                  "&apt=" +
                                                  resultsArr[key]
                                                      .pinswg_appealcasetype +
                                                  "&casereference=" +
                                                  resultsArr[key].title +
                                                  "&inid=" +
                                                  resultsArr[key].incidentid +
                                                  "&key=" +
                                                  viewAllKey
                                            : router.locale == "cy"
                                            ? myportal == true
                                                ? "/fymhorth/achos" +
                                                  resultsArr[key].ticketnumber +
                                                  "?key=" +
                                                  currentView.viewKey
                                                : "/achos" +
                                                  resultsArr[key].ticketnumber
                                            : myportal == true
                                            ? "/myportal/case/" +
                                              resultsArr[key].ticketnumber +
                                              "?key=" +
                                              viewAllKey
                                            : "/case/" +
                                              resultsArr[key].ticketnumber
                                    }
                                    onClick={() => {
                                        viewAllKey == "watchedCases" &&
                                            setSearchResults(
                                                props.watchedCases.watchedCases
                                            ),
                                            setSearchDetails(
                                                props.watchedCases
                                                    .watchedCasesDetails
                                            ),
                                            setCurrentReference({
                                                "ticketnumber":
                                                    resultsArr[key]
                                                        .ticketnumber,
                                                "currentReference":
                                                    viewAllKey != "watchedCases"
                                                        ? viewAllKey ==
                                                          "myRepresentations"
                                                            ? resultsArr[key]
                                                                  .caseRef
                                                            : resultsArr[key]
                                                                  .ticketnumber
                                                        : resultsArr[key][
                                                              "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
                                                          ],

                                                "currentType": viewAllKey,
                                                "incidentid":
                                                    viewAllKey != "watchedCases"
                                                        ? resultsArr[key]
                                                              .incidentid
                                                        : resultsArr[key][
                                                              "_pinswg_watchedcase_value"
                                                          ],

                                                "appealType":
                                                    resultsArr[key]
                                                        .pinswg_appealcasetype,
                                                "repDetails":
                                                    viewAllKey ==
                                                        "myRepresentations" &&
                                                    resultsArr[key],
                                            }),
                                            setCurrentView({
                                                "viewName":
                                                    currentView.viewName,
                                                "viewKey": viewAllKey,
                                            });
                                    }}
                                >
                                    <span className="results-visually-hidden">
                                        {t(
                                            "search:searchresults-case-reference-label"
                                        )}
                                        :
                                    </span>
                                    {viewAllKey != "watchedCases"
                                        ? viewAllKey == "myRepresentations"
                                            ? resultsArr[key].caseRef
                                            : resultsArr[key].ticketnumber
                                        : resultsArr[key][
                                              "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
                                          ]}
                                </Link>
                                <RepsOnResults
                                    detailsObj={detailsObj}
                                    appealType={item.pinswg_appealcasetype}
                                />
                                {viewAllKey == "myRepresentations" && (
                                    <>
                                        <span className="govuk-body govuk-!-font-size-14">
                                            {resultsArr[key].representationType}
                                        </span>
                                    </>
                                )}
                                {viewAllKey == "mySubmittedReps" && (
                                    <>
                                        <span className="govuk-body govuk-!-font-size-14">
                                            {item.pinswg_representationtype}{" "}
                                            {formatDates(
                                                item.pinswg_representationsubmitted
                                            )}
                                        </span>
                                    </>
                                )}
                            </>
                        )}
                    </dd>
                    {/* <dd className="govuk-summary-list__value govuk-!-font-size-16">
                        <span className="results-visually-hidden">
                            {t("search:searchresults-site-address-label")}:
                        </span>

                        {viewAllKey == "awaitingSubmissionDetails" &&
                        _.has(searchDetailsObj[key], "pinswg_siteaddressline1")
                            ? searchDetailsObj[key].pinswg_siteaddressline1
                            : ""}
                        {_.has(detailsObj, "pinswg_siteaddressline1")
                            ? detailsObj.pinswg_siteaddressline1
                            : ""}
                        {viewAllKey == "myRepresentations" &&
                        _.has(searchDetailsObj[key].pinswg_siteaddressline1)
                            ? searchDetailsObj[key].value[0]
                                  .pinswg_siteaddressline1
                            : ""}
                        {_.has(detailsObj, "pinswg_siteaddressline1")
                            ? detailsObj.pinswg_siteaddressline1
                            : ""}
                        {viewAllKey == "awaitingSubmissionDetails" &&
                            _.has(
                                searchDetailsObj[key],
                                "pinswg_siteaddressline1"
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddressline1 !=
                                null && <br />}
                        {viewAllKey == "myRepresentations" &&
                            _.has(
                                searchDetailsObj[key].pinswg_siteaddressline1
                            ) &&
                            searchDetailsObj[key].value[0]
                                .pinswg_siteaddressline1 != null && <br />}
                        {_.has(detailsObj, "pinswg_siteaddressline1") &&
                            detailsObj.pinswg_siteaddressline1 != null && (
                                <br />
                            )}
                        {viewAllKey == "awaitingSubmissionDetails" &&
                        _.has(searchDetailsObj[key], "pinswg_siteaddressline1")
                            ? searchDetailsObj[key].pinswg_siteaddressline2
                            : ""}
                        {viewAllKey == "myRepresentations" &&
                        _.has(searchDetailsObj[key].pinswg_siteaddressline1)
                            ? searchDetailsObj[key].pinswg_siteaddressline2
                            : ""}
                        {_.has(detailsObj, "pinswg_siteaddressline1")
                            ? detailsObj.pinswg_siteaddressline2
                            : ""}
                        {viewAllKey == "awaitingSubmissionDetails" &&
                            _.has(
                                searchDetailsObj[key],
                                "pinswg_siteaddressline2"
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddressline2 !=
                                null && <br />}
                        {viewAllKey == "myRepresentations" &&
                            _.has(
                                searchDetailsObj[key].pinswg_siteaddressline2
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddressline1 !=
                                null && <br />}
                        {_.has(detailsObj, "pinswg_siteaddressline2") &&
                            detailsObj.pinswg_siteaddressline2 != null && (
                                <br />
                            )}
                        {viewAllKey == "awaitingSubmissionDetails" &&
                        _.has(searchDetailsObj[key], "pinswg_siteaddresstown")
                            ? searchDetailsObj[key].pinswg_siteaddresstown
                            : ""}
                        {viewAllKey == "myRepresentations" &&
                        _.has(searchDetailsObj[key], "pinswg_siteaddresstown")
                            ? searchDetailsObj[key].pinswg_siteaddresstown
                            : ""}
                        {_.has(detailsObj, "pinswg_siteaddresstown")
                            ? detailsObj.pinswg_siteaddresstown
                            : ""}
                        {viewAllKey == "awaitingSubmissionDetails" &&
                            _.has(
                                searchDetailsObj[key],
                                "pinswg_siteaddresstown"
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddresstown !=
                                null && <br />}
                        {viewAllKey == "myRepresentations" &&
                            _.has(
                                searchDetailsObj[key],
                                "pinswg_siteaddresstown"
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddresstown !=
                                null && <br />}
                        {_.has(detailsObj, "pinswg_siteaddresstown") &&
                            detailsObj.pinswg_siteaddresstown != null && <br />}
                        {viewAllKey == "awaitingSubmissionDetails" &&
                        _.has(searchDetailsObj[key], "pinswg_siteaddresscounty")
                            ? searchDetailsObj[key].pinswg_siteaddresscounty
                            : ""}
                        {viewAllKey == "myRepresentations" &&
                        _.has(searchDetailsObj[key], "pinswg_siteaddresscounty")
                            ? searchDetailsObj[key].pinswg_siteaddresscounty
                            : ""}
                        {_.has(detailsObj, "pinswg_siteaddresscounty")
                            ? detailsObj.pinswg_siteaddresscounty
                            : ""}
                        {viewAllKey == "awaitingSubmissionDetails" &&
                            _.has(
                                searchDetailsObj[key],
                                "pinswg_siteaddresscounty"
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddresscounty !=
                                null && <br />}
                        {_.has(detailsObj, "pinswg_siteaddresscounty") &&
                            detailsObj.pinswg_siteaddresscounty != null && (
                                <br />
                            )}
                        {viewAllKey == "awaitingSubmissionDetails" &&
                        _.has(
                            searchDetailsObj[key],
                            "pinswg_siteaddresspostcode"
                        )
                            ? searchDetailsObj[key].pinswg_siteaddresspostcode
                            : ""}
                        {_.has(detailsObj, "pinswg_siteaddresspostcode")
                            ? detailsObj.pinswg_siteaddresspostcode
                            : ""}
                    </dd> */}

                    <dd className="govuk-summary-list__value govuk-!-font-size-16">
                        <span className="results-visually-hidden">
                            {t("search:searchresults-site-address-label")}:
                        </span>

                        {/* Helper function to extract address lines based on current view and data */}
                        {[
                            "pinswg_siteaddressline1",
                            "pinswg_addressline1",
                            "pinswg_siteaddressline2",
                            "pinswg_addressline2",
                            "pinswg_siteaddresstown",
                            "pinswg_addresstown",
                            "pinswg_siteaddresscounty",
                            "pinswg_siteaddresspostcode",
                            "pinswg_postcode",
                            "pinswg_projectlocation",
                        ].map((field, idx) => {
                            const isAwaitingSubmission =
                                viewAllKey === "awaitingSubmissionDetails";
                            const isMyRepresentations =
                                viewAllKey === "myRepresentations";
                            const searchValue = _.get(
                                searchDetailsObj,
                                `${key}.${field} `
                            );
                            const detailsValue = _.get(detailsObj, field);

                            // Determine the display value based on current view
                            const valueToDisplay =
                                (isAwaitingSubmission && searchValue) ||
                                (isMyRepresentations && searchValue) ||
                                detailsValue ||
                                "";

                            // Only render a line break if there is a valid value and it's not the last address part
                            const renderLineBreak = valueToDisplay && idx < 4; // Only insert <br> if it's not the last element

                            return (
                                <>
                                    {valueToDisplay}
                                    {renderLineBreak && <br />}
                                </>
                            );
                        })}
                    </dd>

                    <dd className="govuk-summary-list__value govuk-!-font-size-16">
                        <span className="results-visually-hidden">
                            {viewAllKey == "awaitingSubmissionDetails"
                                ? t("search:searchresults-created-on-label")
                                : t("search:searchresults-applicant-label")}
                        </span>
                        {viewAllKey == "awaitingSubmissionDetails"
                            ? formatDates(item.createdon)
                            : _.has(detailsObj, [
                                  "_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue",
                              ])
                            ? detailsObj[
                                  "_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
                              ]
                            : viewAllKey == "myRepresentations"
                            ? searchDetailsObj[key][
                                  "_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
                              ]
                            : resultsArr[key][
                                  "_customerid_value@OData.Community.Display.V1.FormattedValue"
                              ]}
                    </dd>
                    <dd className="govuk-summary-list__value govuk-!-font-size-16">
                        <span className="results-visually-hidden">
                            {t("search:searchresults-authority-label")}:
                        </span>
                        {viewAllKey == "awaitingSubmissionDetails" &&
                        _.has(resultsArr[key], "pinswg_lpaname")
                            ? router.locale == "cy"
                                ? jsonpath({
                                      path:
                                          '$..[?(@ && @.value=="' +
                                          resultsArr[key].pinswg_lpaname +
                                          '")].value_cy',
                                      json: transLookup,
                                      eval: true,
                                  })
                                : resultsArr[key].pinswg_lpaname || "N/A"
                            : ""}
                        {_.has(resultsArr[key], [
                            "_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue",
                        ])
                            ? router.locale == "cy"
                                ? jsonpath({
                                      path:
                                          '$..[?(@ && @.value=="' +
                                          resultsArr[key][
                                              "_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue"
                                          ] +
                                          '")].value_cy',
                                      json: transLookup,
                                      eval: true,
                                  })
                                : resultsArr[key][
                                      "_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue"
                                  ] || "N/A"
                            : ""}
                        {_.has(searchDetailsObj[key], [
                            "_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue",
                        ])
                            ? router.locale == "cy"
                                ? jsonpath({
                                      path:
                                          '$..[?(@ && @.value=="' +
                                          searchDetailsObj[key].value[0][
                                              "_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValuee"
                                          ] +
                                          '")].value_cy',
                                      json: transLookup,
                                      eval: true,
                                  })
                                : viewAllKey == "myRepresentations"
                                ? searchDetailsObj[key].value
                                : searchDetailsObj[key].value[0][
                                      "_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue"
                                  ] || "N/A"
                            : ""}
                        {_.has(resultsArr[key], [
                            "_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue",
                        ])
                            ? router.locale == "cy"
                                ? jsonpath({
                                      path:
                                          '$..[?(@ && @.value=="' +
                                          resultsArr[key][
                                              "_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValuee"
                                          ] +
                                          '")].value_cy',
                                      json: transLookup,
                                      eval: true,
                                  })
                                : resultsArr[key][
                                      "_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue"
                                  ] ||
                                  (viewAllKey == "myRepresentations"
                                      ? ""
                                      : "N/A")
                            : viewAllKey == "myRepresentations" &&
                              router.locale == "cy" &&
                              jsonpath({
                                  path:
                                      '$..[?(@ && @.value=="' +
                                      searchDetailsObj[key][
                                          "_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue"
                                      ] +
                                      '")].value_cy',
                                  json: transLookup,
                                  eval: true,
                              })}
                    </dd>
                    <dd className="govuk-summary-list__value govuk-!-font-size-16">
                        <span className="results-visually-hidden">
                            {t("search:searchresults-case-type-label")}:
                        </span>

                        {viewAllKey == "awaitingSubmissionDetails"
                            ? router.locale == "cy"
                                ? jsonpath({
                                      path:
                                          '$..[?(@ && @.value=="' +
                                          getFormCollectionByID(
                                              item.pinswg_appealcasetype
                                          ).value +
                                          '")].value_cy',
                                      json: transLookup,
                                      eval: true,
                                  })
                                : getFormCollectionByID(
                                      item.pinswg_appealcasetype
                                  ).value || "N/A"
                            : router.locale == "cy"
                            ? jsonpath({
                                  path:
                                      '$..[?(@ && @.value=="' +
                                      item[
                                          "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"
                                      ] +
                                      '")].value_cy',
                                  json: transLookup,
                                  eval: true,
                              })
                            : item[
                                  "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"
                              ] ||
                              (viewAllKey == "myRepresentations" ? "" : "N/A")}

                        {viewAllKey == "myRepresentations" &&
                            (router.locale == "cy"
                                ? jsonpath({
                                      path:
                                          '$..[?(@ && @.value=="' +
                                          getFormCollectionByID(
                                              searchDetailsObj[key].appealType
                                          ).value +
                                          '")].value_cy',
                                      json: transLookup,
                                      eval: true,
                                  })[0]
                                : getFormCollectionByID(
                                      searchDetailsObj[key].appealType
                                  ).value)}
                        {_.has(
                            searchDetailsObj[key],
                            "_pinswg_localplanningauthority_value@OData.Community.Display.V1.FormattedValue"
                        )}
                    </dd>
                    <dd className="govuk-summary-list__value govuk-!-font-size-16">
                        <span className="results-visually-hidden">
                            {viewAllKey == "myRepresentations"
                                ? "Created"
                                : t("search:searchresults-status-label")}
                            :
                        </span>

                        {viewAllKey == "awaitingSubmissionDetails"
                            ? router.locale == "cy"
                                ? jsonpath({
                                      path:
                                          '$..[?(@ && @.statuscode=="' +
                                          item.statuscode +
                                          '")].value_cy',
                                      json: transLookup,
                                      eval: true,
                                  })
                                : jsonpath({
                                      path:
                                          '$..[?(@ && @.statuscode=="' +
                                          item.statuscode +
                                          '")].value',
                                      json: transLookup,
                                      eval: true,
                                  }) || "N/A"
                            : viewAllKey == "myRepresentations"
                            ? repRaisedDate(item.repfile_name) // ? router.locale == "cy"
                            : //     ? jsonpath({path:
                            //
                            //           '$..[?(@ && @.value=="' +
                            //               searchDetailsObj[key].value[0][
                            //                   "statuscode@OData.Community.Display.V1.FormattedValue"
                            //               ] +
                            //               '")].value_cy',transLookup,
                            //       )
                            //     : searchDetailsObj[key].value[0][
                            //           "statuscode@OData.Community.Display.V1.FormattedValue"
                            //       ] || "N/A"
                            // : router.locale == "cy"
                            // ? jsonpath({path:
                            //
                            //       '$..[?(@ && @.value=="' +
                            //           item[
                            //               "statuscode@OData.Community.Display.V1.FormattedValue"
                            //           ] +
                            //           '")].value_cy',transLookup,
                            //   )

                            router.locale == "cy"
                            ? jsonpath({
                                  path:
                                      '$..[?(@ && @.value=="' +
                                      item[
                                          "statuscode@OData.Community.Display.V1.FormattedValue"
                                      ] +
                                      '")].value_cy',
                                  json: transLookup,
                                  eval: true,
                              })
                            : item[
                                  "statuscode@OData.Community.Display.V1.FormattedValue"
                              ] || "N/A"}
                    </dd>
                    {viewAllKey == "awaitingSubmissionDetails" && (
                        <dd className="govuk-summary-list__value govuk-!-font-size-16 cardModuleItem ">
                            <button
                                title={t(
                                    "case:do-you-want-to-delete-case-label"
                                )}
                                className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
                                onClick={() => {
                                    confirm(
                                        t(
                                            "case:do-you-want-to-delete-case-label"
                                        ) +
                                            item.ticketnumber +
                                            "?\n" +
                                            t(
                                                "case:do-you-want-to-delete-case-disclaimer-label"
                                            )
                                    ) &&
                                        deleteCaseItem(
                                            props.accountDetails.containerID,
                                            item.ticketnumber
                                        );
                                }}
                            >
                                &mdash;
                            </button>
                        </dd>
                    )}
                    {viewAllKey == "myRepresentations" && (
                        <dd className="govuk-summary-list__value govuk-!-font-size-16 cardModuleItem ">
                            <button
                                title={t(
                                    "case:do-you-want-to-delete-case-label"
                                )}
                                className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
                                onClick={() => {
                                    confirm(
                                        t(
                                            "case:do-you-want-to-delete-case-label"
                                        ) +
                                            item.pinswg_name +
                                            "?\n" +
                                            t(
                                                "case:do-you-want-to-delete-case-disclaimer-label"
                                            )
                                    ) &&
                                        deleteRepItem(
                                            props.accountDetails.containerID,
                                            item.pinswg_name,
                                            item.repfile_name
                                        );
                                }}
                            >
                                &mdash;
                            </button>
                        </dd>
                    )}

                    {viewAllKey == "watchedCases" && (
                        <dd
                            className="govuk-summary-list__value govuk-!-font-size-16 cardModuleItem govuk-!-font-size-14 govuk-summary-list__action"
                            style={{ display: "flex", flexDirection: "column" }}
                        >
                            <button
                                title={t("case:stop-watching-case-link")}
                                className="  govuk-summary-list__actionLink watched_link"
                                onClick={() => {
                                    confirm(
                                        t(
                                            "case:you-have-stopped-watching-label"
                                        ) +
                                            item[
                                                "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
                                            ]
                                    ) &&
                                        deleteItem(
                                            item.pinswg_watchlistid,
                                            "watchedCases"
                                        );
                                }}
                            >
                                <span className="eye"></span>
                            </button>
                            {item.pinswg_emailnotifications == true ? (
                                <button
                                    className="govuk-summary-list__actionLink mailLink watched_link"
                                    title={t("common:unsubscribe-title-label")}
                                    onClick={() => {
                                        confirm(
                                            t(
                                                "case:summary-unsubscribe-mail-label"
                                            ) +
                                                item.pinswg_title +
                                                "?"
                                        ) &&
                                            selectEmailNotifications(
                                                props.accountDetails
                                                    .accountDetails
                                                    .emailaddress1,
                                                props.accountDetails
                                                    .loggedinUserId,
                                                item._pinswg_watchedcase_value,
                                                item.pinswg_appealcasetype,
                                                null
                                            );
                                    }}
                                >
                                    <span className="mailicon icon"></span>
                                </button>
                            ) : (
                                <button
                                    className="govuk-summary-list__actionLink mailLink"
                                    title={t("common:subscribe-title-label")}
                                    onClick={() => {
                                        confirm(
                                            t(
                                                "case:summary-subscribe-mail-label"
                                            ) +
                                                item.pinswg_title +
                                                "?"
                                        ) &&
                                            selectEmailNotifications(
                                                props.accountDetails
                                                    .accountDetails
                                                    .emailaddress1,
                                                props.accountDetails
                                                    .loggedinUserId,
                                                item._pinswg_watchedcase_value,
                                                item.pinswg_appealcasetype,
                                                true
                                            );
                                    }}
                                >
                                    <span className="mailicon icon"></span>
                                </button>
                            )}
                        </dd>
                    )}
                </div>
            );
        });
    };

    const sortDataBy = (whichField) => {
        setOrderbyState(whichField);
        setfieldSortState("asc");

        getSearchPageResults(1, whichField, fieldSortState);
        whichField == orderByState
            ? fieldSortState == "desc"
                ? setfieldSortState("asc")
                : setfieldSortState("desc")
            : setfieldSortState("asc");
        //setCurrentPage(1);
        //setShowSpinnerState(true);
    };

    const getSearchPageResults = useCallback(
        (pageNumber, orderBy, fieldSort) => {
            //console.log(advancedSearch, searchString, pageNumber);
            //console.log(pageNumber, orderBy, fieldSort);
            resultsArr.sort(dynamicSort(orderBy, fieldSort));
            //console.log(resultsArr);
        },
        [selectedOption]
    );

    function dynamicSort(property, order) {
        var sort_order = 1;
        if (order === "desc") {
            sort_order = -1;
        }
        return function (a, b) {
            // a should come before b in the sorted order
            if (a[property] < b[property]) {
                return -1 * sort_order;
                // a should come after b in the sorted order
            } else if (a[property] > b[property]) {
                return 1 * sort_order;
                // a and b are the same
            } else {
                return 0 * sort_order;
            }
        };
    }

    const deleteCaseItem = (containerID, caseID) => {
        let cookies = parseCookies();
        //console.log("sssss", containerID, caseID);

        deleteAwaitingSubmissionsFromBlob(containerID, caseID)
            .then((data) => {
                return data;
            })
            .then(() => {
                getAwaitingSubmissionFromBlobProxy(containerID)
                    .then((data) => {
                        setAwaitingSubmissionFromBlob(data);
                        setAwaitingSubmissionDetails(data);
                    })
                    .then(() => {
                        setCurrentView({
                            "viewName": "Awaiting Submission",
                            "viewKey": "awaitingSubmissionDetails",
                        });
                    });
            });
    };

    const deleteRepItem = (containerID, caseID, repfile) => {
        let cookies = parseCookies();
        //console.log("sssss", containerID, caseID, repfile);

        deleteMyRepresentationsFromBlob(containerID, caseID, repfile)
            .then((data) => {
                return data;
            })
            .then(() => {
                getRepsFromBlobProxy(containerID)
                    .then((data) => {
                        setMyRepresentations(data);
                        setMyRepresentationsDetails(data);
                    })
                    .catch((error) => {
                        consoleLogger(error);
                        res.status(400).json(error);
                    })
                    .then(() => {
                        setCurrentView({
                            "viewName": "My Representations",
                            "viewKey": "myRepresentations",
                        });
                    });
            });
    };

    const deleteItem = (caseID, topThreeType) => {
        let cookies = parseCookies();
        //console.log("sssss", caseID, topThreeType);
        topThreeType == "watchedCases" &&
            deleteWatchedCases(caseID)
                .then((data) => data)
                .then(() => {
                    getWatchedCasesProxy(cookies.pinsUser).then((data) => {
                        let showWatchedCases = (submittedArr) => {
                            const required = submittedArr.value.filter((el) => {
                                return (
                                    el.pinswg_representationsubmitted == null
                                );
                            });

                            let newObj = {};
                            return Object.assign(newObj, {
                                "@odata.count": required.length,
                                "value": required,
                            });
                        };

                        data = showWatchedCases(data);

                        data.value.sort(function compare(a, b) {
                            var dateA = new Date(a.createdon);
                            var dateB = new Date(b.createdon);
                            return dateB - dateA;
                        });
                        setWatchedCases(data),
                            getDetailsProxy(data, "myWatchedCases")
                                .then((data) => {
                                    setWatchedCasesDetails(data);
                                })
                                .then(() => {
                                    setCurrentView({
                                        "viewName": "Watched Cases",
                                        "viewKey": "watchedCases",
                                    });
                                });
                    });
                });
    };

    const isEmailSignUp = (whichIncident) => {
        let isEmail = jsonpath({
            path:
                "$[?(@ && @._pinswg_watchedcase_value=='" +
                whichIncident +
                "' && @.pinswg_emailnotifications==true)]",

            json: resultsArr,
            eval: true,
        });
        return isEmail;
    };

    const selectEmailNotifications = (
        emailaddress,
        loggedInUser,
        incidentID,
        appealType,
        updateEmailNotifications
    ) => {
        let updateBody = {
            "pinswg_WatchedCase@odata.bind": "/incidents(" + incidentID + ")",
            "pinswg_Contact@odata.bind": "/contacts(" + loggedInUser + ")",
            "pinswg_appealcasetype": appealType,
            "pinswg_emailnotifications": updateEmailNotifications,
        };

        console.log("Email signed up");
        createWatchedCases(updateBody)
            .then((data) => data)
            .then(() => {
                getWatchedCasesProxy(props.accountDetails.loggedinUserId).then(
                    (data) => {
                        let showWatchedCases = (submittedArr) => {
                            const required = submittedArr.value.filter((el) => {
                                return (
                                    el.pinswg_representationsubmitted == null
                                );
                            });

                            let newObj = {};
                            return Object.assign(newObj, {
                                "@odata.count": required.length,
                                "value": required,
                            });
                        };

                        data = showWatchedCases(data);

                        data.value.sort(function compare(a, b) {
                            var dateA = new Date(a.createdon);
                            var dateB = new Date(b.createdon);
                            return dateB - dateA;
                        });

                        setWatchedCases(data);
                        getDetailsProxy(data, "myWatchedCases")
                            .then((data) => {
                                setWatchedCasesDetails(data);
                            })
                            .then(() => {
                                setCurrentView({
                                    "viewName": "Watched Cases",
                                    "viewKey": "watchedCases",
                                });
                            });
                    }
                );
            });
    };

    buildResultsRowArr();
    return (
        <>
            <div className="govuk-grid-row">
                <div className="govuk-grid-column-full">
                    <h1 className="govuk-heading-xl govuk-!-margin-bottom-7">
                        {viewAllKey == "awaitingSubmissionDetails" &&
                            t("myportal:awatitingsubmission-card-title")}
                        {viewAllKey == "watchedCases" &&
                            t("myportal:watchedcases-card-title")}
                        {viewAllKey == "myCases" &&
                            t("myportal:mycases-card-title")}
                        {viewAllKey == "myRepresentations" &&
                            t("myportal:myrepresentations-card-title")}
                        {viewAllKey == "mySubmittedReps" &&
                            "Submitted representations"}
                    </h1>

                    {resultsRowArr.length == 0 ? (
                        <h3>
                            {" "}
                            There are no{" "}
                            {viewAllKey == "awaitingSubmissionDetails" &&
                                t("myportal:awatitingsubmission-card-title")}
                            {viewAllKey == "watchedCases" &&
                                t("myportal:watchedcases-card-title")}
                            {viewAllKey == "myCases" &&
                                t("myportal:mycases-card-title")}
                            {viewAllKey == "myRepresentations" &&
                                t("myportal:myrepresentations-card-title")}{" "}
                            records
                        </h3>
                    ) : (
                        <dl className="govuk-summary-list govuk-!-margin-bottom-9 results">
                            <div className="govuk-summary-list__row results-headings">
                                <dd className="govuk-summary-list__key govuk-!-font-size-16 results_wider  govuk-!-padding-left-2">
                                    <button
                                        type="button"
                                        onClick={() =>
                                            sortDataBy(
                                                viewAllKey ==
                                                    "awaitingSubmissionDetails"
                                                    ? "title"
                                                    : "pinswg_title"
                                            )
                                        }
                                        className={
                                            orderByState ==
                                            (viewAllKey ==
                                            "awaitingSubmissionDetails"
                                                ? "title"
                                                : "pinswg_title")
                                                ? fieldSortState == "asc"
                                                    ? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
                                                    : `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
                                                : `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
                                        }
                                    >
                                        {t(
                                            "search:searchresults-case-reference-label"
                                        )}
                                    </button>
                                </dd>
                                <dd className="govuk-summary-list__key govuk-!-font-size-16">
                                    {t(
                                        "search:searchresults-site-address-label"
                                    )}
                                </dd>
                                {viewAllKey == "awaitingSubmissionDetails" ? (
                                    <dd className="govuk-summary-list__key govuk-!-font-size-16">
                                        <button
                                            type="button"
                                            onClick={() =>
                                                sortDataBy("createdon")
                                            }
                                            className={
                                                orderByState == "createdon"
                                                    ? fieldSortState == "asc"
                                                        ? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
                                                        : `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
                                                    : `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
                                            }
                                        >
                                            {t(
                                                "search:searchresults-created-on-label"
                                            )}{" "}
                                        </button>
                                    </dd>
                                ) : (
                                    <dd className="govuk-summary-list__key govuk-!-font-size-16">
                                        {t(
                                            "search:searchresults-applicant-label"
                                        )}
                                    </dd>
                                )}
                                <dd className="govuk-summary-list__key govuk-!-font-size-16">
                                    <button
                                        type="button"
                                        onClick={() =>
                                            sortDataBy(
                                                viewAllKey ==
                                                    "awaitingSubmissionDetails"
                                                    ? "pinswg_lpaname"
                                                    : "_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue"
                                            )
                                        }
                                        className={
                                            orderByState ==
                                            (viewAllKey ==
                                            "awaitingSubmissionDetails"
                                                ? "pinswg_lpaname"
                                                : "_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue")
                                                ? fieldSortState == "asc"
                                                    ? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
                                                    : `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
                                                : `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
                                        }
                                    >
                                        {t(
                                            "search:searchresults-authority-label"
                                        )}{" "}
                                    </button>
                                </dd>
                                <dd className="govuk-summary-list__key govuk-!-font-size-16">
                                    {viewAllKey !=
                                    "awaitingSubmissionDetails" ? (
                                        <button
                                            type="button"
                                            onClick={() =>
                                                sortDataBy(
                                                    "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"
                                                )
                                            }
                                            className={
                                                orderByState ==
                                                (viewAllKey ==
                                                "awaitingSubmissionDetails"
                                                    ? "pinswg_lpaname"
                                                    : "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue")
                                                    ? fieldSortState == "asc"
                                                        ? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
                                                        : `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
                                                    : `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
                                            }
                                        >
                                            {t(
                                                "search:searchresults-case-type-label"
                                            )}{" "}
                                        </button>
                                    ) : (
                                        t(
                                            "search:searchresults-case-type-label"
                                        )
                                    )}{" "}
                                </dd>
                                <dd className="govuk-summary-list__key govuk-!-font-size-16">
                                    {viewAllKey == "myRepresentations" ? (
                                        <button
                                            type="button"
                                            onClick={() =>
                                                sortDataBy("createdDate")
                                            }
                                            className={
                                                orderByState == "createdDate"
                                                    ? fieldSortState == "asc"
                                                        ? `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortAsc`
                                                        : `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16 sortDesc`
                                                    : `govuk-link govuk-link--no-underline govuk-!-font-weight-bold govuk-!-font-size-16`
                                            }
                                        >
                                            Created{" "}
                                        </button>
                                    ) : (
                                        t("search:searchresults-status-label")
                                    )}
                                </dd>
                            </div>
                            {showSpinnerState == true ? (
                                <div className="govuk-summary-list__row">
                                    <div className="govuk-!-margin-top-9 govuk-!-margin-bottom-9 govuk-!-font-weight-bold govuk-!-font-size-20  ">
                                        {t("common:spinner-fetching-data")}
                                        <img
                                            className="data-loading-icon"
                                            src="/assets/images/loading.gif"
                                            alt={
                                                router.locale == "cy"
                                                    ? "Nôl data"
                                                    : "Fetching data"
                                            }
                                        />
                                    </div>
                                </div>
                            ) : (
                                resultsRowArr
                            )}
                        </dl>
                    )}
                </div>
            </div>
            <div className="govuk-grid-row">
                <div className="govuk-grid-column-full">
                    <div className="govuk-button-group">
                        <a
                            onClick={() => router.replace("/myportal")}
                            className="govuk-button"
                        >
                            Back
                        </a>
                    </div>
                </div>
            </div>
        </>
    );
};

const mapStateToProps = (state) => {
    return {
        currentView: state.currentView,
        accountDetails: state.accountDetails,
        // search: state.search,
        // searchResultsObj: state.searchResultsObj,
    };
};

const mapDispatchToProps = (dispatch) => {
    return {
        setCurrentReference: (currentReference) => {
            dispatch(setCurrentReference(currentReference));
        },
        setSearchResults: (searchResultsObj) => {
            dispatch(setSearchResults(searchResultsObj));
        },
        setSearchDetails: (searchDetailsObj) => {
            dispatch(setSearchDetails(searchDetailsObj));
        },
        setAwaitingSubmissionFromBlob: (awaitingSubmission) => {
            dispatch(setAwaitingSubmissionFromBlob(awaitingSubmission));
        },
        setAwaitingSubmissionDetails: (awaitingSubmission) => {
            dispatch(setAwaitingSubmissionDetails(awaitingSubmission));
        },
        setWatchedCases: (watchedCases) => {
            dispatch(setWatchedCases(watchedCases));
        },
        setWatchedCasesDetails: (watchedCasesDetails) => {
            dispatch(setWatchedCasesDetails(watchedCasesDetails));
        },
        setWatchedCasesDetails: (watchedCasesDetails) => {
            dispatch(setWatchedCasesDetails(watchedCasesDetails));
        },
        setMyRepresentations: (myRepresentations) => {
            dispatch(setMyRepresentations(myRepresentations));
        },
        setMyRepresentationsDetails: (myRepresentationsDetails) => {
            dispatch(setMyRepresentationsDetails(myRepresentationsDetails));
        },
    };
};

export default connect(mapStateToProps, mapDispatchToProps)(ViewAllResults);