688 lines
33 KiB
JavaScript
688 lines
33 KiB
JavaScript
import Link from "next/link";
|
|
import jsonpath from "jsonpath";
|
|
import _ from "lodash";
|
|
import { useState } from "react";
|
|
import { useRouter } from "next/router";
|
|
import useTranslation from "next-translate/useTranslation";
|
|
import LoadingOverlay from "react-loading-overlay";
|
|
|
|
const Breadcrumbs = (props) => {
|
|
const { courseContent, slug, currentView } = props;
|
|
const router = useRouter();
|
|
const { appealType, section } = router.query;
|
|
|
|
let { t } = useTranslation();
|
|
|
|
function Breadcrumb() {
|
|
if (slug) {
|
|
var coursePageURL = appealType + "/" + slug;
|
|
if (_.isEmpty(courseContent)) {
|
|
return null;
|
|
} else {
|
|
var sectionObj = jsonpath.query(
|
|
courseContent,
|
|
'$..sections[?(@.path=="/' + coursePageURL + '")]'
|
|
);
|
|
var breadcrumb = sectionObj[0].chapter.title; //sectionObj[0].chapter
|
|
return (
|
|
<li
|
|
className="govuk-breadcrumbs__list-item"
|
|
aria-current="page"
|
|
>
|
|
{breadcrumb}
|
|
</li>
|
|
);
|
|
}
|
|
} else {
|
|
return null;
|
|
}
|
|
}
|
|
|
|
// const [showSpinnerState, setShowSpinnerState] = useState(false);
|
|
|
|
// let spinnerState = () => {
|
|
// showSpinnerState == true
|
|
// ? setShowSpinnerState(false)
|
|
// : setShowSpinnerState(true);
|
|
// };
|
|
return (
|
|
<>
|
|
<nav
|
|
aria-label={
|
|
"Breadcrumb for " + _.startCase(_.toLower(appealType))
|
|
}
|
|
role="navigation"
|
|
data-module="track-click"
|
|
>
|
|
<div className="govuk-breadcrumbs ">
|
|
<ol className="govuk-breadcrumbs__list">
|
|
{/* <li className="govuk-breadcrumbs__list-item">
|
|
<Link href={t("common:gov-wales-link")}>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:gov-wales-label")}
|
|
</a>
|
|
</Link>
|
|
</li> */}
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link href={"/"}>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:service-name-breadcrumb")}
|
|
</a>
|
|
</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">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-my-portal")}
|
|
</a>
|
|
</Link>
|
|
</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 == "/myportal/advancedsearch" ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-my-portal")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
{t("common:breadcrumb-advanced-search")}
|
|
</li>
|
|
</>
|
|
) : (
|
|
""
|
|
)}
|
|
{router.pathname == "/advancedsearchresults" ? (
|
|
<>
|
|
{" "}
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale +
|
|
"/advancedsearch"
|
|
: "/advancedsearch"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t(
|
|
"common:breadcrumb-advanced-search"
|
|
)}
|
|
</a>
|
|
</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={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-my-portal")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale +
|
|
"/myportal/advancedsearch"
|
|
: "/myportal/advancedsearch"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t(
|
|
"common:breadcrumb-advanced-search"
|
|
)}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
{t(
|
|
"common:breadcrumb-advanced-search-results"
|
|
)}
|
|
</li>
|
|
</>
|
|
) : (
|
|
""
|
|
)}
|
|
{router.pathname == "/newappeal" ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("newappeal:parent-page-title")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
{t("newappeal:page-title")}
|
|
</li>
|
|
</>
|
|
) : (
|
|
""
|
|
)}
|
|
{router.pathname == "/newappeal/selectappeal" ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("newappeal:parent-page-title")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("newappeal:page-title")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
Select Appeal
|
|
</li>
|
|
</>
|
|
) : (
|
|
""
|
|
)}
|
|
{router.pathname == "/viewall" ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-my-portal")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
Your cases
|
|
</li>
|
|
</>
|
|
) : (
|
|
""
|
|
)}
|
|
{router.pathname == "/myportal/viewall" ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-my-portal")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
{currentView.viewName}
|
|
</li>
|
|
</>
|
|
) : (
|
|
""
|
|
)}
|
|
{router.pathname == "/myportal/case" ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-my-portal")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/viewall"
|
|
: "/viewall"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
Your cases{" "}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
{t("common:breadcrumb-case-reference")}:{" "}
|
|
{
|
|
props.props.currentView.caseReference
|
|
.currentReference
|
|
}
|
|
</li>
|
|
</>
|
|
) : (
|
|
""
|
|
)}
|
|
{router.pathname == "/case" ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale +
|
|
"/searchresults?q=" +
|
|
props.props.search
|
|
.searchString
|
|
: "/searchresults?q=" +
|
|
props.props.search
|
|
.searchString
|
|
}
|
|
>
|
|
<a
|
|
onClick={() => {
|
|
// spinnerState();
|
|
router.back();
|
|
}}
|
|
className="govuk-breadcrumbs__link"
|
|
>
|
|
{t(
|
|
"common:breadcrumb-search-results"
|
|
)}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
{t("common:breadcrumb-case-reference")}:{" "}
|
|
{
|
|
props.props.currentView.caseReference
|
|
.currentReference
|
|
}
|
|
</li>
|
|
</>
|
|
) : (
|
|
""
|
|
)}
|
|
{router.pathname == "/myportal/representation" ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-my-portal")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
Make representation for:{" "}
|
|
{
|
|
props.props.currentView.caseReference
|
|
.currentReference
|
|
}
|
|
</li>
|
|
</>
|
|
) : (
|
|
""
|
|
)}
|
|
{router.pathname == "/account/personaldetails" ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale == "cy"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-my-portal")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
Your account
|
|
</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={
|
|
router.locale == "cy"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-my-portal")}
|
|
</a>
|
|
</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 == "/dns/[developmentName]" ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale == "en"
|
|
? router.locale + "/../../dns"
|
|
: "/../../dns"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("dnsCommon:service-name")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
{t("common:breadcrumb-case-reference")}:{" "}
|
|
{
|
|
props.props.currentView.caseReference
|
|
.currentReference
|
|
}
|
|
</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"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("dnsCommon:service-name")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
{t("common:breadcrumb-case-reference")}:{" "}
|
|
{
|
|
props.props.currentView.caseReference
|
|
.currentReference
|
|
}
|
|
</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">
|
|
Contact us
|
|
</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"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t(
|
|
"dnsApplicationView:page-parent-title"
|
|
)}
|
|
</a>
|
|
</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>
|
|
</>
|
|
) : (
|
|
""
|
|
)}
|
|
{/* {!_.isEmpty(slug) ? (
|
|
<>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale != "en"
|
|
? router.locale + "/myportal"
|
|
: "/myportal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-my-portal")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
<Link
|
|
href={
|
|
router.locale == "cy"
|
|
? router.locale + "/apêlnewydd"
|
|
: "/newappeal"
|
|
}
|
|
>
|
|
<a className="govuk-breadcrumbs__link">
|
|
{t("common:breadcrumb-new-appeal")}
|
|
</a>
|
|
</Link>
|
|
</li>
|
|
<li className="govuk-breadcrumbs__list-item">
|
|
{props.formTitle}
|
|
</li>
|
|
</>
|
|
) : (
|
|
""
|
|
)} */}
|
|
|
|
<Breadcrumb />
|
|
</ol>
|
|
</div>
|
|
</nav>
|
|
{/* <LoadingOverlay
|
|
active={showSpinnerState}
|
|
spinner
|
|
text={t("common:spinner-searching")}
|
|
/> */}
|
|
</>
|
|
);
|
|
};
|
|
export default Breadcrumbs;
|