From 2549a33517216e6b0d15fe8b66db7b0f0d953231 Mon Sep 17 00:00:00 2001
From: stanislavh <stanislav.honcharov@sonarsource.com>
Date: Fri, 10 Feb 2023 12:20:50 +0100
Subject: [PATCH] SONAR-18130 Breadcrumb region is missing appropriate roles
 and/or attributes

---
 .../src/main/js/app/styles/init/lists.css     |  9 +++++++++
 .../details/ProfileHeader.tsx                 | 19 ++++++++++++-------
 .../resources/org/sonar/l10n/core.properties  |  1 +
 3 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/server/sonar-web/src/main/js/app/styles/init/lists.css b/server/sonar-web/src/main/js/app/styles/init/lists.css
index b61d1d68adb..a6bea0b85bb 100644
--- a/server/sonar-web/src/main/js/app/styles/init/lists.css
+++ b/server/sonar-web/src/main/js/app/styles/init/lists.css
@@ -46,6 +46,15 @@ ol.list-styled {
   list-style: none;
 }
 
+.list-breadcrumbs > li {
+  display: inline-block;
+}
+
+.list-breadcrumbs > li:not(:first-of-type)::before {
+  content: '/' / '';
+  margin-inline: 3px;
+}
+
 ul.list-inline > li,
 div.list-inline > div {
   display: inline-block;
diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.tsx b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.tsx
index c02116e3877..b128ae8bdd8 100644
--- a/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileHeader.tsx
@@ -65,13 +65,18 @@ export default function ProfileHeader(props: Props) {
           )}
         />
       )}
-      <div className="note spacer-bottom">
-        <NavLink end={true} to={PROFILE_PATH}>
-          {translate('quality_profiles.page')}
-        </NavLink>
-        {' / '}
-        <Link to={getProfilesForLanguagePath(profile.language)}>{profile.languageName}</Link>
-      </div>
+      <nav className="note spacer-bottom" aria-label={translate('breadcrumbs')}>
+        <ul className="list-breadcrumbs">
+          <li>
+            <NavLink end={true} to={PROFILE_PATH}>
+              {translate('quality_profiles.page')}
+            </NavLink>
+          </li>
+          <li>
+            <Link to={getProfilesForLanguagePath(profile.language)}>{profile.languageName}</Link>
+          </li>
+        </ul>
+      </nav>
 
       <h1 className="page-title">
         <ProfileLink language={profile.language} name={profile.name}>
diff --git a/sonar-core/src/main/resources/org/sonar/l10n/core.properties b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
index e212d87eba0..9ff58aa9d78 100644
--- a/sonar-core/src/main/resources/org/sonar/l10n/core.properties
+++ b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
@@ -29,6 +29,7 @@ beta=BETA
 blocker=Blocker
 bold=Bold
 branch=Branch
+breadcrumbs=Breadcrumbs
 by_=by
 calendar=Calendar
 cancel=Cancel
-- 
2.39.5