diff --git a/app/README.md b/app/README.md index 8d9eb6d36..d3b5596d4 100644 --- a/app/README.md +++ b/app/README.md @@ -22,7 +22,7 @@ The National Document Repository user interface (UI) has been developed with Rea ### 1. Set Env Variables -Create a `.env` file by duplicating [.env.template](.env.template) and adding any missing values. This file is sourced to +In the app/ directory create a `.env` file by duplicating the [.env.template](.env.template) and adding any missing values. This file is sourced to your shell env so make sure it doesn't have any extra whitespace, comments etc. The `local` environment variable will allow your local app to bypass auth and mock most lambda requests. diff --git a/app/cypress/e2e/0-ndr-core-tests/feature_flag_workflows/lloyd_george_workflow.cy.js b/app/cypress/e2e/0-ndr-core-tests/feature_flag_workflows/lloyd_george_workflow.cy.js index 56b1a5be1..275130a64 100644 --- a/app/cypress/e2e/0-ndr-core-tests/feature_flag_workflows/lloyd_george_workflow.cy.js +++ b/app/cypress/e2e/0-ndr-core-tests/feature_flag_workflows/lloyd_george_workflow.cy.js @@ -28,7 +28,7 @@ describe('Feature flags - Lloyd George Workflow', () => { }); cy.title().should( 'eq', - 'Verify patient details - Access and store digital patient documents', + 'Patient details - Access and store digital patient documents', ); cy.get('#verify-submit').click(); diff --git a/app/cypress/e2e/0-ndr-core-tests/gp_user_workflows/download_lloyd_george_workflow.cy.js b/app/cypress/e2e/0-ndr-core-tests/gp_user_workflows/download_lloyd_george_workflow.cy.js index 972cf3c4a..77fdb6ee1 100644 --- a/app/cypress/e2e/0-ndr-core-tests/gp_user_workflows/download_lloyd_george_workflow.cy.js +++ b/app/cypress/e2e/0-ndr-core-tests/gp_user_workflows/download_lloyd_george_workflow.cy.js @@ -11,7 +11,7 @@ const downloadPageTitle = const downloadingPageTitle = 'Downloading documents - Access and store digital patient documents'; const downloadCompletePageTitle = 'Download complete - Access and store digital patient documents'; const verifyPatientPageTitle = - 'Verify patient details - Access and store digital patient documents'; + 'Patient details - Access and store digital patient documents'; const lloydGeorgeRecordPageTitle = 'Available records - Access and store digital patient documents'; const testFiles = [ { diff --git a/app/cypress/e2e/0-ndr-core-tests/gp_user_workflows/patient_search_and_verify_workflow.cy.js b/app/cypress/e2e/0-ndr-core-tests/gp_user_workflows/patient_search_and_verify_workflow.cy.js index 651588015..402d35791 100644 --- a/app/cypress/e2e/0-ndr-core-tests/gp_user_workflows/patient_search_and_verify_workflow.cy.js +++ b/app/cypress/e2e/0-ndr-core-tests/gp_user_workflows/patient_search_and_verify_workflow.cy.js @@ -65,7 +65,7 @@ describe('GP Workflow: Patient search and verify', () => { cy.wait('@search'); cy.title().should( 'eq', - 'Verify patient details - Access and store digital patient documents', + 'Patient details - Access and store digital patient documents', ); cy.url().should('include', 'verify'); @@ -73,7 +73,7 @@ describe('GP Workflow: Patient search and verify', () => { cy.get('#gp-message').should('be.visible'); cy.get('#gp-message').should( 'have.text', - 'Check these patient details match the records or attachments you plan to use', + 'This page displays the current data recorded in the Patient Demographic Service for this patient.', ); cy.get('#verify-submit').click(); diff --git a/app/src/components/blocks/_lloydGeorge/lloydGeorgeViewRecordStage/LloydGeorgeViewRecordStage.tsx b/app/src/components/blocks/_lloydGeorge/lloydGeorgeViewRecordStage/LloydGeorgeViewRecordStage.tsx index eec37f8ab..f4affc42c 100644 --- a/app/src/components/blocks/_lloydGeorge/lloydGeorgeViewRecordStage/LloydGeorgeViewRecordStage.tsx +++ b/app/src/components/blocks/_lloydGeorge/lloydGeorgeViewRecordStage/LloydGeorgeViewRecordStage.tsx @@ -26,7 +26,7 @@ import { import RecordCard from '../../../generic/recordCard/RecordCard'; import RecordMenuCard from '../../../generic/recordMenuCard/RecordMenuCard'; import useTitle from '../../../../helpers/hooks/useTitle'; -import { routeChildren } from '../../../../types/generic/routes'; +import { routes, routeChildren } from '../../../../types/generic/routes'; import { useNavigate } from 'react-router-dom'; import PatientSimpleSummary from '../../../generic/patientSimpleSummary/PatientSimpleSummary'; import ProgressBar from '../../../generic/progressBar/ProgressBar'; @@ -128,7 +128,10 @@ function LloydGeorgeViewRecordStage({ Exit full screen ) : ( - + )} {!fullScreen && userIsGpAdminNonBSOL && (
diff --git a/app/src/components/generic/backButton/BackButton.story.ts b/app/src/components/generic/backButton/BackButton.story.ts index 402090f1b..51a1efe04 100644 --- a/app/src/components/generic/backButton/BackButton.story.ts +++ b/app/src/components/generic/backButton/BackButton.story.ts @@ -18,4 +18,17 @@ export const BackButton: Story = { args: {}, }; +export const WithCustomText: Story = { + args: { + backLinkText: 'navigate to ...', + }, +}; + +export const WithCustomToLocationAndText: Story = { + args: { + toLocation: '/specified-location', + backLinkText: 'navigate to /specified-location', + }, +}; + export default meta; diff --git a/app/src/components/generic/backButton/BackButton.test.tsx b/app/src/components/generic/backButton/BackButton.test.tsx index 130a87a02..a320cf206 100644 --- a/app/src/components/generic/backButton/BackButton.test.tsx +++ b/app/src/components/generic/backButton/BackButton.test.tsx @@ -32,4 +32,30 @@ describe('BackButton', () => { expect(mockUseNavigate).toHaveBeenCalledWith(-1); }); }); + + it('navigates to specified location when the "toLocation" property is defined' , async () => { + + render(); + userEvent.click( screen.getByText('Go back')); + + await waitFor(() => { + expect(mockUseNavigate).toHaveBeenCalledWith('/specified-location'); + }); + + }); + + it('displays default back link text when "backLinkText" is not provided', async () => { + + render(); + expect(screen.getByText('Go back')).toBeInTheDocument(); + + }); + + it('displays custom back link text when "backLinkText" is defined', async () => { + + render(); + expect(screen.getByText('navigate to ...')).toBeInTheDocument(); + + }); + }); diff --git a/app/src/components/generic/backButton/BackButton.tsx b/app/src/components/generic/backButton/BackButton.tsx index 7b0e4d98a..e25b57a00 100644 --- a/app/src/components/generic/backButton/BackButton.tsx +++ b/app/src/components/generic/backButton/BackButton.tsx @@ -3,17 +3,24 @@ import React from 'react'; import type { MouseEvent } from 'react'; import { useNavigate } from 'react-router-dom'; -const BackButton = () => { +interface BackButtonProps { + toLocation?: string; + backLinkText?: string; +} + +const BackButton = ({ toLocation, backLinkText = 'Go back' }: BackButtonProps) => { const navigate = useNavigate(); const onBack = (e: MouseEvent) => { e.preventDefault(); - navigate(-1); + + if (toLocation) navigate(toLocation); + else navigate(-1); }; return ( - Go back + {backLinkText} ); }; diff --git a/app/src/pages/patientResultPage/PatientResultPage.test.tsx b/app/src/pages/patientResultPage/PatientResultPage.test.tsx index 34833c446..b92b1117a 100644 --- a/app/src/pages/patientResultPage/PatientResultPage.test.tsx +++ b/app/src/pages/patientResultPage/PatientResultPage.test.tsx @@ -19,6 +19,10 @@ jest.mock('../../helpers/hooks/usePatient'); const mockedUseRole = useRole as jest.Mock; const mockedUsePatient = usePatient as jest.Mock; +const PAGE_HEADER_TEXT = 'Patient details' +const PAGE_TEXT = "This page displays the current data recorded in the Patient Demographic Service for this patient." +const CONFIRM_BUTTON_TEXT = 'Confirm patient details and continue' + describe('PatientResultPage', () => { beforeEach(() => { process.env.REACT_APP_ENVIRONMENT = 'jest'; @@ -32,7 +36,7 @@ describe('PatientResultPage', () => { it('displays component', () => { render(); - expect(screen.getByText('Verify patient details')).toBeInTheDocument(); + expect(screen.getByText(PAGE_HEADER_TEXT)).toBeInTheDocument(); }); it.each(authorisedRoles)( @@ -47,23 +51,13 @@ describe('PatientResultPage', () => { render(); expect( - screen.getByRole('heading', { name: 'Verify patient details' }), + screen.getByRole('heading', { name: PAGE_HEADER_TEXT }), ).toBeInTheDocument(); expect(screen.getByText(familyName)).toBeInTheDocument(); expect( - screen.getByRole('button', { name: 'Accept details are correct' }), + screen.getByRole('button', { name: CONFIRM_BUTTON_TEXT }), ).toBeInTheDocument(); - expect(screen.getByText(/If patient details are incorrect/)).toBeInTheDocument(); - - const nationalServiceDeskLink = screen.getByRole('link', { - name: /National Service Desk/, - }); - expect(nationalServiceDeskLink).toHaveAttribute( - 'href', - 'https://digital.nhs.uk/about-nhs-digital/contact-us#nhs-digital-service-desks', - ); - expect(nationalServiceDeskLink).toHaveAttribute('target', '_blank'); }, ); @@ -79,11 +73,11 @@ describe('PatientResultPage', () => { render(); expect( - screen.getByRole('heading', { name: 'Verify patient details' }), + screen.getByRole('heading', { name: PAGE_HEADER_TEXT }), ).toBeInTheDocument(); expect( screen.getByText( - 'Check these patient details match the records or attachments you plan to use', + PAGE_TEXT , ), ).toBeInTheDocument(); }, @@ -100,7 +94,7 @@ describe('PatientResultPage', () => { render(); expect( - screen.getByRole('heading', { name: 'Verify patient details' }), + screen.getByRole('heading', { name: PAGE_HEADER_TEXT }), ).toBeInTheDocument(); expect(screen.queryByText('Select patient status')).not.toBeInTheDocument(); @@ -110,7 +104,7 @@ describe('PatientResultPage', () => { ).not.toBeInTheDocument(); expect( screen.queryByText( - 'Check these patient details match the records or attachments you plan to use', + PAGE_TEXT, ), ).not.toBeInTheDocument(); }); @@ -127,7 +121,7 @@ describe('PatientResultPage', () => { act(() => { userEvent.click( screen.getByRole('button', { - name: 'Accept details are correct', + name: CONFIRM_BUTTON_TEXT, }), ); }); @@ -148,7 +142,7 @@ describe('PatientResultPage', () => { render(); expect( - screen.getByRole('heading', { name: 'Verify patient details' }), + screen.getByRole('heading', { name: PAGE_HEADER_TEXT }), ).toBeInTheDocument(); expect( screen.getByText('The NHS number for this patient has changed.'), @@ -167,7 +161,7 @@ describe('PatientResultPage', () => { render(); expect( - screen.getByRole('heading', { name: 'Verify patient details' }), + screen.getByRole('heading', { name: PAGE_HEADER_TEXT }), ).toBeInTheDocument(); expect( screen.getByText( @@ -190,7 +184,7 @@ describe('PatientResultPage', () => { render(); expect( - screen.getByRole('heading', { name: 'Verify patient details' }), + screen.getByRole('heading', { name: PAGE_HEADER_TEXT }), ).toBeInTheDocument(); const results = await runAxeTest(document.body); @@ -237,7 +231,7 @@ describe('PatientResultPage', () => { act(() => { userEvent.click( screen.getByRole('button', { - name: 'Accept details are correct', + name: CONFIRM_BUTTON_TEXT, }), ); }); @@ -259,7 +253,7 @@ describe('PatientResultPage', () => { act(() => { userEvent.click( - screen.getByRole('button', { name: 'Accept details are correct' }), + screen.getByRole('button', { name: CONFIRM_BUTTON_TEXT }), ); }); @@ -275,7 +269,7 @@ describe('PatientResultPage', () => { render(); - userEvent.click(screen.getByRole('button', { name: 'Accept details are correct' })); + userEvent.click(screen.getByRole('button', { name: CONFIRM_BUTTON_TEXT })); await waitFor(() => { expect(mockedUseNavigate).toHaveBeenCalledWith(routes.ARF_OVERVIEW); diff --git a/app/src/pages/patientResultPage/PatientResultPage.tsx b/app/src/pages/patientResultPage/PatientResultPage.tsx index 9bf56689b..4ba8ce98e 100644 --- a/app/src/pages/patientResultPage/PatientResultPage.tsx +++ b/app/src/pages/patientResultPage/PatientResultPage.tsx @@ -8,7 +8,6 @@ import ErrorBox from '../../components/layout/errorBox/ErrorBox'; import { REPOSITORY_ROLE } from '../../types/generic/authRole'; import useRole from '../../helpers/hooks/useRole'; import usePatient from '../../helpers/hooks/usePatient'; -import ServiceDeskLink from '../../components/generic/serviceDeskLink/ServiceDeskLink'; import useTitle from '../../helpers/hooks/useTitle'; import PatientSummary from '../../components/generic/patientSummary/PatientSummary'; @@ -44,11 +43,11 @@ function PatientResultPage() { }; const showWarning = patientDetails?.superseded || patientDetails?.restricted; const isGp = userIsGPAdmin || userIsGPClinical; - const pageHeader = 'Verify patient details'; + const pageHeader = 'Patient details'; useTitle({ pageTitle: pageHeader }); return (
- + {inputError && (

- Check these patient details match the records or attachments you plan to - use + This page displays the current data recorded in the Patient Demographic + Service for this patient.

)} - -

- If patient details are incorrect, please contact the -

); }