diff --git a/src/elements/BreadcrumbsDropdown/BreadcrumbsDropdown.js b/src/elements/BreadcrumbsDropdown/BreadcrumbsDropdown.js
index c5c92fa9b..bf321d239 100644
--- a/src/elements/BreadcrumbsDropdown/BreadcrumbsDropdown.js
+++ b/src/elements/BreadcrumbsDropdown/BreadcrumbsDropdown.js
@@ -64,10 +64,11 @@ const BreadcrumbsDropdown = forwardRef(
listItem.id.toLocaleLowerCase().startsWith(searchValue.toLocaleLowerCase())
)
.map(listItem => {
+ const isItemSelected = selectedItem === listItem.id
const dropdownItemClassNames = classnames(
'breadcrumbs__dropdown-item',
'data-ellipsis',
- selectedItem === listItem.id && 'breadcrumbs__dropdown-item_selected'
+ isItemSelected && 'breadcrumbs__dropdown-item_selected'
)
return (
@@ -81,7 +82,7 @@ const BreadcrumbsDropdown = forwardRef(
className={dropdownItemClassNames}
>
{listItem.label}
- {selectedItem === listItem.id && }
+ {isItemSelected && }
) : (
{
+ isItemSelected ? event.preventDefault() : onClick(event)
+ }}
id={listItem.id}
data-testid={`breadcrumbs-dropdown-item-${listItem.id}`}
key={listItem.id}
@@ -98,7 +101,7 @@ const BreadcrumbsDropdown = forwardRef(
}>
{listItem.label}
- {selectedItem === listItem.id && }
+ {isItemSelected && }
))
)
diff --git a/src/elements/BreadcrumbsDropdown/breadcrumbsDropdown.scss b/src/elements/BreadcrumbsDropdown/breadcrumbsDropdown.scss
index 15a0c8d6e..962d2ece3 100644
--- a/src/elements/BreadcrumbsDropdown/breadcrumbsDropdown.scss
+++ b/src/elements/BreadcrumbsDropdown/breadcrumbsDropdown.scss
@@ -35,6 +35,11 @@
&_selected {
font-weight: bold;
+
+ &:hover {
+ cursor: default;
+ background: white;
+ }
}
.checkmark {