Skip to content

Commit 855c6c4

Browse files
gwrisnkrcggwrisnkrcg
authored
Merge pull request #337 from DEFRA/fix/FI0-11154
feat: add hidden text for add another buttons and update aria labels for accessibility
2 parents 35f9c6a + 12beaaa commit 855c6c4

10 files changed

Lines changed: 137 additions & 119 deletions

‎app/composite-components/addExclusiveEconomicZoneComponent.tsx‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ type ExclusiveEconomicZoneProps = {
1616
eezHelpSectionContentThreeLink: string;
1717
eezHint: string;
1818
removeButtonText: string;
19+
addAnotherButtonHiddenText?: string;
1920
preloadedZones?: string[];
2021
availableExclusiveEconomicZones: ICountry[];
2122
onExclusiveEconomicZonesChange: (zones: string[]) => void;
@@ -33,6 +34,7 @@ export const AddExclusiveEconomicZoneComponent = ({
3334
eezHelpSectionContentThreeLink,
3435
eezHint,
3536
removeButtonText,
37+
addAnotherButtonHiddenText,
3638
availableExclusiveEconomicZones,
3739
preloadedZones,
3840
onExclusiveEconomicZonesChange,
@@ -94,10 +96,17 @@ export const AddExclusiveEconomicZoneComponent = ({
9496

9597
const showAddZoneButton = (exclusiveZones: string[], index: number) =>
9698
index === exclusiveZones.length - 1 && exclusiveZones.length < maximumEezPerLanding
97-
? showButton("add-zone-button", index, handleAddZone, addAnotherButtonText)
99+
? showButton("add-zone-button", index, handleAddZone, addAnotherButtonText, undefined, addAnotherButtonHiddenText)
98100
: null;
99101

100-
const showButton = (id: string, index: number, onClick: Function, buttonText: string, buttonValue?: string) => (
102+
const showButton = (
103+
id: string,
104+
index: number,
105+
onClick: Function,
106+
buttonText: string,
107+
buttonValue?: string,
108+
hiddenText?: string
109+
) => (
101110
<Button
102111
key={`showButton-${id}-${index}`}
103112
id={id}
@@ -110,6 +119,7 @@ export const AddExclusiveEconomicZoneComponent = ({
110119
value={id}
111120
data-testid={`${buttonValue}-${id}`}
112121
{...(id === "remove-zone-button" && { style: { top: "15px" } })}
122+
{...(hiddenText && { visuallyHiddenText: { text: hiddenText, className: "govuk-visually-hidden" } })}
113123
onClick={(e: React.MouseEvent) => {
114124
e.preventDefault();
115125
onClick(index);

‎app/routes/create-catch-certificate.$documentNumber.add-landings.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -576,6 +576,7 @@ const AddLandings = () => {
576576
legendTitle={t("exclusiveZoneTitle", { ns: "addLandings" })}
577577
eezHint={t("eezHintText", { ns: "addLandings" })}
578578
addAnotherButtonText={t("ccAddLandingAddAnotherZoneButtonText", { ns: "addLandings" })}
579+
addAnotherButtonHiddenText={t("ccAddLandingAddAnotherZoneHiddenText", { ns: "addLandings" })}
579580
removeButtonText={t("ccAddLandingRemoveZoneButtonText", { ns: "addLandings" })}
580581
eezSelectEmptyHeader={t("ccEezSelectCountryText", { ns: "addLandings" })}
581582
eezHelpSectionLink={t("ccEezHelpSectionLinkText", { ns: "addLandings" })}

‎app/routes/create-catch-certificate.$documentNumber.direct-landing.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -402,6 +402,7 @@ const DirectLanding = () => {
402402
eezHint={t("eezHintText", { ns: "addLandings" })}
403403
eezHelpSectionContentThreeLink={t("ccEezHelpSectionContentThreeLink", { ns: "addLandings" })}
404404
addAnotherButtonText={t("ccAddLandingAddAnotherZoneButtonText", { ns: "addLandings" })}
405+
addAnotherButtonHiddenText={t("ccAddLandingAddAnotherZoneHiddenText", { ns: "addLandings" })}
405406
removeButtonText={t("ccAddLandingRemoveZoneButtonText", { ns: "addLandings" })}
406407
eezSelectEmptyHeader={t("ccEezSelectCountryText", { ns: "addLandings" })}
407408
eezHelpSectionLink={t("ccEezHelpSectionLinkText", { ns: "addLandings" })}

‎app/routes/create-non-manipulation-document.$documentNumber.add-product-to-this-consignment._index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -834,7 +834,7 @@ const AddProductIndex = () => {
834834
type={BUTTON_TYPE.BUTTON}
835835
data-module="govuk-button"
836836
onClick={handleAddDoc}
837-
aria-label={t("commonAddAnotherButtonText", { ns: "common" })}
837+
aria-label={t("commonAddAnotherSupportingDocAriaLabel", { ns: "common" })}
838838
/>
839839
)}
840840
</fieldset>

‎public/locales-v2/cy/addLandings.json‎

Lines changed: 59 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,59 @@
1-
{
2-
"ccAddLandingHeader": "Ychwanegwch eich taith ar gyfer pob cynnyrch",
3-
"ccAddLandingExportWeightFieldLabel": "Pwysau Allforio",
4-
"ccAddLandingExportWeightFieldHint": "Er enghraifft, 175.25",
5-
"ccAddSpeciesPageProductTableCaption": "Eich cynhyrchion",
6-
"ccAddLandingYourLandings": "Eich glaniadau",
7-
"ccAddLandingNullOption": "Dewiswch gynnyrch",
8-
"ccAddLandingExportWeightWithUnit": "Pwysau allforio (kg)",
9-
"ccSpeciesAndLandingsGuidanceListItem2": "Gall dyddiadau glanio fod hyd at {{landingLimitDaysInTheFuture}} diwrnod yn y dyfodol mewn dogfennau drafft ond dim ond hyd at 3 diwrnod yn y dyfodol mewn tystysgrifau dalfa a gyflwynir yn derfynol",
10-
"ccSpeciesAndLandingsGuidanceListItem4": "Gall gymryd hyd at {{offlineValidationTime}} munud i ddilysu sawl glaniad",
11-
"ccSpeciesAndLandingsGuidanceListItem5": "Caniateir uchafswm o {{maxAddLandingsLimit}} glaniad fesul tystysgrif",
12-
"ccAddLandingValueFooterLabelLandings": "glaniad",
13-
"ccAddLandingValueFooterLabelLanding": "glaniad",
14-
"ccAddLandingUpdateLandingBtnLabel": "Diweddaru'r glaniad",
15-
"ccAddLandingStartDateLabel": "Dyddiad dechrau'r daith bysgota",
16-
"ccAddLandingStartDateOptionalLabel": "Dyddiad dechrau'r daith bysgota (dewisol)",
17-
"ccAddLandingStartDateFieldHint": "Er enghraifft, 31 03 1980",
18-
"ccAddLandingStartdateLabel": "Dyddiad dechrau",
19-
"ccAddLandingVesselLabel": "Llestr",
20-
"ccAddLandingStartDateHelpSectionLinkText": "Dyddiad dechrau",
21-
"ccAddLandingStartDateHelpSectionContent": "Y dyddiad dechrau yw'r dyddiad y gadawodd y llong neu’r cwch y porthladd i ddechrau'r daith bysgota pan gafodd y ddalfa ei gwneud.",
22-
"ccAddLandingStartDateHelpSectionContentHeaderText": "Nid y dyddiad dechrau yw’r canlynol:",
23-
"ccAddLandingStartDateHelpSectionGuidanceListItem1": "Y dyddiad y cafodd y ddalfa ei glanio (gweler Dyddiad Glanio)",
24-
"ccAddLandingStartDateHelpSectionGuidanceListItem2": "Y dyddiad y cafodd y ddalfa ei gwerthu neu ei phrosesu",
25-
"ccAddLandingGearDetailsOptionalLabel": "Manylion y gêr (dewisol)",
26-
"ccAddLandingGearDetailsLabel": "Manylion y gêr",
27-
"ccAddLandingGearDetailsHint": "Y math o gêr a ddefnyddiwyd i ddal y pysgod",
28-
"ccAddLandingGearCategoryLabel": "Categori’r gêr",
29-
"ccAddLandingGearCategoryNullOption": "Dewiswch gategori’r gêr",
30-
"ccAddLandingGearTypeLabel": "Math o Gêr",
31-
"ccAddLandingGearTypeNullOption": "Dewiswch y math o gêr",
32-
"ccAddLandingGearDetailsHelpSectionLinkText": "Beth yw manylion y gêr?",
33-
"ccAddLandingGearDetailsHelpSectionContentOne": "Mae categorïau gêr yn disgrifio'r dull cyffredinol sy’n cael ei ddefnyddio i ddal pysgod, fel treillrwydi neu rwydi.",
34-
"ccAddLandingGearDetailsHelpSectionContentTwo": "Mae mathau o gêr yn fwy penodol, fel \"Treillrwydi trawst\" neu \"Rhwydi drysu wedi’u gosod\".",
35-
"ccAddLandingGearDetailsHelpSectionContentThree": "Dewiswch yr opsiwn mwyaf cywir yn seiliedig ar sut cafodd y pysgod eu dal. Os nad ydych chi’n siŵr, cysylltwch â'ch cyflenwyr neu'ch awdurdod pysgodfeydd.",
36-
"ccAddLandingGearDetailsHelpSectionContentFour": "Rhagor o wybodaeth am Gêr (yn agor mewn tab newydd)",
37-
"ccAddLandingGearCategoryButton": "Ychwanegu categori’r gêr",
38-
"ccAddLandingGearCategoryButtonError": "Rhaid ichi ddewis opsiwn categori gêr er mwyn ychwanegu categori gêr",
39-
"ccDirectLandingGearCategoryButton": "Ychwanegu categori’r gêr",
40-
"ccRfmoLabel": "Sefydliad rheoli pysgodfeydd rhanbarthol",
41-
"ccRfmoOptionalLabel": "Sefydliad rheoli pysgodfeydd rhanbarthol (dewisol)",
42-
"ccRfmoHintText": "Y sefydliad sy'n gyfrifol am reoli pysgota yn yr ardal lle cafodd y pysgod eu dal",
43-
"ccRfmoNullOption": "Dewiswch RFMO",
44-
"ccRfmoHelpSectionLinkText": "Beth yw sefydliad rheoli pysgodfeydd rhanbarthol (RFMO)?",
45-
"ccRfmoHelpSectionContentOne": "Sefydliadau Rheoli Pysgodfeydd Rhanbarthol (RFMOs) - mae RFMOs yn sefydliadau rhyngwladol sy'n sefydlu mesurau rhwymol ar gyfer cadwraeth a rheolaeth gynaliadwy i rywogaethau pysgod sy’n fudol iawn neu sy'n croesi ffiniau.",
46-
"ccRfmoHelpSectionContentTwoLink": "Rhagor o wybodaeth am RFMOs (yn agor mewn tab newydd).",
47-
"ccLandingDetailsRfmoLabel": "RFMO",
48-
"exclusiveZoneTitle": "Parth economaidd neilltuedig",
49-
"eezHintText": "Yr ardal o'r môr lle cafodd y pysgod eu dal",
50-
"ccAddLandingAddAnotherZoneButtonText": "Ychwanegu un arall",
51-
"ccAddLandingRemoveZoneButtonText": "Tynnu",
52-
"ccEezHelpSectionLinkText": "Beth yw parth economaidd neilltuedig (EEZ)?",
53-
"ccEezHelpSectionContentOne": "Mae Parthau Economaidd Neilltuedig yn ymestyn allan 200 môr-filltir o’r arfordir neu o linell ganolrif lle mae'n cyfarfod â therfynau gwlad arall.",
54-
"ccEezHelpSectionContentTwo": "O fewn EEZs mae gan y wladwriaeth arfordirol hawliau sofran i archwilio ac ecsbloetio'r adnoddau naturiol, ymchwil forol a chyfrifoldeb dros warchod a chadw bywyd y môr.",
55-
"ccEezHelpSectionContentThreeLink": "Rhagor o wybodaeth am EEZs (yn agor mewn tab newydd).",
56-
"ccEezSelectCountryText": "Dewiswch wlad",
57-
"ccLandingDetailsEezLabel": "EEZ"
58-
}
1+
{
2+
"ccAddLandingHeader": "Ychwanegwch eich taith ar gyfer pob cynnyrch",
3+
"ccAddLandingExportWeightFieldLabel": "Pwysau Allforio",
4+
"ccAddLandingExportWeightFieldHint": "Er enghraifft, 175.25",
5+
"ccAddSpeciesPageProductTableCaption": "Eich cynhyrchion",
6+
"ccAddLandingYourLandings": "Eich glaniadau",
7+
"ccAddLandingNullOption": "Dewiswch gynnyrch",
8+
"ccAddLandingExportWeightWithUnit": "Pwysau allforio (kg)",
9+
"ccSpeciesAndLandingsGuidanceListItem2": "Gall dyddiadau glanio fod hyd at {{landingLimitDaysInTheFuture}} diwrnod yn y dyfodol mewn dogfennau drafft ond dim ond hyd at 3 diwrnod yn y dyfodol mewn tystysgrifau dalfa a gyflwynir yn derfynol",
10+
"ccSpeciesAndLandingsGuidanceListItem4": "Gall gymryd hyd at {{offlineValidationTime}} munud i ddilysu sawl glaniad",
11+
"ccSpeciesAndLandingsGuidanceListItem5": "Caniateir uchafswm o {{maxAddLandingsLimit}} glaniad fesul tystysgrif",
12+
"ccAddLandingValueFooterLabelLandings": "glaniad",
13+
"ccAddLandingValueFooterLabelLanding": "glaniad",
14+
"ccAddLandingUpdateLandingBtnLabel": "Diweddaru'r glaniad",
15+
"ccAddLandingStartDateLabel": "Dyddiad dechrau'r daith bysgota",
16+
"ccAddLandingStartDateOptionalLabel": "Dyddiad dechrau'r daith bysgota (dewisol)",
17+
"ccAddLandingStartDateFieldHint": "Er enghraifft, 31 03 1980",
18+
"ccAddLandingStartdateLabel": "Dyddiad dechrau",
19+
"ccAddLandingVesselLabel": "Llestr",
20+
"ccAddLandingStartDateHelpSectionLinkText": "Dyddiad dechrau",
21+
"ccAddLandingStartDateHelpSectionContent": "Y dyddiad dechrau yw'r dyddiad y gadawodd y llong neu’r cwch y porthladd i ddechrau'r daith bysgota pan gafodd y ddalfa ei gwneud.",
22+
"ccAddLandingStartDateHelpSectionContentHeaderText": "Nid y dyddiad dechrau yw’r canlynol:",
23+
"ccAddLandingStartDateHelpSectionGuidanceListItem1": "Y dyddiad y cafodd y ddalfa ei glanio (gweler Dyddiad Glanio)",
24+
"ccAddLandingStartDateHelpSectionGuidanceListItem2": "Y dyddiad y cafodd y ddalfa ei gwerthu neu ei phrosesu",
25+
"ccAddLandingGearDetailsOptionalLabel": "Manylion y gêr (dewisol)",
26+
"ccAddLandingGearDetailsLabel": "Manylion y gêr",
27+
"ccAddLandingGearDetailsHint": "Y math o gêr a ddefnyddiwyd i ddal y pysgod",
28+
"ccAddLandingGearCategoryLabel": "Categori’r gêr",
29+
"ccAddLandingGearCategoryNullOption": "Dewiswch gategori’r gêr",
30+
"ccAddLandingGearTypeLabel": "Math o Gêr",
31+
"ccAddLandingGearTypeNullOption": "Dewiswch y math o gêr",
32+
"ccAddLandingGearDetailsHelpSectionLinkText": "Beth yw manylion y gêr?",
33+
"ccAddLandingGearDetailsHelpSectionContentOne": "Mae categorïau gêr yn disgrifio'r dull cyffredinol sy’n cael ei ddefnyddio i ddal pysgod, fel treillrwydi neu rwydi.",
34+
"ccAddLandingGearDetailsHelpSectionContentTwo": "Mae mathau o gêr yn fwy penodol, fel \"Treillrwydi trawst\" neu \"Rhwydi drysu wedi’u gosod\".",
35+
"ccAddLandingGearDetailsHelpSectionContentThree": "Dewiswch yr opsiwn mwyaf cywir yn seiliedig ar sut cafodd y pysgod eu dal. Os nad ydych chi’n siŵr, cysylltwch â'ch cyflenwyr neu'ch awdurdod pysgodfeydd.",
36+
"ccAddLandingGearDetailsHelpSectionContentFour": "Rhagor o wybodaeth am Gêr (yn agor mewn tab newydd)",
37+
"ccAddLandingGearCategoryButton": "Ychwanegu categori’r gêr",
38+
"ccAddLandingGearCategoryButtonError": "Rhaid ichi ddewis opsiwn categori gêr er mwyn ychwanegu categori gêr",
39+
"ccDirectLandingGearCategoryButton": "Ychwanegu categori’r gêr",
40+
"ccRfmoLabel": "Sefydliad rheoli pysgodfeydd rhanbarthol",
41+
"ccRfmoOptionalLabel": "Sefydliad rheoli pysgodfeydd rhanbarthol (dewisol)",
42+
"ccRfmoHintText": "Y sefydliad sy'n gyfrifol am reoli pysgota yn yr ardal lle cafodd y pysgod eu dal",
43+
"ccRfmoNullOption": "Dewiswch RFMO",
44+
"ccRfmoHelpSectionLinkText": "Beth yw sefydliad rheoli pysgodfeydd rhanbarthol (RFMO)?",
45+
"ccRfmoHelpSectionContentOne": "Sefydliadau Rheoli Pysgodfeydd Rhanbarthol (RFMOs) - mae RFMOs yn sefydliadau rhyngwladol sy'n sefydlu mesurau rhwymol ar gyfer cadwraeth a rheolaeth gynaliadwy i rywogaethau pysgod sy’n fudol iawn neu sy'n croesi ffiniau.",
46+
"ccRfmoHelpSectionContentTwoLink": "Rhagor o wybodaeth am RFMOs (yn agor mewn tab newydd).",
47+
"ccLandingDetailsRfmoLabel": "RFMO",
48+
"exclusiveZoneTitle": "Parth economaidd neilltuedig",
49+
"eezHintText": "Yr ardal o'r môr lle cafodd y pysgod eu dal",
50+
"ccAddLandingAddAnotherZoneButtonText": "Ychwanegu un arall",
51+
"ccAddLandingAddAnotherZoneHiddenText": "parth economaidd neilltuedig",
52+
"ccAddLandingRemoveZoneButtonText": "Tynnu",
53+
"ccEezHelpSectionLinkText": "Beth yw parth economaidd neilltuedig (EEZ)?",
54+
"ccEezHelpSectionContentOne": "Mae Parthau Economaidd Neilltuedig yn ymestyn allan 200 môr-filltir o’r arfordir neu o linell ganolrif lle mae'n cyfarfod â therfynau gwlad arall.",
55+
"ccEezHelpSectionContentTwo": "O fewn EEZs mae gan y wladwriaeth arfordirol hawliau sofran i archwilio ac ecsbloetio'r adnoddau naturiol, ymchwil forol a chyfrifoldeb dros warchod a chadw bywyd y môr.",
56+
"ccEezHelpSectionContentThreeLink": "Rhagor o wybodaeth am EEZs (yn agor mewn tab newydd).",
57+
"ccEezSelectCountryText": "Dewiswch wlad",
58+
"ccLandingDetailsEezLabel": "EEZ"
59+
}

‎public/locales-v2/cy/common.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -137,6 +137,7 @@
137137
"commonCalenderButtonLabel": " Dewiswch Ddyddiad",
138138
"commonSpeciesDetailsOpenInNewTab": "(yn agor tab newydd)",
139139
"commonAddAnotherButtonText": "Ychwanegu un arall",
140+
"commonAddAnotherSupportingDocAriaLabel": "Ychwanegu dogfen gefnogi arall",
140141
"commonAddTripDetailsWarningContent": "O 10 Ionawr 2026 ymlaen, bydd meysydd dyddiad dechrau, ardal y ddalfa a math o gêr yn orfodol o dan reoliadau newydd yr UE.",
141142
"getHelpHeading": "Cael help gyda'ch cais",
142143
"getHelpBody": "Os oes gennych rif cyfeirnod unigryw {{documentName}}, gofalwch fod hwnnw gennych pan fyddwch chi'n ffonio.",

0 commit comments

Comments
 (0)