From cb5280b5251d5d95d00bdef9bdb6ec512a634da8 Mon Sep 17 00:00:00 2001
From: rdbsolutions <rob@rdbsolutions.co.uk>
Date: Mon, 19 Feb 2024 16:53:22 +0000
Subject: [PATCH] accessibility amends for my portal

---
 actions/index.js                              |  3 +-
 components/myportal/advancedsearch.js         |  2 +-
 components/myportal/awaitingsubmission.js     |  7 ++--
 .../myportal/awaitingsubmissionfromblob.js    |  7 ++--
 components/myportal/dns.js                    |  7 ++--
 components/myportal/makenewappeal.js          |  4 +-
 components/myportal/mycases.js                |  7 ++--
 components/myportal/myrepresentations.js      |  2 +-
 .../myportal/myrepresentationsfromblob.js     |  2 +-
 components/myportal/topthree.js               |  9 ++--
 components/myportal/watchedcases.js           |  2 +-
 components/myportal/youraccount.js            | 41 ++++++++++---------
 12 files changed, 44 insertions(+), 49 deletions(-)

diff --git a/actions/index.js b/actions/index.js
index 0e1250a4..b428fabe 100644
--- a/actions/index.js
+++ b/actions/index.js
@@ -878,8 +878,7 @@ export const getPortalModuleDetails = (appealType, caseReference) => {
 export const getPortalModuleDetailsProxy = (appealType, caseReference) => {
     return axios
         .get(
-            BASE_URL +
-                "/api/endpoint/getportalmoduledetailsproxy_api?appealType=" +
+            "/api/endpoint/getportalmoduledetailsproxy_api?appealType=" +
                 appealType +
                 "&caseReference=" +
                 caseReference
diff --git a/components/myportal/advancedsearch.js b/components/myportal/advancedsearch.js
index e49a3b0d..a75d2df8 100644
--- a/components/myportal/advancedsearch.js
+++ b/components/myportal/advancedsearch.js
@@ -194,7 +194,7 @@ let AdvancedSearch = (props) => {
                     </label>
                     {touched && error && (
                         <span
-                            id="passport-issued-error"
+                            id={name + "-error"}
                             className="govuk-error-message"
                         >
                             <span className="govuk-visually-hidden">
diff --git a/components/myportal/awaitingsubmission.js b/components/myportal/awaitingsubmission.js
index cd296a53..75e26a37 100644
--- a/components/myportal/awaitingsubmission.js
+++ b/components/myportal/awaitingsubmission.js
@@ -13,7 +13,7 @@ const AwaitingSubmission = (props) => {
     const { setCurrentView } = props;
 
     return (
-        <div className="card" id="casescomment-card">
+        <div className="card" id="awaiting-submission-card">
             <div className="card-body">
                 <h3 className="heading-small card-heading">
                     {t("myportal:awatitingsubmission-card-title")}
@@ -46,10 +46,9 @@ const AwaitingSubmission = (props) => {
                                     "viewName": "Awaiting Submission",
                                     "viewKey": "awaitingSubmission",
                                 });
-                            }}>
-
+                            }}
+                        >
                             {t("myportal:viewall-link")}
-
                         </Link>
                     </div>
                 )}
diff --git a/components/myportal/awaitingsubmissionfromblob.js b/components/myportal/awaitingsubmissionfromblob.js
index afc93001..a673dda9 100644
--- a/components/myportal/awaitingsubmissionfromblob.js
+++ b/components/myportal/awaitingsubmissionfromblob.js
@@ -177,8 +177,7 @@ const AwaitingSubmissionFromBlob = (props) => {
                         : showTopThreeArrDets[key]["pinswg_lpaname"] || ""}
                 </div>
                 <div className="">
-                    <span
-                        href="#"
+                    <button
                         className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
                         onClick={() => {
                             confirm(
@@ -196,14 +195,14 @@ const AwaitingSubmissionFromBlob = (props) => {
                         }}
                     >
                         &mdash;
-                    </span>
+                    </button>
                 </div>
             </div>
         );
     });
 
     return (
-        <div className="card" id="casescomment-card">
+        <div className="card" id="awaiting-submission-card">
             <div className="card-body">
                 <h3 className="heading-small card-heading">
                     {t("myportal:awatitingsubmission-card-title")}
diff --git a/components/myportal/dns.js b/components/myportal/dns.js
index 6d4b00ac..a2a8ec17 100644
--- a/components/myportal/dns.js
+++ b/components/myportal/dns.js
@@ -16,7 +16,7 @@ export default function Dns() {
     //         : setShowSpinnerState(true);
     // };
     return (
-        <div className="card" id="casesearch-card">
+        <div className="card" id="dns-card">
             <div className="card-body">
                 <h3 className="heading-small card-heading">
                     {t("home:dns-card-title")}
@@ -36,10 +36,9 @@ export default function Dns() {
                         // onClick={() => {
                         //     spinnerState();
                         // }}
-                        className="govuk-button withChevron govuk-button-cta">
-
+                        className="govuk-button withChevron govuk-button-cta"
+                    >
                         {t("home:dns-card-button")}
-
                     </Link>
                 </div>
             </div>
diff --git a/components/myportal/makenewappeal.js b/components/myportal/makenewappeal.js
index b300ccf3..a9fe5835 100644
--- a/components/myportal/makenewappeal.js
+++ b/components/myportal/makenewappeal.js
@@ -8,7 +8,7 @@ export default function MakeNewAppeal() {
     const router = useRouter();
     const { locale } = router;
     return (
-        <div className="card" id="casescomment-card">
+        <div className="card" id="new-appeal-card">
             <div className="card-body">
                 <h2 className="govuk-heading-s">
                     {t("myportal:makenewappeal-card-title")}
@@ -21,9 +21,7 @@ export default function MakeNewAppeal() {
                 </p>
                 <div>
                     <Link href={"/newappeal"} className="govuk-button">
-
                         {t("myportal:makenewappeal-card-button-label")}
-
                     </Link>
                 </div>
             </div>
diff --git a/components/myportal/mycases.js b/components/myportal/mycases.js
index f080c25e..6014799a 100644
--- a/components/myportal/mycases.js
+++ b/components/myportal/mycases.js
@@ -12,7 +12,7 @@ const MyCases = (props) => {
     const { locale } = router;
     const { setCurrentView } = props;
     return (
-        <div className="card" id="casescomment-card">
+        <div className="card" id="my-cases-card">
             <div className="card-body">
                 <h3 className="heading-small card-heading">
                     {t("myportal:mycases-card-title")}
@@ -40,13 +40,12 @@ const MyCases = (props) => {
                                     "viewName": "My Cases",
                                     "viewKey": "myCases",
                                 });
-                            }}>
-
+                            }}
+                        >
                             {t("myportal:viewall-link")}{" "}
                             {props.isLPA &&
                                 props.myCases.myCases["@odata.count"] +
                                     " appeals"}
-
                         </Link>
                     </div>
                 )}
diff --git a/components/myportal/myrepresentations.js b/components/myportal/myrepresentations.js
index 8baefb68..5598b6fe 100644
--- a/components/myportal/myrepresentations.js
+++ b/components/myportal/myrepresentations.js
@@ -13,7 +13,7 @@ const MyRepresentations = (props) => {
     const { setCurrentView } = props;
 
     return (
-        <div className="card" id="casescomment-card">
+        <div className="card" id="my-representations-card">
             <div className="card-body">
                 <h3 className="heading-small card-heading">
                     {t("myportal:myrepresentations-card-title")}
diff --git a/components/myportal/myrepresentationsfromblob.js b/components/myportal/myrepresentationsfromblob.js
index 8f4ba3ed..fce1bf3c 100644
--- a/components/myportal/myrepresentationsfromblob.js
+++ b/components/myportal/myrepresentationsfromblob.js
@@ -13,7 +13,7 @@ const MyRepresentations = (props) => {
     const { setCurrentView } = props;
 
     return (
-        <div className="card" id="casescomment-card">
+        <div className="card" id="my-representations-card">
             <div className="card-body">
                 <h3 className="heading-small card-heading">
                     {t("myportal:myrepresentations-card-title")}dd
diff --git a/components/myportal/topthree.js b/components/myportal/topthree.js
index 8c143963..e0baafd5 100644
--- a/components/myportal/topthree.js
+++ b/components/myportal/topthree.js
@@ -303,8 +303,7 @@ const TopThree = (props) => {
                 </div>
                 {topThreeType == "watchedCases" && (
                     <div className="">
-                        <span
-                            href="#"
+                        <button
                             className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
                             onClick={() => {
                                 confirm(
@@ -320,12 +319,12 @@ const TopThree = (props) => {
                             }}
                         >
                             &mdash;
-                        </span>
+                        </button>
                     </div>
                 )}
                 {topThreeType == "awaitingSubmission" && (
                     <div className="">
-                        <span
+                        <button
                             className=" cardModuleRemoveCase govuk-link govuk-link--no-underline govuk-link--inverse "
                             onClick={() => {
                                 confirm(
@@ -343,7 +342,7 @@ const TopThree = (props) => {
                             }}
                         >
                             &mdash;
-                        </span>
+                        </button>
                     </div>
                 )}
             </div>
diff --git a/components/myportal/watchedcases.js b/components/myportal/watchedcases.js
index fdcf4c73..9c3dba6a 100644
--- a/components/myportal/watchedcases.js
+++ b/components/myportal/watchedcases.js
@@ -13,7 +13,7 @@ const WatchedCases = (props) => {
     const { setCurrentView } = props;
 
     return (
-        <div className="card" id="casescomment-card">
+        <div className="card" id="my-watched-cases-card">
             <div className="card-body">
                 <h3 className="heading-small card-heading">
                     {t("myportal:watchedcases-card-title")}
diff --git a/components/myportal/youraccount.js b/components/myportal/youraccount.js
index 126a7d17..a78b7a92 100644
--- a/components/myportal/youraccount.js
+++ b/components/myportal/youraccount.js
@@ -7,26 +7,28 @@ export default function YourAccount() {
 
     const router = useRouter();
     const { locale } = router;
-    return <>
-        <div className="card" id="casescomment-card">
-            <div className="card-body">
-                <h3 className="heading-small card-heading">
-                    {t("myportal:yourdetails-card-title")}
-                </h3>
-                <p className="govuk-body-s">
-                    {t("myportal:yourdetails-card-paragraph-one")}
-                </p>
+    return (
+        <>
+            <div className="card" id="your-account-card">
+                <div className="card-body">
+                    <h3 className="heading-small card-heading">
+                        {t("myportal:yourdetails-card-title")}
+                    </h3>
+                    <p className="govuk-body-s">
+                        {t("myportal:yourdetails-card-paragraph-one")}
+                    </p>
 
-                <div>
-                    <Link href="/account/personaldetails" className="govuk-button-secondary">
-
-                        {t("myportal:yourdetails-card-link")}
-
-                    </Link>
+                    <div>
+                        <Link
+                            href="/account/personaldetails"
+                            className="govuk-button-secondary"
+                        >
+                            {t("myportal:yourdetails-card-link")}
+                        </Link>
+                    </div>
                 </div>
-            </div>
 
-            {/* <div className="card-body">
+                {/* <div className="card-body">
                 <h3 className="heading-small card-heading">
                     {t("myportal:changepassword-card-title")}
                 </h3>
@@ -43,6 +45,7 @@ export default function YourAccount() {
                     </Link>
                 </div>
             </div> */}
-        </div>
-    </>;
+            </div>
+        </>
+    );
 }