diff --git a/src/container-comparison/CompareContainersWidget.test.tsx b/src/container-comparison/CompareContainersWidget.test.tsx
index dcfe6cb8ed..e96f22186c 100644
--- a/src/container-comparison/CompareContainersWidget.test.tsx
+++ b/src/container-comparison/CompareContainersWidget.test.tsx
@@ -72,7 +72,7 @@ describe('CompareContainersWidget', () => {
expect(await screen.findByRole('button', { name: 'subsection block 0' })).toBeInTheDocument();
// Back breadcrumb
- const backbtns = await screen.findAllByRole('button', { name: 'Back' });
+ const backbtns = await screen.findAllByRole('button', { name: '← Back' });
expect(backbtns.length).toEqual(2);
// Go back
diff --git a/src/container-comparison/CompareContainersWidget.tsx b/src/container-comparison/CompareContainersWidget.tsx
index 06968a503c..9688783519 100644
--- a/src/container-comparison/CompareContainersWidget.tsx
+++ b/src/container-comparison/CompareContainersWidget.tsx
@@ -4,7 +4,7 @@ import {
Alert,
Breadcrumb, Button, Card, Icon, Stack,
} from '@openedx/paragon';
-import { ArrowBack, Add, Delete } from '@openedx/paragon/icons';
+import { Add, Delete } from '@openedx/paragon/icons';
import { FormattedMessage, useIntl } from '@edx/frontend-platform/i18n';
import { ContainerType, getBlockType } from '@src/generic/key-utils';
@@ -152,8 +152,7 @@ const CompareContainersWidgetInner = ({
ariaLabel={intl.formatMessage(messages.breadcrumbAriaLabel)}
links={[
{
- // This raises failed prop-type error as label expects a string but it works without any issues
- label: Back,
+ label: `← ${intl.formatMessage(messages.breadcrumbBackLabel)}`,
onClick: onBackBtnClick,
variant: 'link',
className: 'px-0 text-gray-900',
diff --git a/src/container-comparison/messages.ts b/src/container-comparison/messages.ts
index 549824c90d..3e70bf902c 100644
--- a/src/container-comparison/messages.ts
+++ b/src/container-comparison/messages.ts
@@ -68,8 +68,13 @@ const messages = defineMessages({
},
breadcrumbAriaLabel: {
id: 'course-authoring.container-comparison.diff.breadcrumb.ariaLabel',
- defaultMessage: 'Title breadcrumb',
- description: 'Aria label text for breadcrumb in diff preview',
+ defaultMessage: 'Location',
+ description: 'Accessible label for the breadcrumbs which display the location of the unit, e.g. Section 1 > Unit 4',
+ },
+ breadcrumbBackLabel: {
+ id: 'course-authoring.container-comparison.diff.breadcrumb.backLabel',
+ defaultMessage: 'Back',
+ description: 'Link to go back to the parent section/subsection',
},
diffBeforeTitle: {
id: 'course-authoring.container-comparison.diff.before.title',
diff --git a/src/course-unit/move-modal/index.tsx b/src/course-unit/move-modal/index.tsx
index d687d94f11..1b1a5cdb79 100644
--- a/src/course-unit/move-modal/index.tsx
+++ b/src/course-unit/move-modal/index.tsx
@@ -50,7 +50,7 @@ const MoveModal: FC = ({
{ label: breadcrumb, 'data-parent-index': index }
))}
activeLabel={breadcrumbs[breadcrumbs.length - 1]}
- clickHandler={({ target }) => handleBreadcrumbsClick(target.dataset.parentIndex)}
+ clickHandler={({ currentTarget }) => handleBreadcrumbsClick(currentTarget.dataset.parentIndex)}
/>
), [isExtraSmall, breadcrumbs, handleBreadcrumbsClick]);