import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { setCurrentReference } from "../../store/currentView/action";
import { connect } from "react-redux";
import { JSONPath as jsonpath } from "jsonpath-plus";
import transLookup from "../../data/lookuptranslations.json";
import { getFormCollectionByID } from "../../components/utils";
import { useCallback, useState } from "react";
import {
    setSearchResults,
    setSearchDetails,
} from "../../store/searchOutput/action";

const ViewAllResults = (props) => {
    const {
        searchString,
        searchResultsObj,
        currentView,
        setCurrentReference,
        myportal,
        setSearchResults,
    } = 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();
    };
    var resultsArr =
        currentView.viewKey == "awaitingSubmissionDetails"
            ? props["awaitingSubmission"].awaitingSubmissionDetails.case
            : props[currentView.viewKey][currentView.viewKey].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 =
        currentView.viewKey == "awaitingSubmissionDetails"
            ? props["awaitingSubmission"].awaitingSubmissionDetails.value
            : currentView.viewKey == "myRepresentations"
            ? props["myRepresentations"].myRepresentations.value
            : props[currentView.viewKey][currentView.viewKey + "Details"] || [];

    let resultsRowArr = [];
    const buildResultsRowArr = () => {
        resultsArr.map((item, key) => {
            let detailsObj = jsonpath(
                '$..value[?(@.pinswg_name=="' + currentView.viewKey ==
                    "awaitingSubmissionDetails"
                    ? item.title
                    : item.pinswg_title + '")]',
                searchDetailsObj
            );
            detailsObj = detailsObj[0];

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

            // searchDetailsObj[key] =
            //     currentView.viewKey == "myRepresentations"
            //         ? searchDetailsObj[key].value[0]
            //         : searchDetailsObj[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">
                        {currentView.viewKey == "myCases" &&
                        resultsArr[key].pinswg_publishtoweb === false ? (
                            <div className="cardModuleReference">
                                {resultsArr[key].ticketnumber}{" "}
                                <b> {t("myportal:appeal-pending-label")}</b>
                            </div>
                        ) : (
                            <Link
                                href={
                                    currentView.viewKey == "myRepresentations"
                                        ? {
                                              pathname:
                                                  "/myportal/representation",
                                              query: {
                                                  case: resultsArr[key].caseRef,
                                                  state: "edit",
                                              },
                                          }
                                        : currentView.viewKey ==
                                          "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
                                        : router.locale == "cy"
                                        ? myportal == true
                                            ? "/fymhorth/achos"
                                            : "/achos"
                                        : myportal == true
                                        ? "/myportal/case"
                                        : "/case"
                                }
                                onClick={() => {
                                    setCurrentReference({
                                        "ticketnumber":
                                            resultsArr[key].ticketnumber,
                                        "currentReference":
                                            currentView.viewKey !=
                                            "watchedCases"
                                                ? currentView.viewKey ==
                                                  "myRepresentations"
                                                    ? resultsArr[key].caseRef
                                                    : resultsArr[key]
                                                          .ticketnumber
                                                : resultsArr[key][
                                                      "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
                                                  ],

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

                                        "appealType":
                                            resultsArr[key]
                                                .pinswg_appealcasetype,
                                        "repDetails":
                                            currentView.viewKey ==
                                                "myRepresentations" &&
                                            resultsArr[key],
                                    });
                                }}
                            >
                                <span className="results-visually-hidden">
                                    {t(
                                        "search:searchresults-case-reference-label"
                                    )}
                                    :
                                </span>
                                {currentView.viewKey != "watchedCases"
                                    ? currentView.viewKey == "myRepresentations"
                                        ? resultsArr[key].caseRef
                                        : resultsArr[key].ticketnumber
                                    : resultsArr[key][
                                          "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
                                      ]}
                            </Link>
                        )}
                    </dd>
                    <dd className="govuk-summary-list__value govuk-!-font-size-16">
                        <span className="results-visually-hidden">
                            {t("search:searchresults-site-address-label")}:
                        </span>
                        {/* {getFormCollectionByID(appealTypeID).PrimaryIdAttribute ==
                    "pinswg_dnsid"
                        ? detailsObj.pinswg_projectlocation != null
                            ? detailsObj.pinswg_projectlocation.indexOf(";") < 0
                                ? detailsObj.pinswg_projectlocation
                                : router.locale == "cy"
                                ? detailsObj.pinswg_projectlocation.split(
                                      ";"
                                  )[1]
                                : detailsObj.pinswg_projectlocation.split(
                                      ";"
                                  )[0]
                            : ""
                        : ""} */}
                        {currentView.viewKey == "awaitingSubmissionDetails" &&
                        _.has(searchDetailsObj[key], "pinswg_siteaddressline1")
                            ? searchDetailsObj[key].pinswg_siteaddressline1
                            : ""}
                        {_.has(detailsObj, "pinswg_siteaddressline1")
                            ? detailsObj.pinswg_siteaddressline1
                            : ""}
                        {currentView.viewKey == "myRepresentations" &&
                        _.has(searchDetailsObj[key].pinswg_siteaddressline1)
                            ? searchDetailsObj[key].value[0]
                                  .pinswg_siteaddressline1
                            : ""}
                        {_.has(detailsObj, "pinswg_siteaddressline1")
                            ? detailsObj.pinswg_siteaddressline1
                            : ""}
                        {currentView.viewKey == "awaitingSubmissionDetails" &&
                            _.has(
                                searchDetailsObj[key],
                                "pinswg_siteaddressline1"
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddressline1 !=
                                null && <br />}
                        {currentView.viewKey == "myRepresentations" &&
                            _.has(
                                searchDetailsObj[key].pinswg_siteaddressline1
                            ) &&
                            searchDetailsObj[key].value[0]
                                .pinswg_siteaddressline1 != null && <br />}
                        {_.has(detailsObj, "pinswg_siteaddressline1") &&
                            detailsObj.pinswg_siteaddressline1 != null && (
                                <br />
                            )}
                        {currentView.viewKey == "awaitingSubmissionDetails" &&
                        _.has(searchDetailsObj[key], "pinswg_siteaddressline1")
                            ? searchDetailsObj[key].pinswg_siteaddressline2
                            : ""}
                        {currentView.viewKey == "myRepresentations" &&
                        _.has(searchDetailsObj[key].pinswg_siteaddressline1)
                            ? searchDetailsObj[key].pinswg_siteaddressline2
                            : ""}
                        {_.has(detailsObj, "pinswg_siteaddressline1")
                            ? detailsObj.pinswg_siteaddressline2
                            : ""}
                        {currentView.viewKey == "awaitingSubmissionDetails" &&
                            _.has(
                                searchDetailsObj[key],
                                "pinswg_siteaddressline2"
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddressline2 !=
                                null && <br />}

                        {currentView.viewKey == "myRepresentations" &&
                            _.has(
                                searchDetailsObj[key].pinswg_siteaddressline2
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddressline1 !=
                                null && <br />}

                        {_.has(detailsObj, "pinswg_siteaddressline2") &&
                            detailsObj.pinswg_siteaddressline2 != null && (
                                <br />
                            )}
                        {currentView.viewKey == "awaitingSubmissionDetails" &&
                        _.has(searchDetailsObj[key], "pinswg_siteaddresstown")
                            ? searchDetailsObj[key].pinswg_siteaddresstown
                            : ""}
                        {currentView.viewKey == "myRepresentations" &&
                        _.has(searchDetailsObj[key], "pinswg_siteaddresstown")
                            ? searchDetailsObj[key].pinswg_siteaddresstown
                            : ""}
                        {_.has(detailsObj, "pinswg_siteaddresstown")
                            ? detailsObj.pinswg_siteaddresstown
                            : ""}
                        {currentView.viewKey == "awaitingSubmissionDetails" &&
                            _.has(
                                searchDetailsObj[key],
                                "pinswg_siteaddresstown"
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddresstown !=
                                null && <br />}

                        {currentView.viewKey == "myRepresentations" &&
                            _.has(
                                searchDetailsObj[key],
                                "pinswg_siteaddresstown"
                            ) &&
                            searchDetailsObj[key].pinswg_siteaddresstown !=
                                null && <br />}

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

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

                        {currentView.viewKey == "myRepresentations" &&
                            (router.locale == "cy"
                                ? jsonpath(
                                      '$..[?(@.value=="' +
                                          getFormCollectionByID(
                                              searchDetailsObj[key].appealType
                                          ).value +
                                          '")].value_cy',
                                      transLookup
                                  )[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">
                            {currentView.viewKey == "myRepresentations"
                                ? "Created"
                                : t("search:searchresults-status-label")}
                            :
                        </span>

                        {currentView.viewKey == "awaitingSubmissionDetails"
                            ? router.locale == "cy"
                                ? jsonpath(
                                      '$..[?(@.statuscode=="' +
                                          item.statuscode +
                                          '")].value_cy',
                                      transLookup
                                  )
                                : jsonpath(
                                      '$..[?(@.statuscode=="' +
                                          item.statuscode +
                                          '")].value',
                                      transLookup
                                  ) || "N/A"
                            : currentView.viewKey == "myRepresentations"
                            ? repRaisedDate(item.repfile_name) // ? router.locale == "cy"
                            : //     ? jsonpath(
                            //
                            //           '$..[?(@.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(
                            //
                            //       '$..[?(@.value=="' +
                            //           item[
                            //               "statuscode@OData.Community.Display.V1.FormattedValue"
                            //           ] +
                            //           '")].value_cy',transLookup,
                            //   )

                            router.locale == "cy"
                            ? jsonpath(
                                  '$..[?(@.value=="' +
                                      item[
                                          "statuscode@OData.Community.Display.V1.FormattedValue"
                                      ] +
                                      '")].value_cy',
                                  transLookup
                              )
                            : item[
                                  "statuscode@OData.Community.Display.V1.FormattedValue"
                              ] || "N/A"}
                    </dd>
                </div>
            );
        });
    };
    buildResultsRowArr();

    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;
            }
        };
    }

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

                    <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(
                                            currentView.viewKey ==
                                                "awaitingSubmissionDetails"
                                                ? "title"
                                                : "pinswg_title"
                                        )
                                    }
                                    className={
                                        orderByState ==
                                        (currentView.viewKey ==
                                        "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>
                            {currentView.viewKey ==
                            "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(
                                            currentView.viewKey ==
                                                "awaitingSubmissionDetails"
                                                ? "pinswg_lpaname"
                                                : "_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue"
                                        )
                                    }
                                    className={
                                        orderByState ==
                                        (currentView.viewKey ==
                                        "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">
                                {currentView.viewKey !=
                                "awaitingSubmissionDetails" ? (
                                    <button
                                        type="button"
                                        onClick={() =>
                                            sortDataBy(
                                                "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"
                                            )
                                        }
                                        className={
                                            orderByState ==
                                            (currentView.viewKey ==
                                            "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">
                                {currentView.viewKey == "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 mapDispatchToProps = (dispatch) => {
    return {
        setCurrentReference: (currentReference) => {
            dispatch(setCurrentReference(currentReference));
        },
        setSearchResults: (searchResultsObj) => {
            dispatch(setSearchResults(searchResultsObj));
        },
        setSearchDetails: (searchDetailsObj) => {
            dispatch(setSearchDetails(searchDetailsObj));
        },
    };
};

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