pedwfrontend/components/myportal/awaitingsubmissionfromblob.js

import Link from "next/link";
import { useRouter } from "next/router";
import useTranslation from "next-translate/useTranslation";
import TopThree from "./topthree";
import { connect } from "react-redux";
import {
    setCurrentView,
    setCurrentReference,
} from "../../store/currentView/action";
import { JSONPath as jsonpath } from "jsonpath-plus";
import transLookup from "../../data/lookuptranslations.json";
import {
    deleteAwaitingSubmissionsFromBlob,
    getAwaitingSubmissionFromBlobProxy,
} from "../../actions";
import { setAwaitingSubmissionFromBlob } from "../../store/awaitingSubmission/action";
import { parseCookies, setCookie, destroyCookie } from "nookies";
import { getFormCollectionByID } from "../../components/utils";

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

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

    let topthreeRow = [];
    let showTopThreeArr = props.awaitingSubmissionFromBlob.value;
    let showTopThreeArrDets = props.awaitingSubmissionFromBlob.case;

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

        deleteAwaitingSubmissionsFromBlob(containerID, caseID)
            .then((data) => {
                return data;
            })
            .then(() => {
                getAwaitingSubmissionFromBlobProxy(containerID).then((data) => {
                    props.setAwaitingSubmissionFromBlob(data);
                });
            });
    };

    let topThreeOnlyArr = showTopThreeArr.slice(0, 3);
    //console.log(showTopThreeArr);
    Object.keys(topThreeOnlyArr).map((key, index) => {
        //console.log(key, showTopThreeArr[key].pinswg_appealcasetype);
        //console.log("subsssss:", showTopThreeArr[key]);
        let urlname = getFormCollectionByID(
            showTopThreeArr[key].pinswg_appealcasetype
        ).UrlName;

        topthreeRow.push(
            <div className="cardModuleItem" key={index}>
                <div className="cardModuleDetails">
                    <div className="cardModuleReference">
                        <b>{t("myportal:case-reference")}:</b>

                        <Link
                            href={
                                (router.locale == "cy"
                                    ? "/fymhorth"
                                    : "/myportal") +
                                "/" +
                                urlname +
                                "?lpa=" +
                                showTopThreeArr[key][
                                    "_pinswg_associatedlpa_value"
                                ] +
                                "&apt=" +
                                showTopThreeArr[key].pinswg_appealcasetype +
                                "&casereference=" +
                                showTopThreeArr[key].pinswg_name +
                                "&inid=" +
                                showTopThreeArr[key].incidentid
                            }
                            className="govuk-link--no-underline"
                            data-id={index}
                            onClick={() => {
                                props.setCurrentReference({
                                    "currentReference":
                                        showTopThreeArr[key].ticketnumber,

                                    "currentType": "awaitingSubmission",

                                    "incidentid":
                                        showTopThreeArr[key].incidentid,

                                    "appealType":
                                        showTopThreeArr[key]
                                            .pinswg_appealcasetype,
                                });
                            }}
                        >
                            {showTopThreeArr[index].pinswg_name}
                        </Link>
                    </div>
                    <div>
                        <b>LPA reference:</b>{" "}
                        {showTopThreeArr[key].pinswg_lpaapplicationreference}
                    </div>
                    <div>
                        <b>{t("myportal:appeal-type-label")}:</b>{" "}
                        {
                            getFormCollectionByID(
                                showTopThreeArr[key].pinswg_appealcasetype
                            ).value
                        }
                    </div>
                    <div className="carModuleAddress">
                        <b>{t("myportal:case-address")}:</b>{" "}
                        {_.isEmpty(showTopThreeArr)
                            ? t("myportal:case-address-not-entered")
                            : _.isEmpty(showTopThreeArr[index])
                            ? t("myportal:case-address-not-entered")
                            : _.isEmpty(showTopThreeArr[index])
                            ? t("myportal:case-address-not-entered")
                            : _.isEmpty(
                                  showTopThreeArr[index].pinswg_siteaddressline1
                              )
                            ? t("myportal:case-address-not-entered")
                            : showTopThreeArr[index].pinswg_siteaddressline1 +
                              (!_.isEmpty(
                                  showTopThreeArr[index].pinswg_siteaddressline2
                              )
                                  ? ", " +
                                    showTopThreeArr[index]
                                        .pinswg_siteaddressline2
                                  : "") +
                              (!_.isEmpty(
                                  showTopThreeArr[index].pinswg_siteaddresstown
                              )
                                  ? ", " +
                                    showTopThreeArr[index]
                                        .pinswg_siteaddresstown
                                  : "")}
                    </div>
                    {showTopThreeArrDets[key].pinswg_appellantagent != null && (
                        <div>
                            {showTopThreeArrDets[key].pinswg_appellantagent !=
                                846040000 && (
                                <b>{t("myportal:raised-by-label")}: </b>
                            )}
                            {showTopThreeArrDets[key].pinswg_appellantagent !=
                                846040000 &&
                                (showTopThreeArrDets[key]
                                    .pinswg_agentcompanyname != null &&
                                    showTopThreeArrDets[key]
                                        .pinswg_agentcompanyname + ", ") +
                                    showTopThreeArrDets[key]
                                        .pinswg_agentfirstname +
                                    " " +
                                    showTopThreeArrDets[key]
                                        .pinswg_agentlastname}
                        </div>
                    )}
                    {showTopThreeArrDets[key].pinswg_appellantfirstname !=
                        null && (
                        <div>
                            <b>{t("myportal:on-behalf-of-label")}: </b>
                            {showTopThreeArrDets[key]
                                .pinswg_appellantfirstname +
                                " " +
                                showTopThreeArrDets[key]
                                    .pinswg_appellantlastname}
                        </div>
                    )}
                    {router.locale == "cy"
                        ? jsonpath(
                              '$..[?(@.value=="' +
                                  showTopThreeArrDets[key]["pinswg_lpaname"] +
                                  '")].value_cy',
                              transLookup
                          )
                        : showTopThreeArrDets[key]["pinswg_lpaname"] || ""}
                </div>
                <div className="">
                    <button
                        className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
                        onClick={() => {
                            confirm(
                                t("case:do-you-want-to-delete-case-label") +
                                    showTopThreeArr[key].pinswg_name +
                                    "?\n" +
                                    t(
                                        "case:do-you-want-to-delete-case-disclaimer-label"
                                    )
                            ) &&
                                deleteCaseItem(
                                    props.containerID,
                                    showTopThreeArr[key].pinswg_name
                                );
                        }}
                    >
                        &mdash;
                    </button>
                </div>
            </div>
        );
    });

    return (
        <div className="card" id="awaiting-submission-card">
            <div className="card-body">
                <h3 className="heading-small card-heading">
                    {t("myportal:awatitingsubmission-card-title")}
                </h3>
                <div className="cardModuleContainer">
                    {topthreeRow}
                    {/* <TopThree
                        showTopThree={props.awaitingSubmissionFromBlob}
                        showDetails={props.awaitingSubmissionFromBlob}
                        topThreeType={"awaitingSubmissionFromBlob"}
                    /> */}
                </div>
                {props.awaitingSubmissionFromBlob["@odata.count"] > 3 && (
                    <div className="cardVieAll">
                        <Link
                            href={
                                router.locale != "en"
                                    ? "/" +
                                      router.locale +
                                      "/fymhorth/gweldpopeth"
                                    : "/myportal/viewall"
                            }
                            className="govuk-link--no-underline"
                            onClick={() => {
                                setCurrentView({
                                    "viewName": "Awaiting Submission",
                                    "viewKey": "awaitingSubmissionDetails",
                                });
                            }}
                        >
                            {t("myportal:viewall-link")}
                        </Link>
                    </div>
                )}
            </div>
        </div>
    );
};

const mapDispatchToProps = (dispatch) => {
    return {
        setCurrentView: (currentView) => {
            dispatch(setCurrentView(currentView));
        },
        setCurrentReference: (currentReference) => {
            dispatch(setCurrentReference(currentReference));
        },
        setAwaitingSubmissionFromBlob: (awaitingSubmission) => {
            dispatch(setAwaitingSubmissionFromBlob(awaitingSubmission));
        },
    };
};

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