SONAR-20023 Add severity icons to new facet

2 files changed, 5 insertions, 0 deletions

diff --git a/server/sonar-web/src/main/js/apps/issues/sidebar/SeverityFacet.tsx b/server/sonar-web/src/main/js/apps/issues/sidebar/SeverityFacet.tsx
index 4d0329681a6..cf878fcdb9f 100644
--- a/server/sonar-web/src/main/js/apps/issues/sidebar/SeverityFacet.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/sidebar/SeverityFacet.tsx
@@ -20,6 +20,7 @@
 
 import * as React from 'react';
 import DocumentationTooltip from '../../../components/common/DocumentationTooltip';
+import SoftwareImpactSeverityIcon from '../../../components/icons/SoftwareImpactSeverityIcon';
 import { translate } from '../../../helpers/l10n';
 import { SoftwareImpactSeverity } from '../../../types/issues';
 import { CommonProps, SimpleListStyleFacet } from './SimpleListStyleFacet';
@@ -39,6 +40,7 @@ export function SeverityFacet(props: Props) {
       itemNamePrefix="severity"
       listItems={SEVERITIES}
       selectedItems={severities}
+      renderIcon={(severity: string) => <SoftwareImpactSeverityIcon severity={severity} />}
       help={
         <DocumentationTooltip
           placement="right"
diff --git a/server/sonar-web/src/main/js/apps/issues/sidebar/SimpleListStyleFacet.tsx b/server/sonar-web/src/main/js/apps/issues/sidebar/SimpleListStyleFacet.tsx
index c52151e6722..a5e90825876 100644
--- a/server/sonar-web/src/main/js/apps/issues/sidebar/SimpleListStyleFacet.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/sidebar/SimpleListStyleFacet.tsx
@@ -42,6 +42,7 @@ interface Props<T = string> extends CommonProps {
   listItems: Array<T>;
   itemNamePrefix: string;
   selectedItems: Array<T>;
+  renderIcon?: (item: string) => React.ReactNode;
 }
 
 export function SimpleListStyleFacet(props: Props) {
@@ -55,6 +56,7 @@ export function SimpleListStyleFacet(props: Props) {
     listItems,
     itemNamePrefix,
     help,
+    renderIcon,
   } = props;
 
   const nbSelectableItems = listItems.filter((item) => stats[item]).length;
@@ -86,6 +88,7 @@ export function SimpleListStyleFacet(props: Props) {
               active={active}
               className="it__search-navigator-facet"
               key={item}
+              icon={renderIcon?.(item)}
               name={translate(itemNamePrefix, item)}
               onClick={(itemValue, multiple) => {
                 if (multiple) {