import Link from "next/link";
import _ from "lodash";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import { setCurrentReference } from "../../store/currentView/action";
import { connect } from "react-redux";
import { parseCookies } from "nookies";
import {
    getWatchedCasesProxy,
    getPortalModuleDetailsProxy,
    deleteWatchedCases,
    deleteAwaitingSubmissions,
    getAwaitingSubmissionProxy,
} from "../../actions";
import jsonpath from "jsonpath";
import transLookup from "../../data/lookuptranslations.json";
import {
    setWatchedCases,
    setWatchedCasesDetails,
} from "../../store/watchedCases/action";
import {
    setAwaitingSubmission,
    setAwaitingSubmissionDetails,
} from "../../store/awaitingSubmission/action";
import { getFormCollectionByID } from "../../components/utils";

const TopThree = (props) => {
    let { t } = useTranslation();
    const {
        showTopThree,
        showDetails,
        setCurrentReference,
        topThreeType,
        setWatchedCases,
        setWatchedCasesDetails,
        setAwaitingSubmission,
        setAwaitingSubmissionDetails,
    } = props;

    const router = useRouter();
    const { locale } = router;

    let topthreeRow = [];

    let showTopThreeArr = showTopThree.value;

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

        topThreeType == "awaitingSubmission" &&
            deleteAwaitingSubmissions(caseID)
                .then((data) => {
                    console.log("zzzzz");

                    return data;
                })
                .then(() => {
                    console.log("qqqqqq");
                    getAwaitingSubmissionProxy(cookies.pinsUser).then(
                        (data) => {
                            console.log("assss", data);
                            setAwaitingSubmission(data),
                                getDetails(data, "awaitingSubmission").then(
                                    (data) => {
                                        console.log(
                                            "submission get details:",
                                            data
                                        );
                                        setAwaitingSubmissionDetails(data);
                                    }
                                );
                        }
                    );
                });
    };

    const getDetails = (resultsObj, detailsType) => {
        //console.log(resultsObj);
        let detailsArr = [];
        resultsObj = resultsObj.value;
        const detailsObj = resultsObj.map((searchDetail, index) => {
            if (searchDetail.pinswg_appealcasetype == null) {
                console.log(
                    detailsType != "myWatchedCases"
                        ? searchDetail.ticketnumber
                        : searchDetail[
                              "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
                          ]
                );
            } else {
                detailsArr.push(
                    getPortalModuleDetailsProxy(
                        getFormCollectionByID(
                            searchDetail.pinswg_appealcasetype
                        ).LogicalCollectionName,
                        detailsType != "myWatchedCases"
                            ? searchDetail.ticketnumber
                            : searchDetail[
                                  "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
                              ]
                    )
                );
            }
        });
        //console.log(detailsArr);
        return Promise.all(detailsArr);
    };

    const getIncidentId = (topThreeType, objArr) => {
        switch (topThreeType) {
            case "myCases":
                return objArr.incidentid;
                break;
            case "watchedCases":
                return objArr._pinswg_watchedcase_value;
                break;
            case "myRepresentations":
                return objArr.ticketnumber;
                break;
            case "awaitingSubmission":
                return objArr.ticketnumber;
                break;
            default:
            // code block
        }
    };

    let topThreeOnlyArr = showTopThreeArr.slice(0, 3);
    Object.keys(topThreeOnlyArr).map((key, index) => {
        topthreeRow.push(
            <div className="cardModuleItem" key={index}>
                <div className="cardModuleDetails">
                    <div className="cardModuleReference">
                        <b>{t("myportal:case-reference")}:</b>
                        <Link
                            href={
                                topThreeType == "awaitingSubmission"
                                    ? router.locale == "cy"
                                        ? "/fymhorth/parhauigyflwyno"
                                        : "/myportal" +
                                          "/" +
                                          getFormCollectionByID(
                                              showTopThreeArr[key]
                                                  .pinswg_appealcasetype
                                          ).UrlName +
                                          "?lpa=" +
                                          showTopThreeArr[key][
                                              "_pinswg_associatedlpa_value"
                                          ] +
                                          "&apt=" +
                                          showTopThreeArr[key]
                                              .pinswg_appealcasetype +
                                          "&casereference=" +
                                          showTopThreeArr[key].pinswg_title +
                                          "&inid=" +
                                          showTopThreeArr[key].incidentid
                                    : router.locale == "cy"
                                    ? "/fymhorth/achos"
                                    : "/myportal/case"
                            }
                        >
                            <a
                                className="govuk-link--no-underline"
                                data-id={index}
                                onClick={() => {
                                    topThreeType == "awaitingSubmission" &&
                                        console.log(
                                            "appealDetails"
                                            // props.props.awaitingSubmission
                                        );
                                    setCurrentReference({
                                        "currentReference":
                                            topThreeType != "watchedCases"
                                                ? topThreeType !=
                                                  "myRepresentations"
                                                    ? showTopThreeArr[key]
                                                          .ticketnumber
                                                    : showTopThreeArr[key][
                                                          "_pinswg_case_value@OData.Community.Display.V1.FormattedValue"
                                                      ]
                                                : showTopThreeArr[key][
                                                      "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
                                                  ],
                                        "currentType": topThreeType,

                                        "incidentid": getIncidentId(
                                            topThreeType,
                                            showTopThreeArr[key]
                                        ),

                                        "appealType":
                                            showTopThreeArr[key]
                                                .pinswg_appealcasetype,
                                    });
                                }}
                            >
                                {topThreeType != "watchedCases"
                                    ? topThreeType != "myRepresentations"
                                        ? showTopThreeArr[key].ticketnumber
                                        : showTopThreeArr[key][
                                              "_pinswg_case_value@OData.Community.Display.V1.FormattedValue"
                                          ]
                                    : showTopThreeArr[key][
                                          "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
                                      ]}{" "}
                            </a>
                        </Link>
                    </div>
                    {(topThreeType == "awaitingSubmission" ||
                        topThreeType == "watchedCases") && (
                        <div>
                            {
                                showTopThreeArr[key][
                                    "pinswg_appealcasetype@OData.Community.Display.V1.FormattedValue"
                                ]
                            }
                        </div>
                    )}
                    {topThreeType != "awaitingSubmission" ? (
                        <div className="carModuleAddress">
                            <b>{t("myportal:case-address")}:</b>{" "}
                            {_.isEmpty(showDetails)
                                ? t("myportal:case-address-not-entered")
                                : _.isEmpty(showDetails[index])
                                ? t("myportal:case-address-not-entered")
                                : _.isEmpty(showDetails[index].value[0])
                                ? t("myportal:case-address-not-entered")
                                : _.isEmpty(
                                      showDetails[index].value[0]
                                          .pinswg_siteaddressline1
                                  )
                                ? t("myportal:case-address-not-entered")
                                : showDetails[index].value[0]
                                      .pinswg_siteaddressline1}
                        </div>
                    ) : (
                        ""
                    )}
                    {router.locale == "cy"
                        ? jsonpath.query(
                              transLookup,
                              '$..[?(@.value=="' +
                                  showTopThreeArr[key][
                                      "_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue"
                                  ] +
                                  '")].value_cy'
                          )
                        : showTopThreeArr[key][
                              "_pinswg_associatedlpa_value@OData.Community.Display.V1.FormattedValue"
                          ] || ""}
                    {topThreeType == "awaitingSubmission" ? (
                        <div className="carModuleAddress">
                            Case Incomplete, not submitted
                        </div>
                    ) : (
                        ""
                    )}
                </div>
                {topThreeType == "watchedCases" && (
                    <div className="">
                        <a
                            href="#"
                            className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
                            onClick={() => {
                                event.preventDefault();
                                deleteItem(
                                    showTopThreeArr[key].pinswg_watchlistid,
                                    "watchedCases"
                                );
                                alert(
                                    "You have stopped watching case " +
                                        showTopThreeArr[key][
                                            "_pinswg_watchedcase_value@OData.Community.Display.V1.FormattedValue"
                                        ]
                                );
                            }}
                        >
                            &mdash;
                        </a>
                    </div>
                )}
                {topThreeType == "awaitingSubmission" && (
                    <div className="">
                        <a
                            href="#"
                            className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
                            onClick={() => {
                                event.preventDefault();
                                deleteItem(
                                    showTopThreeArr[key].incidentid,
                                    "awaitingSubmission"
                                );
                                alert(
                                    "You have deleted case " +
                                        showTopThreeArr[key].ticketnumber
                                );
                            }}
                        >
                            &mdash;
                        </a>
                    </div>
                )}
            </div>
        );
    });

    let noRecordsLabel = "";
    switch (topThreeType) {
        case "watchedCases":
            noRecordsLabel = t("myportal:norecords-watched-cases");
            break;
        case "myRepresentations":
            noRecordsLabel = t("myportal:norecords-representations");
            break;
        case "myCases":
            noRecordsLabel = t("myportal:norecords-cases");
            break;
        case "awaitingSubmission":
            noRecordsLabel = t("myportal:norecords-awaiting-submissions");
            break;
    }
    return (
        <>
            {topthreeRow.length == 0 ? (
                <div>{noRecordsLabel}</div>
            ) : (
                topthreeRow
            )}
        </>
    );
};

const mapDispatchToProps = (dispatch) => {
    return {
        setCurrentReference: (currentReference) => {
            dispatch(setCurrentReference(currentReference));
        },
        setWatchedCases: (watchedCases) => {
            dispatch(setWatchedCases(watchedCases));
        },
        setWatchedCasesDetails: (watchedCasesDetails) => {
            dispatch(setWatchedCasesDetails(watchedCasesDetails));
        },
        setAwaitingSubmission: (awaitingSubmission) => {
            dispatch(setAwaitingSubmission(awaitingSubmission));
        },
        setAwaitingSubmissionDetails: (awaitingSubmissionDetails) => {
            dispatch(setAwaitingSubmissionDetails(awaitingSubmissionDetails));
        },
    };
};

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