diff --git a/src/applications/mhv-medical-records/components/MrBreadcrumbs.jsx b/src/applications/mhv-medical-records/components/MrBreadcrumbs.jsx index 5637e49e279b..da78d2a9ee24 100644 --- a/src/applications/mhv-medical-records/components/MrBreadcrumbs.jsx +++ b/src/applications/mhv-medical-records/components/MrBreadcrumbs.jsx @@ -5,12 +5,13 @@ import { Link, useHistory, useLocation, useParams } from 'react-router-dom'; import { Breadcrumbs, Paths } from '../util/constants'; import { setBreadcrumbs } from '../actions/breadcrumbs'; import { clearPageNumber, setPageNumber } from '../actions/pageTracker'; -import { handleDataDogAction } from '../util/helpers'; +import { handleDataDogAction, removeTrialingSlash } from '../util/helpers'; const MrBreadcrumbs = () => { const dispatch = useDispatch(); const location = useLocation(); const history = useHistory(); + const crumbsList = useSelector(state => state.mr.breadcrumbs.crumbsList); const pageNumber = useSelector(state => state.mr.pageTracker.pageNumber); const phase0p5Flag = useSelector( @@ -58,18 +59,16 @@ const MrBreadcrumbs = () => { if (pageNumber) { backToPageNumCrumb = { ...Breadcrumbs[feature], - href: `${Breadcrumbs[feature].href.slice( - 0, - -1, + href: `${removeTrialingSlash( + Breadcrumbs[feature].href, )}?page=${pageNumber}`, }; dispatch(setBreadcrumbs([backToPageNumCrumb, detailCrumb])); } else if (urlVitalsDate) { const backToVitalsDateCrumb = { ...Breadcrumbs[feature], - href: `${Breadcrumbs[feature].href.slice( - 0, - -1, + href: `${removeTrialingSlash( + Breadcrumbs[feature].href, )}?timeFrame=${urlVitalsDate}`, }; dispatch(setBreadcrumbs([backToVitalsDateCrumb, detailCrumb])); @@ -80,7 +79,14 @@ const MrBreadcrumbs = () => { dispatch(setBreadcrumbs([Breadcrumbs[feature]])); } }, - [dispatch, locationBasePath, locationChildPath, textContent, pageNumber], + [ + dispatch, + locationBasePath, + locationChildPath, + textContent, + pageNumber, + urlVitalsDate, + ], ); const handleRouteChange = ({ detail }) => { diff --git a/src/applications/mhv-medical-records/util/helpers.js b/src/applications/mhv-medical-records/util/helpers.js index 2c75b8f95a01..f4a1d9d790ca 100644 --- a/src/applications/mhv-medical-records/util/helpers.js +++ b/src/applications/mhv-medical-records/util/helpers.js @@ -681,3 +681,13 @@ export const formatDateInLocalTimezone = date => { export const formatUserDob = userProfile => { return userProfile?.dob ? formatDateLong(userProfile.dob) : 'Not found'; }; + +/** + * Removes the trailing slash from a path + * + * @param {string} path path to remove trailing slash from + * @returns {string} path without trailing slash + */ +export const removeTrialingSlash = path => { + return path.replace(/\/$/, ''); +};