Merged PR 1653: right click link issues

Related work items: #16185, #16477, #16478, #16630
This commit is contained in:
Robert Bond
2025-06-03 16:18:03 +00:00
5 changed files with 81 additions and 108 deletions
+48 -102
View File
@@ -93,6 +93,29 @@ const Header = (props) => {
});
};
const switchLocale = locale === "en" ? "cy" : "en";
const handleLocaleSwitch = () => {
// Set cookie
setCookie(null, "pedw_locale", switchLocale, {
path: "/",
maxAge: 60 * 60 * 24 * 365,
});
// Rebuild URL with query parameters
const queryString =
Object.keys(router.query).length > 0
? "?" +
Object.entries(router.query)
.map(([key, value]) => `${key}=${value}`)
.join("&")
: "";
router.push(router.pathname + queryString, undefined, {
locale: switchLocale,
});
};
return (
<header
className="govuk-header "
@@ -115,106 +138,6 @@ const Header = (props) => {
</div>
<div className="languageSwitch">
{/* <div className="mobileNav">
<div className="mobileMenu">
<input
type="radio"
id="mobileMenu-1"
name="mobileMenu-group-1"
/>
<label htmlFor="mobileMenu-1">
{t("common:mobile-nav-label")} <i>▼</i>
</label>
<div className="mobileMenu close-mobileMenu">
<input
type="radio"
id="mobileMenu-close"
name="mobileMenu-group-1"
/>
<label htmlFor="mobileMenu-close">
{t("common:mobile-nav-label")} <i>▲</i>
</label>
</div>
<div className="content">
<ul>
{hasContactLink.includes(router.pathname) ==
true ? (
<li>
<Link href="/dns/contact-us">
<a className="govuk-header__link ">
Contact
</a>
</Link>
</li>
) : (
""
)}
{noSignoutLink.includes(router.pathname) ==
true ? (
""
) : (
<li>
<a
href={
router.locale == "cy"
? "/allgofnodi"
: "/logout"
}
onClick={() => {
setLogout(),
window.localStorage.clear();
}}
className="govuk-header__link "
>
{t("common:signout-label")}
</a>
</li>
)}
<li>
<Link
href={
locale == "en"
? router.query.q != null
? router.pathname +
"?q=" +
router.query.q
: router.pathname
: router.query.q != null
? process.env.I18N_DOMAIN +
"/" +
router.asPath +
"?q=" +
router.query.q
: router.asPath
}
locale={
locale == "en" ? "cy" : "en"
}
className="govuk-header__link "
lang={locale == "en" ? "cy" : "en"}
hrefLang={
locale == "en" ? "cy" : "en"
}
data-journey-click={
locale == "en"
? "link - click:lang-select:Cymraeg"
: "link - click:lang-select:English"
}
aria-label={
locale == "en"
? "Dewiswch Cymraeg"
: "Select English"
}
>
{" "}
{t("common:available-in")}
</Link>
</li>
</ul>
</div>
</div>
</div> */}
<div className="fullNavs">
{hasContactLink.includes(router.pathname) == true ? (
<Link
@@ -244,7 +167,30 @@ const Header = (props) => {
</Link>
)}
<Link
<span
onClick={handleLocaleSwitch}
className="govuk-header__link"
lang={switchLocale}
hrefLang={switchLocale}
role="link"
tabIndex={0}
onKeyDown={(e) => {
if (e.key === "Enter") handleLocaleSwitch();
}}
data-journey-click={
locale === "en"
? "link - click:lang-select:Cymraeg"
: "link - click:lang-select:English"
}
aria-label={
locale === "en"
? "Dewiswch Cymraeg"
: "Select English"
}
>
{t("common:available-in")}
</span>
{/* <Link
href={
Object.keys(router.query).length > 0
? router.pathname +
@@ -284,7 +230,7 @@ const Header = (props) => {
>
{" "}
{t("common:available-in")}
</Link>
</Link> */}
</div>
</div>
</div>
+6 -1
View File
@@ -89,5 +89,10 @@
"unsubscribe-case-title": "Wedi dad-danysgrifio i'r Achos",
"unsubscribe-case-all-label": "Rydych chi wedi dad-danysgrifio o dderbyn diweddariadau o'r achos canlynol",
"unsubscribe-case-none-label": "Dim byd i'w ddad-danysgrifio",
"unsubscribe-case-label": "Rydych chi wedi dad-danysgrifio o dderbyn diweddariadau e-bost ar gyfer"
"unsubscribe-case-label": "Rydych chi wedi dad-danysgrifio o dderbyn diweddariadau e-bost ar gyfer",
"mycases-viewall-title": "Gweld fy holl achosion",
"awaitingsubmissiondetails-viewall-title": "Gweld pob apêl sy'n aros i gael ei chyflwyno",
"myrepresentations-viewall-title": "Gweld pob cynrychiolaeth sy'n aros i gael ei chyflwyno",
"watchedcases-viewall-title": "Gweld pob achos a wyliwyd",
"mySubmittedreps-viewall-title": "Gweld pob cynrychiolaeth a gyflwynwyd"
}
+6 -1
View File
@@ -89,5 +89,10 @@
"unsubscribe-case-title": "Unsubscribed to Case",
"unsubscribe-case-all-label": "You have unsubscribed from receiving updates from the following case",
"unsubscribe-case-none-label": "Nothing to unsubscribe",
"unsubscribe-case-label": "You have unsubscribed from receiving email updates for"
"unsubscribe-case-label": "You have unsubscribed from receiving email updates for",
"mycases-viewall-title": "View all my cases",
"awaitingsubmissiondetails-viewall-title": "View all appeals awaiting submission",
"myrepresentations-viewall-title": "View all representations awaiting submission",
"watchedcases-viewall-title": "View all watched cases",
"mysubmittedreps-viewall-title": "View all submitted representations"
}
+17 -1
View File
@@ -31,11 +31,27 @@ const Home = (props) => {
return <NoSessionWarning />;
}
const titleKeys = {
"myCases": t("common:mycases-viewall-title"),
"awaitingSubmissionDetails": t(
"common:awaitingsubmissiondetails-viewall-title"
),
"myRepresentations": t("common:myrepresentations-viewall-title"),
"watchedCases": t("common:watchedcases-viewall-title"),
"mySubmittedReps": t("common:mysubmittedreps-viewall-title"),
};
function whichTitle(key) {
return t(titleKeys[key]);
}
return (
<div>
<Head>
<title>
{t("search:page-title")} - {t("common:service-name")}
{whichTitle(router.query?.viewKey)} -{" "}
{t("common:service-name")}
</title>
</Head>
<div id="page_wrapper">
+4 -3
View File
@@ -734,6 +734,7 @@ textarea,
margin-top: 10px;
text-align: right;
margin-right: 0px;
cursor: pointer;
@media screen and (max-width: 900px) {
position: absolute;
@@ -741,7 +742,7 @@ textarea,
right: -10px;
}
a.govuk-header__link {
.govuk-header__link {
background-color: $black;
padding: 10px 20px;
font-weight: 700;
@@ -753,9 +754,9 @@ textarea,
}
}
a.govuk-header__link:focus {
.govuk-header__link:focus {
background-color: $black;
padding: 10px;
padding: 10px 20px;
color: #fff;
box-shadow: none;
}