From 421f126a0cbb937cd0e8a9c3772c31b25ee323a1 Mon Sep 17 00:00:00 2001 From: Ollie Beumkes Date: Wed, 18 Dec 2024 10:34:52 +0000 Subject: [PATCH 01/11] [PRMP-1348] Updated the nhsuk-frontend package to 9.1.0 --- app/package-lock.json | 11 +++++++---- app/package.json | 2 +- 2 files changed, 8 insertions(+), 5 deletions(-) diff --git a/app/package-lock.json b/app/package-lock.json index 8c4d99764..220a5b977 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -19,7 +19,7 @@ "fake-progress": "^1.0.4", "history": "^5.3.0", "moment": "^2.30.1", - "nhsuk-frontend": "^7.0.0", + "nhsuk-frontend": "^9.1.0", "nhsuk-react-components": "^2.2.2", "pdfobject": "^2.2.12", "react": "^18.2.0", @@ -22575,9 +22575,12 @@ "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==" }, "node_modules/nhsuk-frontend": { - "version": "7.1.0", - "resolved": "https://registry.npmjs.org/nhsuk-frontend/-/nhsuk-frontend-7.1.0.tgz", - "integrity": "sha512-V3GDwwAWgBOZHKlh8kdpq8hiOh/mbD95MQrgI1qych2yRFeMXdOg1439VkOmmdKBJT5zuy9BA//33aU5NzYfjw==" + "version": "9.1.0", + "resolved": "https://registry.npmjs.org/nhsuk-frontend/-/nhsuk-frontend-9.1.0.tgz", + "integrity": "sha512-z2hcZDUDz12hjBTWLasq5lfX+sv2jwZFkUdip8qL9fBQ6qykyQFQ8PjWuBBgQN03IU0wMkV3BBLbwBjFiSxREQ==", + "engines": { + "node": ">=20.0.0" + } }, "node_modules/nhsuk-react-components": { "version": "2.2.2", diff --git a/app/package.json b/app/package.json index 6797421de..34b8bd747 100644 --- a/app/package.json +++ b/app/package.json @@ -32,7 +32,7 @@ "fake-progress": "^1.0.4", "history": "^5.3.0", "moment": "^2.30.1", - "nhsuk-frontend": "^7.0.0", + "nhsuk-frontend": "^9.1.0", "nhsuk-react-components": "^2.2.2", "pdfobject": "^2.2.12", "react": "^18.2.0", From e61828559e5e9e3aaaaa4a90929cb5353be005fd Mon Sep 17 00:00:00 2001 From: Ollie Beumkes Date: Mon, 6 Jan 2025 15:22:20 +0000 Subject: [PATCH 02/11] [PRMP-1348] - Updated broken components from the upgrade of nhsuk-frontend and nshuk-react-components --- app/package-lock.json | 10 +++---- app/package.json | 2 +- .../documentInputForm/DocumentInputForm.tsx | 4 +-- .../LloydGeorgeFileInputStage.tsx | 4 +-- .../LloydGeorgeSelectSearchResults.tsx | 29 +++++++++---------- app/src/pages/feedbackPage/FeedbackPage.tsx | 6 ++-- .../patientSearchPage/PatientSearchPage.tsx | 4 +-- 7 files changed, 29 insertions(+), 30 deletions(-) diff --git a/app/package-lock.json b/app/package-lock.json index 220a5b977..9de7c275c 100644 --- a/app/package-lock.json +++ b/app/package-lock.json @@ -20,7 +20,7 @@ "history": "^5.3.0", "moment": "^2.30.1", "nhsuk-frontend": "^9.1.0", - "nhsuk-react-components": "^2.2.2", + "nhsuk-react-components": "^5.0.0", "pdfobject": "^2.2.12", "react": "^18.2.0", "react-dom": "^18.2.0", @@ -22583,14 +22583,14 @@ } }, "node_modules/nhsuk-react-components": { - "version": "2.2.2", - "resolved": "https://registry.npmjs.org/nhsuk-react-components/-/nhsuk-react-components-2.2.2.tgz", - "integrity": "sha512-jShzbw7Wi6Vb+KxFuBF9fWPHw9ZUxxUVaAWGsFsRrdc6+yBiA+q5x/DwxnGytq7+UFpN5on+kd8Q1jnrOkBn3A==", + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/nhsuk-react-components/-/nhsuk-react-components-5.0.0.tgz", + "integrity": "sha512-9QbYNEgLXdFaaEbrGs3IR9Gfn3M0a/6VH8a8fjPLWofl9FaP9HArpXh+eKz6D5YzUP6SmA0+0M8b84stJyBqdQ==", "dependencies": { "classnames": "^2.2.6" }, "peerDependencies": { - "nhsuk-frontend": ">=4.0.0", + "nhsuk-frontend": ">=9.0.0 <10.0.0", "react": ">=16.8.0", "react-dom": ">=16.8.0" } diff --git a/app/package.json b/app/package.json index 34b8bd747..1e2006753 100644 --- a/app/package.json +++ b/app/package.json @@ -33,7 +33,7 @@ "history": "^5.3.0", "moment": "^2.30.1", "nhsuk-frontend": "^9.1.0", - "nhsuk-react-components": "^2.2.2", + "nhsuk-react-components": "^5.0.0", "pdfobject": "^2.2.12", "react": "^18.2.0", "react-dom": "^18.2.0", diff --git a/app/src/components/blocks/_arf/documentInputForm/DocumentInputForm.tsx b/app/src/components/blocks/_arf/documentInputForm/DocumentInputForm.tsx index db145e703..25225bd1d 100644 --- a/app/src/components/blocks/_arf/documentInputForm/DocumentInputForm.tsx +++ b/app/src/components/blocks/_arf/documentInputForm/DocumentInputForm.tsx @@ -1,4 +1,4 @@ -import { Input, Table, WarningCallout } from 'nhsuk-react-components'; +import { TextInput, Table, WarningCallout } from 'nhsuk-react-components'; import React from 'react'; import { DOCUMENT_TYPE, @@ -37,7 +37,7 @@ const DocumentInputForm = ({ }); return ( <> -
- ) => { + const handleChangeCheckboxes = (e: React.FormEvent) => { const target = e.target as HTMLInputElement; const toggledDocumentId = target.value; if (target.checked) { @@ -120,19 +120,18 @@ const AvailableFilesTable = ({ > {allowSelectDocument && ( - - - - {result.fileName} - - - + handleChangeCheckboxes(e)} + > + + {result.fileName} + + )} - - {pageTitle} - Date: Mon, 6 Jan 2025 16:37:53 +0000 Subject: [PATCH 03/11] [PRMP-1348] - Merged with main --- .lintstagedrc | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.lintstagedrc b/.lintstagedrc index b3c11a033..9567680eb 100644 --- a/.lintstagedrc +++ b/.lintstagedrc @@ -8,7 +8,7 @@ ], "*.py": [ "./lambdas/venv/bin/python3 -m isort --profile black", - # "./lambdas/venv/bin/python3 -m black", + "./lambdas/venv/bin/python3 -m black", "./lambdas/venv/bin/ruff check ./lambdas" ] } \ No newline at end of file From 2a86089928e087783c16787d3b9944d6d692fafd Mon Sep 17 00:00:00 2001 From: Ollie Beumkes Date: Wed, 8 Jan 2025 11:08:23 +0000 Subject: [PATCH 04/11] [PRMP-1348] - Updated cypress tests to pass --- app/cypress/e2e/0-ndr-core-tests/homepage.cy.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/app/cypress/e2e/0-ndr-core-tests/homepage.cy.js b/app/cypress/e2e/0-ndr-core-tests/homepage.cy.js index 3472e96df..f69f3793a 100644 --- a/app/cypress/e2e/0-ndr-core-tests/homepage.cy.js +++ b/app/cypress/e2e/0-ndr-core-tests/homepage.cy.js @@ -58,13 +58,13 @@ describe('Home Page', () => { 'have.text', 'Access and store digital patient documents', ); - cy.get('.nhsuk-header__navigation').should('not.exist'); + cy.get('.nhsuk-navigation-container').should('not.exist'); cy.get('.nhsuk-header__navigation-list').should('not.exist'); cy.login(Roles.GP_CLINICAL, true); cy.url().should('eq', baseUrl + patientSearchUrl); - cy.get('.nhsuk-header__navigation').should('exist'); + cy.get('.nhsuk-navigation-container').should('exist'); cy.get('.nhsuk-header__navigation-list').should('exist'); }, ); @@ -111,7 +111,7 @@ describe('Home Page', () => { 'You’re outside of Birmingham and Solihull (BSOL)', ); - cy.get('.nhsuk-header__navigation').should('exist'); + cy.get('.nhsuk-navigation-container').should('exist'); cy.get('.nhsuk-header__navigation-list').should('exist'); }, ); @@ -129,7 +129,7 @@ describe('Home Page', () => { 'You’re outside of Birmingham and Solihull (BSOL)', ); - cy.get('.nhsuk-header__navigation').should('exist'); + cy.get('.nhsuk-navigation-container').should('exist'); cy.get('.nhsuk-header__navigation-list').should('exist'); }, ); @@ -157,7 +157,7 @@ describe('Home Page', () => { cy.login(Roles.GP_CLINICAL); - cy.get('.nhsuk-header__navigation').should('exist'); + cy.get('.nhsuk-navigation-container').should('exist'); cy.get('.nhsuk-header__navigation-list').should('exist'); cy.intercept('GET', '/Auth/Logout', { From e17e63b2041dfe0adb3ac266acc76aa9b7288c1d Mon Sep 17 00:00:00 2001 From: abid-nhs Date: Tue, 14 Jan 2025 15:30:50 +0000 Subject: [PATCH 05/11] PRMP-1348 - remove h1 --- app/src/pages/patientSearchPage/PatientSearchPage.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/app/src/pages/patientSearchPage/PatientSearchPage.tsx b/app/src/pages/patientSearchPage/PatientSearchPage.tsx index 44957de66..93394941b 100644 --- a/app/src/pages/patientSearchPage/PatientSearchPage.tsx +++ b/app/src/pages/patientSearchPage/PatientSearchPage.tsx @@ -107,8 +107,6 @@ function PatientSearchPage() { )} )} -

{pageTitle}

- {/*todo do i keep the above or remove it*/}
From 8dd88cc4424d0b507da4b1e506f0fcb7341da027 Mon Sep 17 00:00:00 2001 From: abid-nhs Date: Mon, 20 Jan 2025 15:48:09 +0000 Subject: [PATCH 06/11] PRMP-1348 - fix seach for a patient title spacing --- app/src/pages/patientSearchPage/PatientSearchPage.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/app/src/pages/patientSearchPage/PatientSearchPage.tsx b/app/src/pages/patientSearchPage/PatientSearchPage.tsx index 93394941b..c11f5d74b 100644 --- a/app/src/pages/patientSearchPage/PatientSearchPage.tsx +++ b/app/src/pages/patientSearchPage/PatientSearchPage.tsx @@ -108,10 +108,8 @@ function PatientSearchPage() { )} +

{pageTitle}

- - {pageTitle} - Date: Tue, 21 Jan 2025 14:27:48 +0000 Subject: [PATCH 07/11] PRMP-1348 - fix back link spacing --- app/src/styles/App.scss | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/app/src/styles/App.scss b/app/src/styles/App.scss index b857f054d..39eabdb70 100644 --- a/app/src/styles/App.scss +++ b/app/src/styles/App.scss @@ -695,6 +695,12 @@ $hunit: '%'; } } +// override +.nhsuk-back-link { + margin-top: nhsuk-spacing(0); + margin-bottom: nhsuk-spacing(3); +} + // Generic .pdfobject-container:focus { border: 2px solid #212b32; From 570394b21055b38bed21d394a58e65daac8cd4e2 Mon Sep 17 00:00:00 2001 From: abid-nhs Date: Fri, 24 Jan 2025 16:39:38 +0000 Subject: [PATCH 08/11] PRMP-1348 - make navigation bar responsive --- .../components/layout/navLinks/NavLinks.tsx | 61 ++++++------------- app/src/styles/App.scss | 23 +++++++ 2 files changed, 40 insertions(+), 44 deletions(-) diff --git a/app/src/components/layout/navLinks/NavLinks.tsx b/app/src/components/layout/navLinks/NavLinks.tsx index 4433aeae6..e2280668a 100644 --- a/app/src/components/layout/navLinks/NavLinks.tsx +++ b/app/src/components/layout/navLinks/NavLinks.tsx @@ -23,55 +23,28 @@ const NavLinks = () => { }, []); const appLinks = [ + { href: routes.START, label: 'Home', id: 'home-btn' }, { href: routes.SEARCH_PATIENT, label: 'Search for a patient', id: 'search-btn' }, { href: routes.LOGOUT, label: 'Sign out', id: 'logout-btn' }, ]; return session.isLoggedIn ? ( - - nav(e, routes.START)} - > - Home - - {width <= 990 ? ( - <> - {appLinks.map((l) => ( - nav(e, l.href)} - > - {l.label} - - ))} - - ) : ( -
- {appLinks.map((l) => ( - nav(e, l.href)} - > - {l.label} - - ))} -
- )} - +
+ + {appLinks.map((l) => ( + nav(e, l.href)} + > + {l.label} + + ))} + +
) : null; }; diff --git a/app/src/styles/App.scss b/app/src/styles/App.scss index 39eabdb70..08fd44b98 100644 --- a/app/src/styles/App.scss +++ b/app/src/styles/App.scss @@ -701,6 +701,29 @@ $hunit: '%'; margin-bottom: nhsuk-spacing(3); } +.nhsuk-header__navigation-list { + display: grid; + grid-template-columns: auto auto 1fr; +} + +@media (min-width: 350px) { + .nhsuk-header__navigation-item:nth-last-child(1) { + justify-self: end; + } +} + +@media (max-width: 350px) { + .nhsuk-header__navigation-list { + display: flex; + flex-direction: column; + gap: 0; + } + + .nhsuk-header__navigation-link { + padding: 4px 2px; + } +} + // Generic .pdfobject-container:focus { border: 2px solid #212b32; From ee26492b99330250f32127dc644e897d0392b18b Mon Sep 17 00:00:00 2001 From: abid-nhs Date: Fri, 24 Jan 2025 16:54:47 +0000 Subject: [PATCH 09/11] PRMP-1348 - fix broken tests --- .../components/layout/navLinks/NavLinks.tsx | 30 +++++++++---------- 1 file changed, 14 insertions(+), 16 deletions(-) diff --git a/app/src/components/layout/navLinks/NavLinks.tsx b/app/src/components/layout/navLinks/NavLinks.tsx index e2280668a..34b6e61bb 100644 --- a/app/src/components/layout/navLinks/NavLinks.tsx +++ b/app/src/components/layout/navLinks/NavLinks.tsx @@ -29,22 +29,20 @@ const NavLinks = () => { ]; return session.isLoggedIn ? ( -
- - {appLinks.map((l) => ( - nav(e, l.href)} - > - {l.label} - - ))} - -
+ + {appLinks.map((l) => ( + nav(e, l.href)} + > + {l.label} + + ))} + ) : null; }; From c0fdc730d804cd1f6e9d966cc7d0e82196735956 Mon Sep 17 00:00:00 2001 From: abid-nhs Date: Fri, 24 Jan 2025 17:07:53 +0000 Subject: [PATCH 10/11] PRMP-1348 - remove unused code --- .../components/layout/navLinks/NavLinks.tsx | 9 ----- app/src/styles/App.scss | 39 ------------------- 2 files changed, 48 deletions(-) diff --git a/app/src/components/layout/navLinks/NavLinks.tsx b/app/src/components/layout/navLinks/NavLinks.tsx index 34b6e61bb..7326eafea 100644 --- a/app/src/components/layout/navLinks/NavLinks.tsx +++ b/app/src/components/layout/navLinks/NavLinks.tsx @@ -8,20 +8,11 @@ import { useSessionContext } from '../../../providers/sessionProvider/SessionPro const NavLinks = () => { const navigate = useNavigate(); const [session] = useSessionContext(); - const [width, setWidth] = useState(window.innerWidth); const nav = (e: ReactEvent, link: string) => { e.preventDefault(); navigate(link); }; - useEffect(() => { - const handleResizeWindow = () => setWidth(window.innerWidth); - window.addEventListener('resize', handleResizeWindow); - return () => { - window.removeEventListener('resize', handleResizeWindow); - }; - }, []); - const appLinks = [ { href: routes.START, label: 'Home', id: 'home-btn' }, { href: routes.SEARCH_PATIENT, label: 'Search for a patient', id: 'search-btn' }, diff --git a/app/src/styles/App.scss b/app/src/styles/App.scss index 08fd44b98..78b2e02a8 100644 --- a/app/src/styles/App.scss +++ b/app/src/styles/App.scss @@ -656,45 +656,6 @@ $hunit: '%'; } } -// NavLinks -.navlinks { - display: initial; - - &_wrapper { - display: flex; - flex-flow: row nowrap; - } - - .nhsuk-header__navigation-title { - color: $color_nhsuk-white; - } - - .nhsuk-header__navigation-close { - display: none; - } - - &_item { - a { - color: $color_nhsuk-white; - text-decoration: underline; - text-decoration-color: $color_nhsuk-white; - text-underline-offset: 2px; - } - - a:hover { - text-decoration: none; - } - - a:visited { - color: $color_nhsuk-white; - } - - &--desktop { - margin: 0 2rem; - } - } -} - // override .nhsuk-back-link { margin-top: nhsuk-spacing(0); From a48553eaf2b896b9a8508c2ea21556207c889576 Mon Sep 17 00:00:00 2001 From: abid-nhs Date: Fri, 24 Jan 2025 17:22:43 +0000 Subject: [PATCH 11/11] PRMP-1348 - remove unused imports --- app/src/components/layout/navLinks/NavLinks.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/app/src/components/layout/navLinks/NavLinks.tsx b/app/src/components/layout/navLinks/NavLinks.tsx index 7326eafea..10c069e0e 100644 --- a/app/src/components/layout/navLinks/NavLinks.tsx +++ b/app/src/components/layout/navLinks/NavLinks.tsx @@ -1,4 +1,3 @@ -import React, { useEffect, useState } from 'react'; import type { MouseEvent as ReactEvent } from 'react'; import { Header } from 'nhsuk-react-components'; import { useNavigate } from 'react-router-dom';