diff --git a/package-lock.json b/package-lock.json index ebae341..adbda77 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5483,6 +5483,13 @@ "@types/node": "*" } }, + "node_modules/@types/cookie": { + "version": "0.6.0", + "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.6.0.tgz", + "integrity": "sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==", + "dev": true, + "license": "MIT" + }, "node_modules/@types/css-mediaquery": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/@types/css-mediaquery/-/css-mediaquery-0.1.4.tgz", @@ -14047,6 +14054,58 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz", "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==" }, + "node_modules/react-router": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.0.0.tgz", + "integrity": "sha512-1xf+yMVhUjAzZGY90ZnYJ9KVe1R8FggpugzRBkh+p6vl4cC1sHDe3nO+r5rxWTAgCMf8uN5hfoV2M7rLVTWPUA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@types/cookie": "^0.6.0", + "cookie": "^1.0.1", + "set-cookie-parser": "^2.6.0", + "turbo-stream": "2.4.0" + }, + "engines": { + "node": ">=20.0.0" + }, + "peerDependencies": { + "react": ">=18", + "react-dom": ">=18" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + } + } + }, + "node_modules/react-router-dom": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.0.0.tgz", + "integrity": "sha512-2QAxXpwgQuh423C64oZiV2cCKPCNUgZxcvZaS8O0PAHPZ/z8kTq7YbGD4KTNZm6Yj66d+HAfGkWPp8MCpdtD+Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "react-router": "7.0.0" + }, + "engines": { + "node": ">=20.0.0" + }, + "peerDependencies": { + "react": ">=18", + "react-dom": ">=18" + } + }, + "node_modules/react-router/node_modules/cookie": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz", + "integrity": "sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + } + }, "node_modules/react-transition-group": { "version": "4.4.5", "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz", @@ -14849,6 +14908,13 @@ "node": ">= 0.8.0" } }, + "node_modules/set-cookie-parser": { + "version": "2.7.1", + "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz", + "integrity": "sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==", + "dev": true, + "license": "MIT" + }, "node_modules/set-function-length": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz", @@ -15779,6 +15845,13 @@ "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==", "dev": true }, + "node_modules/turbo-stream": { + "version": "2.4.0", + "resolved": "https://registry.npmjs.org/turbo-stream/-/turbo-stream-2.4.0.tgz", + "integrity": "sha512-FHncC10WpBd2eOmGwpmQsWLDoK4cqsA/UT/GqNoaKOQnT8uzhtCbg3EoUDMvqpOSAI0S26mr0rkjzbOO6S3v1g==", + "dev": true, + "license": "ISC" + }, "node_modules/type-check": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz", diff --git a/src/components/Accessibility/AccessibilityStatement.stories.tsx b/src/components/Accessibility/AccessibilityStatement.stories.tsx index 195a224..d09c94a 100644 --- a/src/components/Accessibility/AccessibilityStatement.stories.tsx +++ b/src/components/Accessibility/AccessibilityStatement.stories.tsx @@ -12,6 +12,7 @@ type Story = StoryObj; export const AccessibilityStatement: Story = { args: { teamEmail: 'team@example.com', - emailUsToReportAProblem: () => console.log('Email us to report a problem') + sendReportProblemGaEvent: () => console.log('Email us to report a problem'), + scrollSection: "" } }; \ No newline at end of file diff --git a/src/components/Accessibility/AccessibilityStatement.tsx b/src/components/Accessibility/AccessibilityStatement.tsx index 0479068..97098bc 100644 --- a/src/components/Accessibility/AccessibilityStatement.tsx +++ b/src/components/Accessibility/AccessibilityStatement.tsx @@ -1,264 +1,285 @@ -import React from 'react'; -import {Box, Button, Link, List, ListItem, ListItemIcon, ListItemText, Typography} from '@mui/material'; +import React, {useEffect} from 'react'; +import {Box, Button, Link, List, ListItem, ListItemIcon, ListItemText, ThemeProvider, Typography} from '@mui/material'; import FiberManualRecordIcon from '@mui/icons-material/FiberManualRecord'; +import {drtTheme} from "../../index"; export interface IAccessibilityStatementProps { teamEmail: string; - emailUsToReportAProblem: () => void; + sendReportProblemGaEvent: () => void; + scrollSection: string; } export const AccessibilityStatement = ({ teamEmail, - emailUsToReportAProblem + sendReportProblemGaEvent, + scrollSection }: IAccessibilityStatementProps) => { + useEffect(() => { + if (scrollSection) { + const element = document.getElementById(scrollSection); + if (element) { + element.scrollIntoView({behavior: 'smooth'}); + } + } + }, [scrollSection]); + return ( - - - Accessibility statement for Dynamic Response Tool (DRT) - - - In this page: - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + Accessibility statement for Dynamic Response Tool (DRT) + - Introduction - This accessibility statement applies to https://drt.homeoffice.gov.uk/. - This website is run by Technology Delivery Centre, part of Home Office Digital, Data and Technology - Directorate’s Migration and Borders Technology Portfolio, on behalf of Border Force. We want as many people - as possible to be able to use this website. For example, that means you should be able to: - - + In this page: + + - + - + - + - + - + - + - + - - We’ve also made the website text as simple as possible to understand. - AbilityNet has - advice on making your device easier to use if you have a disability. - - - How accessible this service is - We know some parts of this website are not fully - accessible: - - + - + - + - - - - - - - + - Feedback and contact information - The Dynamic Response Tool (DRT) team, which works within Technology - Delivery Centre, is responsible for the accessibility of this service. We’re always looking to improve the - accessibility of this website. If you - find any problems not listed on this page or think we’re not meeting other accessibility requirements, - contact us: - - - - Enforcement procedure - The Equality and Human Rights Commission (EHRC) is responsible for - enforcing the Public Sector Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations 2018 - (the ‘accessibility regulations’). - If you’re not happy with how we respond to your complaint, contact the Equality - Advisory and Support Service (EASS). - - - - Technical information about this website’s - accessibility - Border Force is committed to making its websites accessible, in - accordance with the Public Sector Bodies (Websites and Mobile Applications) (No. 2) Accessibility - Regulations 2018. - - Compliance status - The website has been tested against the Web Content Accessibility - Guidelines (WCAG) 2.1 AA standard. - This website is partially compliant with the Web Content Accessibility - Guidelines (WCAG) 2.1 AA standard (https://www.w3.org/TR/WCAG21/). The - non-compliances are listed below. - - Non-compliant content within the accessibility - regulations + Introduction + This accessibility statement applies to https://drt.homeoffice.gov.uk/. + This website is run by Technology Delivery Centre, part of Home Office Digital, Data and Technology + Directorate’s Migration and Borders Technology Portfolio, on behalf of Border Force. We want as many + people + as possible to be able to use this website. For example, that means you should be able to: - - - - - - - - - - - - - + - + - + - - - - - - - - - - - - + primary="listen to most of the website using a screen reader (including the most recent versions of JAWS, NVDA and VoiceOver)"/> + + We’ve also made the website text as simple as possible to understand. + AbilityNet has + advice on making your device easier to use if you have a disability. + + + How accessible this service is + We know some parts of this website are not fully + accessible: + - + - + - + - - - What we’re doing to improve accessibility - We plan to address the above areas of non-compliance with accessibility - regulations on this website by February 2025. - - - - Preparation of this accessibility statement - This statement was prepared on 15 November 2021. + + Feedback and contact information + The Dynamic Response Tool (DRT) team, which + works within Technology Delivery Centre, is responsible for the accessibility of this service. We’re + always + looking to improve the accessibility of + this website. If you find any problems not listed on this page or think we’re not meeting other + accessibility requirements, contact us: + + + + + Enforcement procedure + The Equality and Human Rights Commission (EHRC) is responsible for + enforcing the Public Sector Bodies (Websites and Mobile Applications) (No. 2) Accessibility Regulations + 2018 + (the ‘accessibility regulations’). + If you’re not happy with how we respond to your complaint, contact the Equality + Advisory and Support Service (EASS). + + + + Technical information about this website’s + accessibility + Border Force is committed to making its websites accessible, in + accordance with the Public Sector Bodies (Websites and Mobile Applications) (No. 2) Accessibility + Regulations 2018. + + Compliance status + The website has been tested against the Web Content Accessibility + Guidelines (WCAG) 2.1 AA standard. + This website is partially compliant with the Web Content + Accessibility + Guidelines (WCAG) 2.1 AA standard (https://www.w3.org/TR/WCAG21/). The + non-compliances are listed below. + + + Non-compliant content within the accessibility + regulations + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + What we’re doing to improve accessibility + We plan to address the above areas of non-compliance with + accessibility + regulations on this website by February 2025. + + + + Preparation of this accessibility statement + This statement was prepared on 15 November 2021. + - + ); }; \ No newline at end of file diff --git a/src/components/Footer/BottomBar.stories.tsx b/src/components/Footer/BottomBar.stories.tsx index e603697..aa9f382 100644 --- a/src/components/Footer/BottomBar.stories.tsx +++ b/src/components/Footer/BottomBar.stories.tsx @@ -13,7 +13,7 @@ export const BottomBar: Story = { args: { title: 'Accessibility Statement', email: 'team@example.com', - clickAccessibility: () => console.log('Click Accessibility'), + onClickAccessibilityStatement: () => console.log('Click Accessibility'), url: 'http://localhost:6006' } }; \ No newline at end of file diff --git a/src/components/Footer/BottomBar.tsx b/src/components/Footer/BottomBar.tsx index c0e3689..f7fd1a4 100644 --- a/src/components/Footer/BottomBar.tsx +++ b/src/components/Footer/BottomBar.tsx @@ -1,14 +1,13 @@ import React from 'react'; -import {AppBar, Box, Link, Toolbar, Typography} from "@mui/material"; +import {AppBar, Link, Toolbar, Typography} from "@mui/material"; export interface BottomBarProps { - title: string; email: string; - clickAccessibility: () => void; + onClickAccessibilityStatement: () => void; url: string; } -export const BottomBar = ({title, email, clickAccessibility, url}: BottomBarProps) => { +export const BottomBar = ({email, onClickAccessibilityStatement, url}: BottomBarProps) => { return ( Support links: Email us - { - window.location.hash = 'accessibility'; - clickAccessibility(); - }} title={`${title}`}> + { + onClickAccessibilityStatement(); + }}> Accessibility statement Give feedback