From 8f9987656c0f49be16c6ab241e7408b2faa7c90c Mon Sep 17 00:00:00 2001
From: Wouter Admiraal <wouter.admiraal@sonarsource.com>
Date: Thu, 18 Jul 2019 09:30:11 +0200
Subject: [PATCH] SONAR-12320 Don't use a badge for the analysis warning

---
 .../js/app/components/nav/component/ComponentNav.css  |  8 ++++++++
 .../components/nav/component/ComponentNavWarnings.tsx |  7 +++----
 .../__snapshots__/ComponentNavWarnings-test.tsx.snap  | 11 +++++------
 3 files changed, 16 insertions(+), 10 deletions(-)

diff --git a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css
index bb9e6e5925e..089be790d73 100644
--- a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css
+++ b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.css
@@ -33,6 +33,14 @@
   max-width: 650px;
 }
 
+.navbar-context-meta .alert {
+  margin-bottom: 0;
+}
+
+.navbar-context-meta .alert-content {
+  padding: 6px 8px;
+}
+
 .navbar-context-meta-branch-menu-title {
   padding-left: calc(3 * var(--gridSize));
 }
diff --git a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNavWarnings.tsx b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNavWarnings.tsx
index 08cdbbc097f..413cc1ed056 100644
--- a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNavWarnings.tsx
+++ b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNavWarnings.tsx
@@ -19,8 +19,8 @@
  */
 import * as React from 'react';
 import { FormattedMessage } from 'react-intl';
-import WarningIcon from 'sonar-ui-common/components/icons/WarningIcon';
 import { lazyLoad } from 'sonar-ui-common/components/lazyLoad';
+import { Alert } from 'sonar-ui-common/components/ui/Alert';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 
 const AnalysisWarningsModal = lazyLoad(() =>
@@ -51,8 +51,7 @@ export default class ComponentNavWarnings extends React.PureComponent<Props, Sta
   render() {
     return (
       <>
-        <div className="badge display-inline-flex-center js-component-analysis-warnings flex-1">
-          <WarningIcon className="spacer-right" />
+        <Alert className="js-component-analysis-warnings flex-1" display="inline" variant="warning">
           <FormattedMessage
             defaultMessage={translate('component_navigation.last_analysis_had_warnings')}
             id="component_navigation.last_analysis_had_warnings"
@@ -70,7 +69,7 @@ export default class ComponentNavWarnings extends React.PureComponent<Props, Sta
               )
             }}
           />
-        </div>
+        </Alert>
         {this.state.modal && (
           <AnalysisWarningsModal onClose={this.handleCloseModal} warnings={this.props.warnings} />
         )}
diff --git a/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNavWarnings-test.tsx.snap b/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNavWarnings-test.tsx.snap
index 5f49bd0b039..0a72b432624 100644
--- a/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNavWarnings-test.tsx.snap
+++ b/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNavWarnings-test.tsx.snap
@@ -2,12 +2,11 @@
 
 exports[`should render 1`] = `
 <Fragment>
-  <div
-    className="badge display-inline-flex-center js-component-analysis-warnings flex-1"
+  <Alert
+    className="js-component-analysis-warnings flex-1"
+    display="inline"
+    variant="warning"
   >
-    <WarningIcon
-      className="spacer-right"
-    />
     <FormattedMessage
       defaultMessage="component_navigation.last_analysis_had_warnings"
       id="component_navigation.last_analysis_had_warnings"
@@ -30,7 +29,7 @@ exports[`should render 1`] = `
         }
       }
     />
-  </div>
+  </Alert>
   <LazyLoader
     onClose={[Function]}
     warnings={
-- 
2.39.5