MHV-65053: Download page titles fixed (#33550)

department-of-veterans-affairs · Dec 13, 2024 · ae2024a · ae2024a
1 parent 27e982a
commit ae2024a
Show file tree

Hide file tree

Showing 5 changed files with 39 additions and 2 deletions.
diff --git a/src/applications/mhv-medical-records/components/DownloadRecords/DowloadDateRange.jsx b/src/applications/mhv-medical-records/components/DownloadRecords/DowloadDateRange.jsx
@@ -7,8 +7,11 @@ import React, { useCallback, useState, useEffect } from 'react';
 import { useHistory } from 'react-router-dom';
 import { useDispatch } from 'react-redux';
 import { subMonths, format } from 'date-fns';
+import { focusElement } from '@department-of-veterans-affairs/platform-utilities/ui';
+import { updatePageTitle } from '@department-of-veterans-affairs/mhv/exports';
 import NeedHelpSection from './NeedHelpSection';
 import { updateReportDateRange } from '../../actions/downloads';
+import { pageTitles } from '../../util/constants';
 
 const DownloadDateRange = () => {
   const history = useHistory();
@@ -45,6 +48,14 @@ const DownloadDateRange = () => {
     [setSelectedDate],
   );
 
+  useEffect(
+    () => {
+      focusElement(document.querySelector('h1'));
+      updatePageTitle(pageTitles.DOWNLOAD_PAGE_TITLE);
+    },
+    [dispatch],
+  );
+
   useEffect(
     () => {
       if (customFromDate !== '' && customToDate !== '') {

diff --git a/src/applications/mhv-medical-records/components/DownloadRecords/DownloadFileType.jsx b/src/applications/mhv-medical-records/components/DownloadRecords/DownloadFileType.jsx
@@ -4,11 +4,13 @@ import { useDispatch, useSelector } from 'react-redux';
 import PropTypes from 'prop-types';
 import { formatDateLong } from '@department-of-veterans-affairs/platform-utilities/exports';
 import {
+  updatePageTitle,
   generatePdfScaffold,
   formatName,
 } from '@department-of-veterans-affairs/mhv/exports';
 import { VaRadio } from '@department-of-veterans-affairs/component-library/dist/react-bindings';
 import { isBefore, isAfter } from 'date-fns';
+import { focusElement } from '@department-of-veterans-affairs/platform-utilities/ui';
 import NeedHelpSection from './NeedHelpSection';
 import DownloadingRecordsInfo from '../shared/DownloadingRecordsInfo';
 import DownloadSuccessAlert from '../shared/DownloadSuccessAlert';
@@ -21,6 +23,7 @@ import { getTxtContent } from '../../util/txtHelpers/blueButton';
 import { getBlueButtonReportData } from '../../actions/blueButtonReport';
 import { generateBlueButtonData } from '../../util/pdfHelpers/blueButton';
 import { clearAlerts } from '../../actions/alerts';
+import { pageTitles } from '../../util/constants';
 import { Actions } from '../../util/actionTypes';
 
 const DownloadFileType = props => {
@@ -61,6 +64,14 @@ const DownloadFileType = props => {
 
   const [downloadStarted, setDownloadStarted] = useState(false);
 
+  useEffect(
+    () => {
+      focusElement(document.querySelector('h1'));
+      updatePageTitle(pageTitles.DOWNLOAD_PAGE_TITLE);
+    },
+    [dispatch],
+  );
+
   useEffect(
     () => {
       if (!dateFilter) {

diff --git a/src/applications/mhv-medical-records/components/DownloadRecords/DownloadRecordType.jsx b/src/applications/mhv-medical-records/components/DownloadRecords/DownloadRecordType.jsx
@@ -5,9 +5,12 @@ import {
 import React, { useState, useMemo, useEffect } from 'react';
 import { useHistory } from 'react-router-dom';
 import { useDispatch, useSelector } from 'react-redux';
+import { focusElement } from '@department-of-veterans-affairs/platform-utilities/ui';
+import { updatePageTitle } from '@department-of-veterans-affairs/mhv/exports';
 import { format } from 'date-fns';
 import NeedHelpSection from './NeedHelpSection';
 import { updateReportRecordType } from '../../actions/downloads';
+import { pageTitles } from '../../util/constants';
 
 const DownloadRecordType = () => {
   const history = useHistory();
@@ -30,6 +33,14 @@ const DownloadRecordType = () => {
   const [selectedRecords, setSelectedRecords] = useState([]);
   const [selectionError, setSelectionError] = useState(null);
 
+  useEffect(
+    () => {
+      focusElement(document.querySelector('h1'));
+      updatePageTitle(pageTitles.DOWNLOAD_PAGE_TITLE);
+    },
+    [dispatch],
+  );
+
   const handleCheckAll = () => {
     setSelectionError(null);
 

diff --git a/src/applications/mhv-medical-records/containers/DownloadReportPage.jsx b/src/applications/mhv-medical-records/containers/DownloadReportPage.jsx
@@ -2,13 +2,15 @@ import React, { useCallback, useEffect, useState, useMemo } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import PropTypes from 'prop-types';
 import {
+  updatePageTitle,
   generatePdfScaffold,
   formatName,
 } from '@department-of-veterans-affairs/mhv/exports';
 import { formatDateLong } from '@department-of-veterans-affairs/platform-utilities/exports';
 import { add, compareAsc } from 'date-fns';
 import { mhvUrl } from '~/platform/site-wide/mhv/utilities';
 import { isAuthenticatedWithSSOe } from '~/platform/user/authentication/selectors';
+import { focusElement } from '@department-of-veterans-affairs/platform-utilities/ui';
 import NeedHelpSection from '../components/DownloadRecords/NeedHelpSection';
 import ExternalLink from '../components/shared/ExternalLink';
 import MissingRecordsError from '../components/DownloadRecords/MissingRecordsError';
@@ -31,7 +33,7 @@ import {
 import { allAreDefined, getNameDateAndTime, makePdf } from '../util/helpers';
 import { clearAlerts } from '../actions/alerts';
 import { generateSelfEnteredData } from '../util/pdfHelpers/sei';
-import { UNKNOWN } from '../util/constants';
+import { pageTitles, UNKNOWN } from '../util/constants';
 import { genAndDownloadCCD } from '../actions/downloads';
 import DownloadSuccessAlert from '../components/shared/DownloadSuccessAlert';
 import { Actions } from '../util/actionTypes';
@@ -109,6 +111,8 @@ const DownloadReportPage = ({ runningUnitTest }) => {
 
   useEffect(
     () => {
+      focusElement(document.querySelector('h1'));
+      updatePageTitle(pageTitles.DOWNLOAD_PAGE_TITLE);
       return () => {
         dispatch({ type: Actions.Downloads.BB_CLEAR_ALERT });
       };

diff --git a/src/applications/mhv-medical-records/util/constants.js b/src/applications/mhv-medical-records/util/constants.js
@@ -237,7 +237,7 @@ export const pageTitles = {
     'Health Condition Details - Medical Records | Veterans Affairs',
   VITALS_PAGE_TITLE: 'Vitals - Medical Records | Veterans Affairs',
   DOWNLOAD_PAGE_TITLE:
-    'Download All Medical Records - Medical Records | Veterans Affairs',
+    'Download Medical Records Reports - Medical Records | Veterans Affairs',
   SETTINGS_PAGE_TITLE:
     'Medical Records Settings - Medical Records | Veterans Affairs',
 };