import useTranslation from "next-translate/useTranslation";
import Link from "next/link";
import { useRouter } from "next/router";
import { connect } from "react-redux";

import { useSession } from "next-auth/react";
import { setCurrentView } from "../store/currentView/action";
import { change } from "redux-form";

import { setCurrentSection } from "../store/appealType/action";
import {
    setRepresentationCapacity,
    setRepresentationSubmit
} from "../store/currentView/action";
const Breadcrumbs = (props) => {
    const { currentView, setCurrentSection, setRepresentationSubmit } = props;
    const router = useRouter();
    let { t } = useTranslation();

    const { data: session } = useSession();

    const currentReference =
        props?.props?.currentView?.caseReference?.currentReference || "";
    const fallbackSearchTitle =
        props?.props?.searchResultsObj?.searchResultsObj?.value?.[0]?.title ||
        "";
    const caseReferenceDisplay = currentReference || fallbackSearchTitle;

    const myPortalHref =
        router.locale != "en" ? "/" + router.locale + "/fymhorth" : "/myportal";
    const cyMyPortalHref =
        router.locale == "cy" ? "/" + router.locale + "/fymhorth" : "/myportal";
    const caseReference = currentView?.caseReference || {};
    const repDetails = caseReference?.repDetails;
    const hasRepDetails = Object.prototype.hasOwnProperty.call(
        caseReference,
        "repDetails"
    );

    const qcount =
        caseReference.appealType == 846040000 ||
        caseReference.appealType == 846040001 ||
        caseReference.appealType == 846040025 ||
        caseReference.appealType == 846040004 ||
        caseReference.appealType == 846040018 ||
        caseReference.appealType == 846040003 ||
        caseReference.appealType == 846040009 ||
        caseReference.appealType == 846040008
            ? 7
            : caseReference.appealType == 846040005 ||
                caseReference.appealType == 846040006 ||
                caseReference.appealType == 846040007
              ? 9
              : "";

    const { va, adv, ads, key } = router.query;

    const breadcrumbHref = (() => {
        if (va === "true") {
            return {
                pathname: "/myportal/viewall",
                query: { key }
            };
        }

        const base = session ? "/myportal" : "";

        if (adv === "true") {
            return {
                pathname: `${base}/advancedsearchresults`,
                query: router.query
            };
        }

        if (ads === "true") {
            return {
                pathname: `${base}/addresssearchresults`,
                query: router.query
            };
        }

        return {
            pathname: `${base}/searchresults`,
            query: router.query
        };
    })();

    const breadcrumbLabel = (() => {
        if (va === "true") {
            if (key === "awaitingSubmissionDetails")
                return t("myportal:awatitingsubmission-card-title");
        }
        if (key === "watchedCases")
            return t("myportal:watchedcases-card-title");

        if (key === "myCases") return t("myportal:mycases-card-title");

        if (key === "myRepresentations")
            return t("myportal:myrepresentations-card-title");

        if (key === "awaitingSubmissionDetails")
            return t("myportal:awatitingsubmission-card-title");

        if (key === "watchedCases")
            return t("myportal:watchedcases-card-title");

        if (key === "myCases") return t("myportal:mycases-card-title");

        if (key === "myRepresentations")
            return t("myportal:myrepresentations-card-title");

        if (key === "mySubmittedReps") return "Submitted representations";

        if (adv === "true") {
            return t("common:breadcrumb-advanced-search-results");
        }

        if (ads === "true") {
            return t("common:breadcrumb-address-search-results");
        }

        return t("common:breadcrumb-search-results");
    })();
    return (
        <>
            <nav
                aria-label={"Breadcrumb for PEDW"}
                role="navigation"
                data-module="track-click"
            >
                <div className="govuk-breadcrumbs ">
                    <ol className="govuk-breadcrumbs__list">
                        {router.pathname != "/myportal/[appealtypes]" &&
                            router.pathname != "/newappeal" &&
                            router.pathname != "/newappeal/[appealtypes]" &&
                            router.pathname != "/myportal/representation" && (
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={"/"}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:service-name-breadcrumb")}
                                    </Link>
                                </li>
                            )}

                        {router.pathname == "/myportal" && (
                            <li className="govuk-breadcrumbs__list-item">
                                {t("myportal:page-title")}
                            </li>
                        )}
                        {router.pathname == "/myportal/searchresults" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <a
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </a>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-search-results")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/searchresults" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-search-results")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/advancedsearch" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-advanced-search")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/addresssearch" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-address-search")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/myportal/addresssearch" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-address-search")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/myportal/advancedsearch" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-advanced-search")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/myportal/contactus" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:footer-contact-us-link-label")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/addresssearchresults" && (
                            <>
                                {" "}
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? router.locale +
                                                  "/chwiliadcyfeiriadau"
                                                : "/addresssearch"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-address-search")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t(
                                        "common:breadcrumb-address-search-results"
                                    )}
                                </li>
                            </>
                        )}
                        {router.pathname == "/advancedsearchresults" && (
                            <>
                                {" "}
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? router.locale +
                                                  "/advancedsearch"
                                                : "/advancedsearch"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-advanced-search")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t(
                                        "common:breadcrumb-advanced-search-results"
                                    )}
                                </li>
                            </>
                        )}
                        {router.pathname ==
                            "/myportal/advancedsearchresults" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? router.locale +
                                                  "/myportal/advancedsearch"
                                                : "/myportal/advancedsearch"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-advanced-search")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t(
                                        "common:breadcrumb-advanced-search-results"
                                    )}
                                </li>
                            </>
                        )}
                        {router.pathname ==
                            "/myportal/addresssearchresults" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? "/" +
                                                  router.locale +
                                                  "/fymhorth/chwiliadcyfeiriadau"
                                                : "/myportal/addresssearch"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-address-search")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t(
                                        "common:breadcrumb-address-search-results"
                                    )}
                                </li>
                            </>
                        )}
                        {router.pathname == "/newappeal" && (
                            <>
                                {/* <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? "/" +
                                                  router.locale +
                                                  "/fymhorth"
                                                : "/myportal"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("newappeal:parent-page-title")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("newappeal:page-title")}
                                </li> */}
                            </>
                        )}
                        {router.pathname == "/newappeal/[appealtypes]" && (
                            <>
                                {/* <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? "/" +
                                                  router.locale +
                                                  "/fymhorth"
                                                : "/myportal"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("newappeal:parent-page-title")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("newappeal:page-title")}
                                </li> */}

                                {props.appealType.currentSection > 1 &&
                                    (props.appealType.currentSection == 9999 ? (
                                        <li className="govuk-breadcrumbs__list-item">
                                            <Link
                                                href={"/"}
                                                className="govuk-breadcrumbs__link"
                                            >
                                                {t(
                                                    "common:service-name-breadcrumb"
                                                )}
                                            </Link>
                                        </li>
                                    ) : (
                                        <li className="govuk-breadcrumbs__link-item">
                                            <a
                                                className="govuk-breadcrumbs__link"
                                                href="#"
                                                onClick={() =>
                                                    setCurrentSection(
                                                        props.appealType
                                                            .currentSection - 1
                                                    )
                                                }
                                            >
                                                {t("common:back-link")}
                                            </a>
                                        </li>
                                    ))}
                            </>
                        )}
                        {router.pathname == "/myportal/[appealtypes]" && (
                            <>
                                {/* <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? "/" +
                                                  router.locale +
                                                  "/fymhorth"
                                                : "/myportal"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("newappeal:parent-page-title")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("newappeal:page-title")}
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:back-link")} {props.formTitle}
                                </li> */}
                                {props.appealType.currentSection > 1 &&
                                    (props.appealType.currentSection == 9999 ? (
                                        <li className="govuk-breadcrumbs__list-item">
                                            <Link
                                                href={"/"}
                                                className="govuk-breadcrumbs__link"
                                            >
                                                {t(
                                                    "common:service-name-breadcrumb"
                                                )}
                                            </Link>
                                        </li>
                                    ) : (
                                        <>
                                            <li className="govuk-breadcrumbs__list-item backChevron">
                                                <a
                                                    className="govuk-breadcrumbs__link"
                                                    href="#"
                                                    onClick={() =>
                                                        setCurrentSection(
                                                            props.appealType
                                                                .currentSection -
                                                                1
                                                        )
                                                    }
                                                >
                                                    {t("common:back-link")}
                                                </a>
                                            </li>
                                        </>
                                    ))}
                            </>
                        )}
                        {router.pathname == "/newappeal/selectappeal" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("newappeal:parent-page-title")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("newappeal:page-title")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    Select Appeal
                                </li>
                            </>
                        )}
                        {router.pathname == "/viewall" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-your-cases")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/myportal/viewall" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {(currentView.currentView.viewKey ||
                                        router.query.key) ==
                                        "awaitingSubmissionDetails" &&
                                        t(
                                            "myportal:awatitingsubmission-card-title"
                                        )}
                                    {(currentView.currentView.viewKey ||
                                        router.query.key) == "watchedCases" &&
                                        t("myportal:watchedcases-card-title")}
                                    {(currentView.currentView.viewKey ||
                                        router.query.key) == "myCases" &&
                                        t("myportal:mycases-card-title")}
                                    {(currentView.currentView.viewKey ||
                                        router.query.key) ==
                                        "myRepresentations" &&
                                        t(
                                            "myportal:myrepresentations-card-title"
                                        )}
                                    {(currentView.currentView.viewKey ||
                                        router.query.key) ==
                                        "mySubmittedReps" &&
                                        "Submitted representations"}
                                </li>
                            </>
                        )}
                        {router.pathname == "/myportal/case" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? "/" +
                                                  router.locale +
                                                  "/fymhorth"
                                                : "/myportal"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-case-reference")}:{" "}
                                    {currentReference}
                                </li>
                            </>
                        )}
                        {router.pathname == "/case/[ticketnumber]" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={{
                                            pathname:
                                                (session ? "/myportal" : "") +
                                                (router.query.adv == "true"
                                                    ? "/advancedsearchresults"
                                                    : router.query.ads == "true"
                                                      ? "/addresssearchresults"
                                                      : "/searchresults"),
                                            query: router.query
                                        }}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {router.query.ads == "true"
                                            ? t(
                                                  "common:breadcrumb-addresssearch-results"
                                              )
                                            : t(
                                                  "common:breadcrumb-search-results"
                                              )}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-case-reference")}:{" "}
                                    {fallbackSearchTitle}
                                </li>
                            </>
                        )}
                        {router.pathname == "/case/id/[incident]" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? "/" +
                                                  router.locale +
                                                  "/chwiliadcyfeiriadau"
                                                : "/addresssearch"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-address-search")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? "/" +
                                                  router.locale +
                                                  "/canlyniadaucyfeiriadau?" +
                                                  props.props.search
                                                      .searchString
                                                : "/addresssearchresults?" +
                                                  props.props.search
                                                      .searchString
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t(
                                            "common:breadcrumb-address-search-results"
                                        )}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-case-reference")}:{" "}
                                    {currentReference}
                                </li>
                            </>
                        )}
                        {router.pathname == "/myportal/case/id/[incident]" && (
                            <>
                                {" "}
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? "/" +
                                                  router.locale +
                                                  "/fymhorth/chwiliadcyfeiriadau"
                                                : "/myportal/addresssearch"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-address-search")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? "/" +
                                                  router.locale +
                                                  "/fymhorth/canlyniadaucyfeiriadau?" +
                                                  props.props.search
                                                      .searchString
                                                : "/myportal/addresssearchresults?" +
                                                  props.props.search
                                                      .searchString
                                        }
                                        onClick={() => {
                                            // spinnerState();
                                            router.back();
                                        }}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t(
                                            "common:breadcrumb-address-search-results"
                                        )}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-case-reference")}:{" "}
                                    {currentReference}
                                </li>
                            </>
                        )}
                        {router.pathname == "/myportal/case/[ticketnumber]" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={breadcrumbHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {breadcrumbLabel}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-case-reference")}:{" "}
                                    {caseReferenceDisplay}
                                </li>
                            </>
                        )}
                        {router.pathname == "/myportal/dnsapplications" && (
                            <>
                                {" "}
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("dnsCommon:service-name")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/myportal/dnsdetails" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={myPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={"/myportal/dnsapplications"}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("dnsCommon:service-name")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-case-reference")}:{" "}
                                    {currentReference}
                                </li>
                            </>
                        )}
                        {router.pathname ==
                            "/myportal/dns/[developmentName]" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? router.locale + "/fymhorth"
                                                : "/myportal"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={"/myportal/dnsapplications"}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("dnsCommon:service-name")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-case-reference")}:{" "}
                                    {caseReferenceDisplay}
                                </li>
                            </>
                        )}
                        {router.pathname == "/case" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? router.locale +
                                                  "/searchresults?q=" +
                                                  router.query.q +
                                                  "&page=" +
                                                  router.query.page
                                                : "/searchresults?q=" +
                                                  router.query.q +
                                                  "&page=" +
                                                  router.query.page
                                        }
                                        onClick={() => {
                                            // spinnerState();
                                            router.back();
                                        }}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-search-results")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-case-reference")}:{" "}
                                    {currentReference}
                                </li>
                            </>
                        )}
                        {router.pathname == "/myportal/representation" && (
                            <>
                                {/* {session != null && (
                                    <li className="govuk-breadcrumbs__list-item">
                                        <Link
                                            href={
                                                router.locale != "en"
                                                    ? "/" +
                                                      router.locale +
                                                      "/myportal"
                                                    : "/myportal"
                                            }
                                            className="govuk-breadcrumbs__link"
                                        >
                                            {t("common:breadcrumb-my-portal")}
                                        </Link>
                                    </li>
                                )}
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? router.locale +
                                                  "/myportal/case" +
                                                  props.props.currentView
                                                      .caseReference
                                                      .currentReference
                                                : "/myportal/case/" +
                                                  props.props.currentView
                                                      .caseReference
                                                      .currentReference
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {
                                            props.props.currentView
                                                .caseReference.currentReference
                                        }
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t(
                                        "myrepresentations:make-a-representation-for-label"
                                    )}{" "}
                                    {
                                        props.props.currentView.caseReference
                                            .currentReference
                                    }
                                </li> */}

                                {props.currentView.representationSubmit ==
                                    true &&
                                    props.currentView
                                        .representationSubmitConfirmation !=
                                        true && (
                                        <li className="govuk-breadcrumbs__link-item backChevron">
                                            <a
                                                className="govuk-breadcrumbs__link"
                                                href="#"
                                                onClick={() => {
                                                    setRepresentationSubmit(
                                                        qcount
                                                    );
                                                }}
                                            >
                                                {t("common:back-link")}
                                            </a>
                                        </li>
                                    )}
                                {props.currentView.representationSubmit !=
                                    true &&
                                    hasRepDetails &&
                                    repDetails?.representationType !=
                                        "Questionnaire" && (
                                        <li className="govuk-breadcrumbs__link-item backChevron">
                                            <a
                                                className="govuk-breadcrumbs__link"
                                                href="#"
                                                onClick={() => {
                                                    setRepresentationSubmit(
                                                        false
                                                    );
                                                }}
                                            >
                                                {t("common:back-link")}
                                            </a>
                                        </li>
                                    )}
                                {props.currentView.representationSubmit !=
                                    true &&
                                    hasRepDetails &&
                                    repDetails?.representationType ==
                                        "Questionnaire" &&
                                    props.showQuestionnaireSection > 1 && (
                                        <li className="govuk-breadcrumbs__link-item backChevron">
                                            <a
                                                className="govuk-breadcrumbs__link"
                                                href="#"
                                                onClick={() => {
                                                    props.setShowQuestionnaireSection(
                                                        props.showQuestionnaireSection -
                                                            1
                                                    );
                                                    setRepresentationSubmit(
                                                        false
                                                    );
                                                }}
                                            >
                                                {t("common:back-link")}
                                            </a>
                                        </li>
                                    )}
                            </>
                        )}
                        {router.pathname == "/account/personaldetails" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={cyMyPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("account:account-title")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/account/register" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("account:register-new-account-heading")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/account/changepassword" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={cyMyPortalHref}
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("common:breadcrumb-my-portal")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    Update your password
                                </li>
                            </>
                        )}
                        {router.pathname == "/dns" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("dnsCommon:service-name")}
                                </li>
                            </>
                        )}

                        {router.pathname == "/dnsapplications" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("dnsCommon:service-name")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/dnsdetails" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? router.locale +
                                                  "/dnsapplications"
                                                : "/dnsapplications"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("dnsCommon:service-name")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-case-reference")}:{" "}
                                    {currentReference}
                                </li>
                            </>
                        )}
                        {router.pathname == "/dns/[developmentName]" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? router.locale +
                                                  "/dnsapplications"
                                                : "/dnsapplications"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t("dnsCommon:service-name")}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:breadcrumb-case-reference")}:{" "}
                                    {caseReferenceDisplay}
                                </li>
                            </>
                        )}
                        {router.pathname == "/dns/application-process" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    Guidance
                                </li>
                            </>
                        )}
                        {router.pathname == "/dns/help" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    Help
                                </li>
                            </>
                        )}
                        {router.pathname == "/dns/contact-us" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:footer-contact-us-link-label")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/dns/applications" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("dnsApplications:page-title")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/dns/application-view" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    <Link
                                        href={
                                            router.locale != "en"
                                                ? router.locale +
                                                  "/dns/applications"
                                                : "/dns/applications"
                                        }
                                        className="govuk-breadcrumbs__link"
                                    >
                                        {t(
                                            "dnsApplicationView:page-parent-title"
                                        )}
                                    </Link>
                                </li>
                                <li className="govuk-breadcrumbs__list-item">
                                    TWA - Morlais Demonstration Zone
                                </li>
                            </>
                        )}
                        {router.pathname == "/help/cookies" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("cookies:cookie-breadcrumb")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/privacy" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("common:footer-privacy-link-label")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/accessibility" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t(
                                        "common:footer-accessibility-link-label"
                                    )}
                                </li>
                            </>
                        )}
                        {router.pathname == "/details-about-cookies" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("cookies:cookie-policy-title-heading")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/auth/signin" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("auth:auth-page-title")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/auth/verify-request" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("auth:auth-check-email-page-title")}
                                </li>
                            </>
                        )}
                        {router.pathname == "/auth/error" && (
                            <>
                                <li className="govuk-breadcrumbs__list-item">
                                    {t("auth:auth-error-signin-error-title")}
                                </li>
                            </>
                        )}
                    </ol>
                </div>
            </nav>
        </>
    );
};

const mapStateToProps = (state) => {
    return {
        ...state
    };
};

const mapDispatchToProps = (dispatch) => {
    return {
        updateField: (form, field, newValue) =>
            dispatch(change(form, field, newValue)),
        setRepresentationCapacity: (representationCapacity) => {
            //dispatch(reset("representationForm"));
            dispatch(setRepresentationCapacity(representationCapacity));
        },
        setRepresentationSubmit: (representationSubmit) => {
            dispatch(setRepresentationSubmit(representationSubmit));
        },

        setCurrentView: (currentView) => {
            dispatch(setCurrentView(currentView));
        },
        setCurrentSection: (currentSection) => {
            dispatch(setCurrentSection(currentSection));
        }
    };
};

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