import { JSONPath as jsonpath } from "jsonpath-plus";
import _ from "lodash";
import useTranslation from "next-translate/useTranslation";
import Link from "next/link";
import { useRouter } from "next/router";
import { useEffect, useState } from "react";
import { connect } from "react-redux";
import transLookup from "../../data/lookuptranslations.json";
import Documents from "./documents";

import {
    createWatchedCases,
    deleteWatchedCases,
    getLinkedCases,
    getPortalModuleDetailsProxy,
    getWatchedCasesProxy,
    setCaseInvolvment,
} from "../../actions";
import {
    setCurrentLinkedCases,
    setCurrentReference,
    setCurrentView,
} from "../../store/currentView/action";

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

import { signIn, useSession } from "next-auth/react";
import { destroyCookie, parseCookies, setCookie } from "nookies";
import { getFormCollectionByID, getDetailsProxy } from "../utils";

import Pinswg_advertsid from "./summaryTypes/pinswg_advertsid";
import Pinswg_callinss77id from "./summaryTypes/pinswg_callinss77id";
import Pinswg_commonlandid from "./summaryTypes/pinswg_commonlandid";
import Pinswg_communityinfrastructurelevyid from "./summaryTypes/pinswg_communityinfrastructurelevyid";
import Pinswg_compulsorypurchaseordersid from "./summaryTypes/pinswg_compulsorypurchaseordersid";
import Pinswg_dnsid from "./summaryTypes/pinswg_dnsid";
import Pinswg_electricityactid from "./summaryTypes/pinswg_electricityactid";
import Pinswg_enforcementlistedbuildingconseid from "./summaryTypes/pinswg_enforcementlistedbuildingconseid";
import Pinswg_enforcementnoticeappeals174id from "./summaryTypes/pinswg_enforcementnoticeappeals174id";
import Pinswg_environmentalpermittingid from "./summaryTypes/pinswg_environmentalpermittingid";
import Pinswg_harbourrevisionorderid from "./summaryTypes/pinswg_harbourrevisionorderid";
import Pinswg_hedgeshedgerowstreepreservatioid from "./summaryTypes/pinswg_hedgeshedgerowstreepreservatioid";
import Pinswg_householderappealhasid from "./summaryTypes/pinswg_householderappealhasid";
import Pinswg_lawfuldevelopmentcertificatappid from "./summaryTypes/pinswg_lawfuldevelopmentcertificatappid";
import Pinswg_ldpid from "./summaryTypes/pinswg_ldpid";
import Pinswg_listedbuildingandconservationrid from "./summaryTypes/pinswg_listedbuildingandconservationrid";
import Pinswg_maintenanceoflands217id from "./summaryTypes/pinswg_maintenanceoflands217id";
import Pinswg_miscellaneouscasewordid from "./summaryTypes/pinswg_miscellaneouscasewordid";
import Pinswg_nonvalidationid from "./summaryTypes/pinswg_nonvalidationid";
import Pinswg_planningappeals78id from "./summaryTypes/pinswg_planningappeals78id";
import Pinswg_planningconditionss73s79id from "./summaryTypes/pinswg_planningconditionss73s79id";
import Pinswg_planningobligationappeals106id from "./summaryTypes/pinswg_planningobligationappeals106id";
import Pinswg_rowid from "./summaryTypes/pinswg_rowid";
import Pinswg_transportandworkactid from "./summaryTypes/pinswg_transportandworkactid";
import Pinswg_wayleaveid from "./summaryTypes/pinswg_wayleaveid";
import CaseNoticeBanner from "./caseNoticeBanner";
import WatchModal from "./watchmodal";

const CaseSummary = (props) => {
    let { t } = useTranslation();

    const router = useRouter();
    const { locale } = router;
    const {
        appealTypeID,
        incidentid,
        caseReference,
        myCases,
        myRepresentations,
        watchedCases,
        awaitingSubmission,
        searchResultsObj,
        searchDetailsObj,
        directSearchResultsObj,
        currentType,
        setCurrentLinkedCases,
        linkedCasesReference,
        setCurrentReference,
        setWatchedCases,
        setWatchedCasesDetails,
        showMap,
        currentView,
        messagesObj,
        docsOffline,
        ticketnumber,
    } = props;

    const showLoginCheck =
        currentType == "directResultsObj" ? "true" : currentView.showLogin;
    const { data: session, status } = useSession();

    const [isModalOpen, setIsModalOpen] = useState(false);

    const handleOpenModal = () => {
        setIsModalOpen(true);
    };

    const handleCloseModal = () => {
        setIsModalOpen(false);
    };

    const cookies = parseCookies();

    const isLPA =
        props.accountDetails.accountDetails[
            "pinswg_typeofinvolvement@OData.Community.Display.V1.FormattedValue"
        ] == "LPA"
            ? true
            : false;

    let ShowDocLinks = false;
    let checkShowDocLinks = docsOffline != false ? true : false;

    const getDocLink = (docsOffline) => {
        var startTime = docsOffline.split(",")[0];
        var endTime = docsOffline.split(",")[1];

        // console.log(startTime);
        // console.log(endTime);

        var currentDate = new Date();

        var startDate = new Date(currentDate.getTime());
        startDate.setHours(startTime.split(":")[0]);
        startDate.setMinutes(startTime.split(":")[1]);
        startDate.setSeconds(startTime.split(":")[2]);

        var endDate = new Date(currentDate.getTime());
        endDate.setHours(endTime.split(":")[0]);
        endDate.setMinutes(endTime.split(":")[1]);
        endDate.setSeconds(endTime.split(":")[2]);

        // console.log(startDate);
        // console.log(endDate);
        // console.log(currentDate);

        var valid = startDate < currentDate && endDate > currentDate;
        ShowDocLinks = valid;
    };

    checkShowDocLinks && getDocLink(docsOffline);

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

        createWatchedCases(updateBody)
            .then((data) => data)
            .then(() => {
                getWatchedCasesProxy(loggedInUser).then((data) => {
                    setWatchedCases(data),
                        getDetailsProxy(data, "myWatchedCases").then((data) => {
                            setWatchedCasesDetails(data);
                        });
                });
            });

        //setCaseInvolvment(incidentid, loggedInUser);
    };

    const isWatchedCase = (whichIncident) => {
        let isWatched = jsonpath({
            path:
                "$..value[?(@ && @._pinswg_watchedcase_value=='" +
                whichIncident +
                "')]",
            json: watchedCases,
            eval: true,
        });

        return isWatched;
    };

    const deleteItem = (caseID, topThreeType) => {
        let cookies = parseCookies();
        topThreeType == "watchedCases" &&
            deleteWatchedCases(caseID)
                .then((data) => data)
                .then(() => {
                    getWatchedCasesProxy(cookies.pinsUser).then((data) => {
                        setWatchedCases(data),
                            getDetailsProxy(data, "myWatchedCases").then(
                                (data) => {
                                    setWatchedCasesDetails(data);
                                }
                            );
                    });
                });
    };

    const noRepresentationLink = ["/dnsdetails", "/dns/[developmentName]"];

    let setCaseQueryObj =
        currentType == "directResultsObj"
            ? props.searchResultsObj
            : props[currentType];
    let setCaseDetailsObj =
        currentType == "directResultsObj"
            ? props.searchDetailsObj
            : props[currentType + "Details"];

    var casesObj = {};

    currentType == "searchResultsObj"
        ? (casesObj = jsonpath({
              path: '$..[?(@ && @.ticketnumber=="' + ticketnumber + '")]',
              json: searchResultsObj,
              eval: true,
          }))
        : currentType == "watchedCases"
        ? (casesObj = jsonpath({
              path: '$..[?(@ && @.ticketnumber=="' + ticketnumber + '")]',
              json: setCaseQueryObj,
              eval: true,
          }))
        : currentType == "myCases"
        ? (casesObj = jsonpath({
              path: '$..[?(@ && @.pinswg_title=="' + caseReference + '")]',
              json: setCaseQueryObj,
              eval: true,
          }))
        : currentType == "directResultsObj"
        ? (casesObj = jsonpath({
              path: '$..[?(@ && @.ticketnumber=="' + ticketnumber + '")]',
              json: setCaseQueryObj,
              eval: true,
          }))
        : (casesObj = jsonpath({
              path: '$..[?(@ && @.reference=="' + caseReference + '")]',
              json: setCaseQueryObj,
              eval: true,
          }));

    casesObj = Object.assign({}, ...casesObj);

    var detailsObj = {};

    currentType == "searchResultsObj"
        ? (detailsObj = jsonpath({
              path: '$..[?(@ && @.pinswg_name=="' + caseReference + '")]',
              json: searchDetailsObj,
              eval: true,
          }))
        : currentType == "directResultsObj"
        ? (detailsObj = setCaseDetailsObj[0].value[0])
        : (detailsObj = jsonpath({
              path: '$..[?(@ && @.pinswg_name=="' + caseReference + '")]',
              jsopn: setCaseDetailsObj,
              eval: true,
          }));

    detailsObj = typeof detailsObj == "object" ? detailsObj : detailsObj[0];

    let showDetails = typeof detailsObj != "undefined" ? true : false;

    var timestamp = showDetails
        ? detailsObj.hasOwnProperty("pinswg_representation_period_end_date")
            ? Date.parse(detailsObj.pinswg_representation_period_end_date)
            : "n/a"
        : "n/a";

    if (isNaN(timestamp) == false) {
        var d = new Date(timestamp);
    }

    let hasEndDate = typeof d != "undefined";

    let showDetailsBlock =
        showDetails == true ? (
            <>
                <div className="govuk-grid-row">
                    <div className="govuk-grid-column-full">
                        <h1 className="govuk-heading-xl govuk-!-margin-bottom-7">
                            {t("case:summary-reference-label")}:{" "}
                            {currentType == "searchResultsObj"
                                ? detailsObj.pinswg_name
                                : currentType == "directResultsObj"
                                ? casesObj.title
                                : currentType == "watchedCases"
                                ? casesObj.pinswg_title
                                : casesObj.reference}
                        </h1>
                        {props.messagesObj["@odata.count"] > 0 && (
                            <CaseNoticeBanner messagesObj={props.messagesObj} />
                        )}
                        <dl className="govuk-summary-list govuk-!-margin-bottom-9">
                            <div className="govuk-summary-list__row">
                                <dt className="govuk-summary-list__key">
                                    {getFormCollectionByID(
                                        appealTypeID ||
                                            setCaseQueryObj.value[0]
                                                .pinswg_appealcasetype
                                    ).PrimaryIdAttribute == "pinswg_dnsid"
                                        ? t("case:summary-applicantonly-label")
                                        : getFormCollectionByID(
                                              appealTypeID ||
                                                  setCaseQueryObj.value[0]
                                                      .pinswg_appealcasetype
                                          ).PrimaryIdAttribute ==
                                          "pinswg_nonvalidationid"
                                        ? t("case:summary-appellantonly-label")
                                        : t("case:summary-applicant-label")}
                                </dt>
                                <dd className="govuk-summary-list__value">
                                    {casesObj.pinswg_appellantagent == 846040001
                                        ? casesObj.pinswg_appellantfirstname +
                                          " " +
                                          casesObj.pinswg_appellantlastname
                                        : detailsObj[
                                              "_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
                                          ] || "not entered"}
                                </dd>
                            </div>
                            {detailsObj.pinswg_agentcontactname != null &&
                                (_.has(
                                    detailsObj,
                                    "pinswg_agentcontactname"
                                ) ? (
                                    <div className="govuk-summary-list__row">
                                        <dt className="govuk-summary-list__key">
                                            {t("case:summary-agent-label")}
                                        </dt>
                                        <dd className="govuk-summary-list__value">
                                            {_.has(
                                                detailsObj,
                                                "pinswg_agentcontactname"
                                            )
                                                ? detailsObj.pinswg_agentcontactname
                                                : ""}
                                        </dd>
                                    </div>
                                ) : (
                                    ""
                                ))}
                            <div className="govuk-summary-list__row">
                                <dt className="govuk-summary-list__key">
                                    {t("case:summary-site-address-label")}
                                </dt>
                                <dd className="govuk-summary-list__value">
                                    {getFormCollectionByID(
                                        appealTypeID ||
                                            setCaseQueryObj.value[0]
                                                .pinswg_appealcasetype
                                    ).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]
                                            : ""
                                        : ""}
                                    {_.has(
                                        detailsObj,
                                        "pinswg_siteaddressline1"
                                    )
                                        ? detailsObj.pinswg_siteaddressline1
                                        : ""}
                                    {_.has(
                                        detailsObj,
                                        "pinswg_siteaddressline1"
                                    ) &&
                                        detailsObj.pinswg_siteaddressline1 !=
                                            null && <br />}
                                    {_.has(
                                        detailsObj,
                                        "pinswg_siteaddressline2"
                                    )
                                        ? detailsObj.pinswg_siteaddressline2
                                        : ""}
                                    {_.has(
                                        detailsObj,
                                        "pinswg_siteaddressline2"
                                    ) &&
                                        detailsObj.pinswg_siteaddressline2 !=
                                            null && <br />}
                                    {_.has(detailsObj, "pinswg_siteaddresstown")
                                        ? detailsObj.pinswg_siteaddresstown
                                        : ""}
                                    {_.has(
                                        detailsObj,
                                        "pinswg_siteaddresstown"
                                    ) &&
                                        detailsObj.pinswg_siteaddresstown !=
                                            null && <br />}
                                    {_.has(
                                        detailsObj,
                                        "pinswg_siteaddresscounty"
                                    )
                                        ? detailsObj.pinswg_siteaddresscounty
                                        : ""}
                                    {_.has(
                                        detailsObj,
                                        "pinswg_siteaddresscounty"
                                    ) &&
                                        detailsObj.pinswg_siteaddresscounty !=
                                            null && <br />}
                                    {_.has(
                                        detailsObj,
                                        "pinswg_siteaddresspostcode"
                                    )
                                        ? detailsObj.pinswg_siteaddresspostcode
                                        : ""}
                                </dd>
                            </div>
                            {casesObj.description != null && (
                                <div className="govuk-summary-list__row">
                                    <dt className="govuk-summary-list__key">
                                        {t("case:summary-description-label")}
                                    </dt>
                                    <dd className="govuk-summary-list__value">
                                        {casesObj.description.indexOf(";") < 0
                                            ? casesObj.description
                                            : router.locale == "cy"
                                            ? casesObj.description.split(";")[1]
                                            : casesObj.description.split(
                                                  ";"
                                              )[0]}
                                    </dd>
                                </div>
                            )}
                            {detailsObj.pinswg_casestage != null && (
                                <div className="govuk-summary-list__row">
                                    <dt className="govuk-summary-list__key">
                                        {t("case:summary-case-stage-label")}
                                    </dt>
                                    <dd className="govuk-summary-list__value">
                                        {router.locale == "cy"
                                            ? jsonpath({
                                                  path:
                                                      '$..[?(@ && @.value=="' +
                                                      detailsObj[
                                                          "pinswg_casestage@OData.Community.Display.V1.FormattedValue"
                                                      ] +
                                                      '")].value_cy',
                                                  json: transLookup,
                                                  eval: true,
                                              })
                                            : detailsObj[
                                                  "pinswg_casestage@OData.Community.Display.V1.FormattedValue"
                                              ] ||
                                              t(
                                                  "case:summary-no-date-entered-label"
                                              )}
                                    </dd>
                                </div>
                            )}
                            <div className="govuk-summary-list__row">
                                <dt className="govuk-summary-list__key">
                                    {t("case:summary-last-modified-label")}
                                </dt>
                                <dd className="govuk-summary-list__value">
                                    {detailsObj.modifiedon > casesObj.modifiedon
                                        ? formatDates(detailsObj.modifiedon)
                                        : formatDates(casesObj.modifiedon)}
                                </dd>
                            </div>
                        </dl>
                    </div>
                </div>

                {showLoginCheck == "true" && (
                    <>
                        <div className="govuk-grid-row">
                            <div className="govuk-grid-column-full">
                                <div className="govuk-button-group">
                                    {(_.has(detailsObj, "pinswg_startdate") ||
                                        _.has(
                                            detailsObj,
                                            "pinswg_applicationacceptedasvalid"
                                        ) ||
                                        _.has(
                                            detailsObj,
                                            "pinswg_startdates"
                                        )) &&
                                        showReps(
                                            detailsObj.pinswg_startdate ||
                                                detailsObj.pinswg_startdates ||
                                                detailsObj.pinswg_applicationacceptedasvalid,
                                            detailsObj.pinswg_finalcommentsduedate ||
                                                detailsObj.pinswg_endofrepresentationperiod
                                        ) && (
                                            <>
                                                {showRepButton(
                                                    props.currentView
                                                        .caseReference
                                                        .appealType
                                                ) ? (
                                                    <>
                                                        {ShowDocLinks ? (
                                                            <div className="govuk-warning-text ">
                                                                <span
                                                                    className="govuk-warning-text__icon"
                                                                    aria-hidden="true"
                                                                >
                                                                    !
                                                                </span>
                                                                <strong className="govuk-warning-text__text govuk-!-margin-top-2">
                                                                    <span className="govuk-visually-hidden">
                                                                        Notice
                                                                    </span>
                                                                    {t(
                                                                        "case:docsoffline-reps-label"
                                                                    )}
                                                                </strong>
                                                            </div>
                                                        ) : (
                                                            <div>
                                                                <Link
                                                                    href={{
                                                                        pathname:
                                                                            "/myportal/representation",
                                                                        query: {
                                                                            case:
                                                                                currentType ==
                                                                                "searchResultsObj"
                                                                                    ? detailsObj.ticketnumber
                                                                                    : currentType ==
                                                                                      "watchedCases"
                                                                                    ? casesObj.pinswg_title
                                                                                    : currentType ==
                                                                                      "directResultsObj"
                                                                                    ? detailsObj.ticketnumber
                                                                                    : casesObj.reference,
                                                                        },
                                                                    }}
                                                                    className="govuk-button"
                                                                >
                                                                    {t(
                                                                        "case:summary-make-representation-label"
                                                                    )}
                                                                </Link>
                                                            </div>
                                                        )}
                                                        <a
                                                            onClick={() => {
                                                                //spinnerState();
                                                                router.back();
                                                            }}
                                                            className="govuk-button govuk-button--secondary"
                                                        >
                                                            {t(
                                                                "case:summary-back-button-label"
                                                            )}
                                                        </a>
                                                    </>
                                                ) : !isLPA &&
                                                  props.currentView
                                                      .caseReference
                                                      .appealType ==
                                                      846040004 ? (
                                                    ""
                                                ) : (
                                                    <>
                                                        <div className="govuk-grid-column-full govuk-!-padding-left-0">
                                                            <div className="govuk-button-group">
                                                                <p className="govuk-body">
                                                                    {t(
                                                                        "case:representation-date-passed-label",
                                                                        {
                                                                            startDate:
                                                                                formatDates(
                                                                                    detailsObj.pinswg_startdate
                                                                                ),
                                                                            endDate:
                                                                                props
                                                                                    .currentView
                                                                                    .caseReference
                                                                                    .appealType ==
                                                                                846040019
                                                                                    ? formatDates(
                                                                                          detailsObj.pinswg_statementduedate
                                                                                      )
                                                                                    : formatDates(
                                                                                          detailsObj.pinswg_finalcommentsduedate
                                                                                      ),
                                                                        }
                                                                    )}
                                                                    <br />{" "}
                                                                    {t(
                                                                        "case:representation-date-passed-additional-label"
                                                                    )}{" "}
                                                                    <Link
                                                                        href={
                                                                            "mailto:" +
                                                                            t(
                                                                                "home:login-contact-email"
                                                                            )
                                                                        }
                                                                    >
                                                                        {t(
                                                                            "home:login-contact-email"
                                                                        )}
                                                                    </Link>
                                                                </p>
                                                            </div>
                                                        </div>
                                                    </>
                                                )}
                                            </>
                                        )}
                                    <div className="govuk-body">
                                        {session &&
                                            (isWatchedCase(
                                                props.currentView.caseReference
                                                    .incidentid
                                            ).length >
                                                0 ==
                                            true ? (
                                                <button
                                                    className="govuk-link watchCase"
                                                    onClick={() => {
                                                        confirm(
                                                            t(
                                                                "case:you-have-stopped-watching-label"
                                                            ) +
                                                                props
                                                                    .currentView
                                                                    .caseReference
                                                                    .currentReference +
                                                                "?"
                                                        ) &&
                                                            deleteItem(
                                                                isWatchedCase(
                                                                    props
                                                                        .currentView
                                                                        .caseReference
                                                                        .incidentid
                                                                )[0]
                                                                    .pinswg_watchlistid,

                                                                "watchedCases"
                                                            ),
                                                            setCurrentView({
                                                                "viewName":
                                                                    "Watched Cases",
                                                                "viewKey":
                                                                    "watchedCases",
                                                            });
                                                        setCurrentReference({
                                                            "ticketnumber":
                                                                props
                                                                    .currentView
                                                                    .caseReference
                                                                    .currentReference,
                                                            "currentReference":
                                                                props
                                                                    .currentView
                                                                    .caseReference
                                                                    .currentReference,
                                                            "currentType":
                                                                "searchResultsObj",
                                                            "incidentid":
                                                                props
                                                                    .currentView
                                                                    .caseReference
                                                                    .incidentid,
                                                            "appealType":
                                                                props
                                                                    .currentView
                                                                    .caseReference
                                                                    .appealType,
                                                            "showMap": showMap,
                                                        });
                                                    }}
                                                    title={t(
                                                        "case:stop-watching-case-link"
                                                    )}
                                                >
                                                    {t(
                                                        "case:stop-watching-case-link"
                                                    )}{" "}
                                                </button>
                                            ) : (
                                                <>
                                                    <button
                                                        className="govuk-link watchCase"
                                                        onClick={() => {
                                                            confirm(
                                                                t(
                                                                    "case:you-are-watching-label"
                                                                ) +
                                                                    " " +
                                                                    props
                                                                        .currentView
                                                                        .caseReference
                                                                        .currentReference +
                                                                    "?"
                                                            ) &&
                                                                selectWatchedCase(
                                                                    props
                                                                        .accountDetails
                                                                        .loggedinUserId,
                                                                    props
                                                                        .currentView
                                                                        .caseReference
                                                                        .incidentid,
                                                                    props
                                                                        .currentView
                                                                        .caseReference
                                                                        .appealType
                                                                );
                                                        }}
                                                    >
                                                        {t(
                                                            "case:watch-this-case-link"
                                                        )}
                                                    </button>
                                                    {/* <button
                                                        onClick={
                                                            handleOpenModal
                                                        }
                                                    >
                                                        Open Modal
                                                    </button> */}
                                                </>
                                            ))}

                                        {!session && (
                                            <>
                                                <button
                                                    className="govuk-link watchCase"
                                                    onClick={() => {
                                                        confirm(
                                                            "Trying to watch case " +
                                                                props
                                                                    .currentView
                                                                    .caseReference
                                                                    .currentReference +
                                                                "\n\nYou will now be prompted to sign in"
                                                        ) &&
                                                            // signIn("email", {
                                                            //     callbackUrl:
                                                            //         "/myportal/case/" +
                                                            //         props
                                                            //             .currentView
                                                            //             .caseReference
                                                            //             .ticketnumber,
                                                            // });

                                                            setCookie(
                                                                null,
                                                                "pedwWatchCase",
                                                                currentType ==
                                                                    "searchResultsObj"
                                                                    ? detailsObj.pinswg_name
                                                                    : currentType ==
                                                                      "directResultsObj"
                                                                    ? casesObj.title
                                                                    : casesObj.reference,
                                                                {
                                                                    path: "/",
                                                                    expires:
                                                                        expDate,
                                                                }
                                                            ),
                                                            signIn();
                                                    }}
                                                    title={t(
                                                        "case:watch-this-case-link"
                                                    )}
                                                >
                                                    {t(
                                                        "case:watch-this-case-link"
                                                    )}
                                                </button>
                                                {/* <button
                                                    onClick={handleOpenModal}
                                                >
                                                    Open Modal
                                                </button> */}
                                            </>
                                        )}
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div className="govuk-grid-row">
                            <div className="govuk-grid-column-full">
                                {_.has(detailsObj, "pinswg_startdate") &&
                                    (detailsObj.pinswg_startdate != null ||
                                        detailsObj.pinswg_finalcommentsduedate !=
                                            null) &&
                                    showRepsEnded(
                                        detailsObj.pinswg_startdate,
                                        detailsObj.pinswg_finalcommentsduedate
                                    ) && (
                                        <div className="govuk-body">
                                            {t(
                                                "case:representation-period-ended-on-label"
                                            )}
                                            {props.currentView.caseReference
                                                .appealType == 846040019
                                                ? formatDates(
                                                      detailsObj.pinswg_statementduedate
                                                  )
                                                : formatDates(
                                                      detailsObj.pinswg_finalcommentsduedate
                                                  )}
                                        </div>
                                    )}
                            </div>
                        </div>
                    </>
                )}

                {showSummary(casesObj, detailsObj)}
                <Documents
                    incidentid={
                        props.incidentid || setCaseQueryObj.value[0].incidentid
                    }
                    caseReference={props.caseReference}
                    searchResultsObj={props.searchResultsObj}
                    searchDetailsObj={props.searchDetailsObj}
                    documentDetailsObj={props.documentDetailsObj}
                    docsOffline={docsOffline}
                    showFilteredDocs={props.showFilteredDocs}
                />
                {/* <WatchModal
                    isOpen={isModalOpen}
                    onClose={handleCloseModal}
                    casesObj={casesObj}
                    currentType={currentType}
                    props={props}
                /> */}
            </>
        ) : (
            <>
                <div>
                    <div className="govuk-grid-row">
                        <div className="govuk-grid-column-full">
                            <h1>{t("case:summary-no-details-label")}</h1>
                        </div>
                    </div>
                </div>
                {showLoginCheck == "true" && (
                    <div className="govuk-grid-row">
                        <div className="govuk-grid-column-full">
                            <div className="govuk-button-group">
                                {noRepresentationLink.includes(
                                    router.pathname
                                ) == true ? (
                                    ""
                                ) : ShowDocLinks ? (
                                    <div className="govuk-warning-text ">
                                        <span
                                            className="govuk-warning-text__icon"
                                            aria-hidden="true"
                                        >
                                            !
                                        </span>
                                        <strong className="govuk-warning-text__text govuk-!-margin-top-2">
                                            <span className="govuk-visually-hidden">
                                                Notice
                                            </span>
                                            {t("case:docsoffline-reps-label")}
                                        </strong>
                                    </div>
                                ) : (
                                    <div>
                                        <Link
                                            href="/representation"
                                            className="govuk-button"
                                        >
                                            {t(
                                                "case:summary-make-representation-label"
                                            )}
                                        </Link>
                                    </div>
                                )}

                                <a
                                    onClick={() => {
                                        // spinnerState();
                                        router.back();
                                    }}
                                    className="govuk-button govuk-button--secondary"
                                >
                                    {t("case:summary-back-button-label")}
                                </a>
                            </div>
                        </div>
                    </div>
                )}
            </>
        );

    function showSummary(casesObj, detailsObj) {
        let appealIDObj = getFormCollectionByID(
            appealTypeID || setCaseQueryObj.value[0].pinswg_appealcasetype
        ).PrimaryIdAttribute;

        switch (appealIDObj) {
            case "pinswg_advertsid":
                return (
                    <Pinswg_advertsid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_callinss77id":
                return (
                    <Pinswg_callinss77id
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_commonlandid":
                return (
                    <Pinswg_commonlandid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_communityinfrastructurelevyid":
                return (
                    <Pinswg_communityinfrastructurelevyid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;

            case "pinswg_compulsorypurchaseordersid":
                return (
                    <Pinswg_compulsorypurchaseordersid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_dnsid":
                return (
                    <Pinswg_dnsid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                        showMap={showMap}
                    />
                );
                break;
            case "pinswg_electricityactid":
                return (
                    <Pinswg_electricityactid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_enforcementlistedbuildingconseid":
                return (
                    <Pinswg_enforcementlistedbuildingconseid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_enforcementnoticeappeals174id":
                return (
                    <Pinswg_enforcementnoticeappeals174id
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_enforcementpermittingid":
                return (
                    <Pinswg_environmentalpermittingid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_harbourrevisionorderid":
                return (
                    <Pinswg_harbourrevisionorderid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_hedgeshedgerowstreepreservatioid":
                return (
                    <Pinswg_hedgeshedgerowstreepreservatioid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_householderappealhasid":
                return (
                    <Pinswg_householderappealhasid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_lawfuldevelopmentcertificatappid":
                return (
                    <Pinswg_lawfuldevelopmentcertificatappid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_ldpid":
                return (
                    <Pinswg_ldpid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_listedbuildingandconservationrid":
                return (
                    <Pinswg_listedbuildingandconservationrid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_maintenanceoflands217id":
                return (
                    <Pinswg_maintenanceoflands217id
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_miscellaneouscasewordid":
                return (
                    <Pinswg_miscellaneouscasewordid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_nonvalidationid":
                return (
                    <Pinswg_nonvalidationid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_planningappeals78id":
                return (
                    <Pinswg_planningappeals78id
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;

            case "pinswg_planningconditionss73s79id":
                return (
                    <Pinswg_planningconditionss73s79id
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;

            case "pinswg_planningobligationappeals106id":
                return (
                    <Pinswg_planningobligationappeals106id
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_rowid":
                return (
                    <Pinswg_rowid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_transportandworkactid":
                return (
                    <Pinswg_transportandworkactid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
            case "pinswg_wayleaveid":
                return (
                    <Pinswg_wayleaveid
                        casesObj={casesObj}
                        detailsObj={detailsObj}
                        formatDates={formatDates}
                        linkedCasesList={linkedCasesList}
                        currentView={props.currentView}
                    />
                );
                break;
        }
    }

    useEffect(() => {
        const linkCaseObj = async () => {
            let docObj = await getLinkedCases(
                incidentid || setCaseQueryObj.value[0].incidentid
            ).then((data) => {
                //console.log(data);
                setCurrentLinkedCases(data);
                return data;
            });

            return linkCaseObj;
        };

        const linkedCases = linkCaseObj();
    }, [incidentid, setCurrentLinkedCases]);

    let now = new Date();
    let expDate = new Date(now);

    expDate.setDate(now.getDate() + 365);

    function formatDates(dateObj, showTime) {
        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();
        var hh = dateObj.getHours();
        hh = ("0" + hh).slice(-2);
        var mins = dateObj.getMinutes();
        mins = ("0" + mins).slice(-2);

        const dateStr = showTime
            ? hh == 0 && mins == 0
                ? ""
                : hh + ":" + mins
            : dd + "/" + mm + "/" + yyyy + " ";
        return dateStr;
    }

    function linkedCasesList(linkedCasesReference) {
        //console.log(linkedCasesReference);

        linkedCasesReference = linkedCasesReference.value || [];

        return (
            <>
                <ul className="govuk-list govuk-!-font-size-16">
                    {linkedCasesReference.map((item, key) => {
                        return (
                            <li key={key}>
                                <Link
                                    href={
                                        router.locale == "cy"
                                            ? "/canlyniadauchwilio?q=" +
                                              item.title +
                                              "&lk=1"
                                            : "/searchresults?q=" +
                                              item.title +
                                              "&lk=1"
                                    }
                                    className=""
                                >
                                    {item.title}
                                </Link>
                            </li>
                        );
                        //console.log(item.incidentid, item.title);
                    })}
                </ul>
            </>
        );
    }

    function showReps(startDate, endDate) {
        let date = new Date();
        date = new Date(date.toDateString());
        const start = new Date(startDate);
        const end = new Date(endDate);

        return date >= start && date <= end ? true : false;
    }

    function showRepButton(appealType) {
        switch (appealType) {
            case 846040012:
            case 846040013:
            case 846040014:
            //for ROW case 846040015:
            case 846040020:
            case 846040021:
            case 846040023:
            case 846040024:
                return false;
            case 846040004:
                return isLPA ? true : false;

            case 846040015:
                return props.searchDetailsObj[0].value[0]
                    .pinswg_specialistcaseprocess == 846040001
                    ? showReps(
                          props.searchDetailsObj[0].value[0].pinswg_startdate,
                          props.searchDetailsObj[0].value[0]
                              .pinswg_finalcommentsduedate
                      )
                    : true;

            case 846040018:
                let shouldShow =
                    props.searchDetailsObj[0].value[0]
                        .pinswg_speacialistcaseprocess == 846040000 && isLPA
                        ? true
                        : props.searchDetailsObj[0].value[0]
                              .pinswg_speacialistcaseprocess == 846040001
                        ? true
                        : false;

                return shouldShow;

            case 846040019:
                return showReps(
                    props.searchDetailsObj[0].value[0].pinswg_startdate,
                    props.searchDetailsObj[0].value[0].pinswg_statementduedate
                );

            default:
                return true;
        }
    }

    function showRepsEnded(startDate, endDate) {
        let date = new Date();
        date = new Date(date.toDateString());
        const start = new Date(startDate);
        const end = new Date(endDate);
        return date > start && date > end ? true : false;
    }

    if (status == "authenticated" && cookies.pedwWatchCase != null) {
        selectWatchedCase(
            props.accountDetails.accountDetails.contactid,
            incidentid,
            appealTypeID
        );
        destroyCookie({}, "pedwWatchCase", { path: "/" });
    }

    return <>{showDetailsBlock}</>;
};

const mapStateToProps = (state) => {
    return {
        accountDetails: state.accountDetails,
        currentView: state.currentView,
        search: state.search,
        // searchResultsObj: state.searchResultsObj,
        documentDetailsObj: state.searchResultsObj.documentDetailsObj,
        formData: state.formData,
        appealType: state.appealType,
        form: state.form,
        myCases: state.myCases,
        watchedCases: state.watchedCases,
        myRepresentations: state.myRepresentations,
        awaitingSubmission: state.awaitingSubmission,
    };
};

const mapDispatchToProps = (dispatch) => {
    return {
        setCurrentLinkedCases: (parentIncidentid) => {
            dispatch(setCurrentLinkedCases(parentIncidentid));
        },
        setCurrentReference: (currentReference) => {
            dispatch(setCurrentReference(currentReference));
        },
        setWatchedCases: (watchedCases) => {
            dispatch(setWatchedCases(watchedCases));
        },
        setWatchedCasesDetails: (watchedCasesDetails) => {
            dispatch(setWatchedCasesDetails(watchedCasesDetails));
        },
        setCurrentView: (currentView) => {
            dispatch(setCurrentView(currentView));
        },
    };
};

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