SONAR-20500 Validation fixes for rules page

5 files changed, 15 insertions, 2 deletions

diff --git a/server/sonar-web/src/main/js/apps/coding-rules/components/AvailableSinceFacet.tsx b/server/sonar-web/src/main/js/apps/coding-rules/components/AvailableSinceFacet.tsx
index 7217043df42..9cd0a388148 100644
--- a/server/sonar-web/src/main/js/apps/coding-rules/components/AvailableSinceFacet.tsx
+++ b/server/sonar-web/src/main/js/apps/coding-rules/components/AvailableSinceFacet.tsx
@@ -72,6 +72,7 @@ class AvailableSinceFacet extends React.PureComponent<Props & WrappedComponentPr
             value={value}
             showClearButton
             alignRight
+            size="auto"
           />
         )}
       </FacetBox>
diff --git a/server/sonar-web/src/main/js/apps/coding-rules/components/BulkChange.tsx b/server/sonar-web/src/main/js/apps/coding-rules/components/BulkChange.tsx
index 0dde26c5ffb..d3cfbceceae 100644
--- a/server/sonar-web/src/main/js/apps/coding-rules/components/BulkChange.tsx
+++ b/server/sonar-web/src/main/js/apps/coding-rules/components/BulkChange.tsx
@@ -100,6 +100,7 @@ export default class BulkChange extends React.PureComponent<Props, State> {
           size="auto"
           placement={PopupPlacement.BottomRight}
           zLevel={PopupZLevel.Global}
+          allowResizing
           overlay={
             <>
               <ItemButton onClick={this.handleActivateClick}>
diff --git a/server/sonar-web/src/main/js/apps/coding-rules/components/Facet.tsx b/server/sonar-web/src/main/js/apps/coding-rules/components/Facet.tsx
index ec3ab6989bb..6948418aa20 100644
--- a/server/sonar-web/src/main/js/apps/coding-rules/components/Facet.tsx
+++ b/server/sonar-web/src/main/js/apps/coding-rules/components/Facet.tsx
@@ -27,6 +27,7 @@ import { formatMeasure } from '../../../helpers/measures';
 import { MetricType } from '../../../types/metrics';
 import { Dict } from '../../../types/types';
 import { FacetItemsList } from '../../issues/sidebar/FacetItemsList';
+import { MultipleSelectionHint } from '../../issues/sidebar/MultipleSelectionHint';
 import { FacetKey } from '../query';
 
 export interface BasicProps {
@@ -111,6 +112,9 @@ export default class Facet extends React.PureComponent<Props> {
           (key) => renderTextName(key).toLowerCase(),
         ));
     const headerId = `facet_${property}`;
+    const nbSelectableItems =
+      items?.filter((item) => (stats ? stats[item] : undefined)).length ?? 0;
+    const nbSelectedItems = values.length;
 
     return (
       <FacetBox
@@ -135,6 +139,11 @@ export default class Facet extends React.PureComponent<Props> {
         )}
 
         {open && this.props.renderFooter !== undefined && this.props.renderFooter()}
+
+        <MultipleSelectionHint
+          nbSelectableItems={nbSelectableItems}
+          nbSelectedItems={nbSelectedItems}
+        />
       </FacetBox>
     );
   }
diff --git a/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetails.tsx b/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetails.tsx
index 49ca07211b6..ab5b9630624 100644
--- a/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetails.tsx
+++ b/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetails.tsx
@@ -22,6 +22,7 @@ import {
   ButtonSecondary,
   DangerButtonSecondary,
   HelperHintIcon,
+  Spinner,
   SubHeadingHighlight,
   themeBorder,
   themeColor,
@@ -32,7 +33,6 @@ import { deleteRule, getRuleDetails, updateRule } from '../../../api/rules';
 import ConfirmButton from '../../../components/controls/ConfirmButton';
 import HelpTooltip from '../../../components/controls/HelpTooltip';
 import DateFormatter from '../../../components/intl/DateFormatter';
-import Spinner from '../../../components/ui/Spinner';
 import { translate, translateWithParameters } from '../../../helpers/l10n';
 import { Dict, RuleActivation, RuleDetails as TypeRuleDetails } from '../../../types/types';
 import { Activation } from '../query';
diff --git a/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsCustomRules.tsx b/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsCustomRules.tsx
index d104dd1514b..5a87734539c 100644
--- a/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsCustomRules.tsx
+++ b/server/sonar-web/src/main/js/apps/coding-rules/components/RuleDetailsCustomRules.tsx
@@ -111,7 +111,9 @@ export default class RuleDetailsCustomRules extends React.PureComponent<Props, S
   renderRule = (rule: Rule) => (
     <TableRow data-rule={rule.key} key={rule.key}>
       <ContentCell>
-        <Link to={getRuleUrl(rule.key)}>{rule.name}</Link>
+        <div>
+          <Link to={getRuleUrl(rule.key)}>{rule.name}</Link>
+        </div>
       </ContentCell>
 
       <ContentCell>