SONAR-12942 Security hostpot category are not displayed properly with long category...

diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotCategory.tsx b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotCategory.tsx
index 21ce4025421c2238df3ee54af6861b9829b06ec5..e78ac19127293a9ca5863c05767dc5dc2d52656c 100644 (file)
--- a/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotCategory.tsx
+++ b/server/sonar-web/src/main/js/apps/security-hotspots/components/HotspotCategory.tsx
@@ -53,7 +53,7 @@ export default function HotspotCategory(props: HotspotCategoryProps) {
         )}
         href="#"
         onClick={() => props.onToggleExpand(categoryKey, !expanded)}>
-        <strong className="flex-1">{title}</strong>
+        <strong className="flex-1 spacer-right break-word">{title}</strong>
         <span>
           <span className="counter-badge">
             {hotspots.length}

diff --git a/server/sonar-web/src/main/js/apps/security-hotspots/components/__tests__/__snapshots__/HotspotCategory-test.tsx.snap b/server/sonar-web/src/main/js/apps/security-hotspots/components/__tests__/__snapshots__/HotspotCategory-test.tsx.snap
index c8520210c7e2f6a88df285c7827ef531bdad2e46..cd2664c3ad4c00a0d093f3470ae46f3d2eb450f0 100644 (file)
--- a/server/sonar-web/src/main/js/apps/security-hotspots/components/__tests__/__snapshots__/HotspotCategory-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/security-hotspots/components/__tests__/__snapshots__/HotspotCategory-test.tsx.snap
@@ -10,7 +10,7 @@ exports[`should render correctly with hotspots 1`] = `
     onClick={[Function]}
   >
     <strong
-      className="flex-1"
+      className="flex-1 spacer-right break-word"
     >
       Class Injection
     </strong>
@@ -92,7 +92,7 @@ exports[`should render correctly with hotspots: collapsed 1`] = `
     onClick={[Function]}
   >
     <strong
-      className="flex-1"
+      className="flex-1 spacer-right break-word"
     >
       Class Injection
     </strong>
@@ -120,7 +120,7 @@ exports[`should render correctly with hotspots: contains selected 1`] = `
     onClick={[Function]}
   >
     <strong
-      className="flex-1"
+      className="flex-1 spacer-right break-word"
     >
       Class Injection
     </strong>
@@ -202,7 +202,7 @@ exports[`should render correctly with hotspots: lastAndIncomplete 1`] = `
     onClick={[Function]}
   >
     <strong
-      className="flex-1"
+      className="flex-1 spacer-right break-word"
     >
       Class Injection
     </strong>