SONAR-10087 SONAR-10113 Display built-in badges on quality gates

server/sonar-web/src/main/js/api/quality-gates.ts

@@ -25,6 +25,7 @@ export function fetchQualityGatesAppDetails(): Promise<any> {
 }
 
 export interface QualityGate {
+  isBuiltIn?: boolean;
   isDefault?: boolean;
   id: number;
   name: string;

server/sonar-web/src/main/js/apps/quality-gates/components/BuiltInBadge.tsx

@@ -0,0 +1,45 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import * as React from 'react';
+import * as classNames from 'classnames';
+import Tooltip from '../../../components/controls/Tooltip';
+import { translate } from '../../../helpers/l10n';
+
+interface Props {
+  className?: string;
+  tooltip?: boolean;
+}
+
+export default function BuiltInBadge({ className, tooltip = true }: Props) {
+  const badge = (
+    <div className={classNames('outline-badge', className)}>
+      {translate('quality_gates.built_in')}
+    </div>
+  );
+
+  const overlay = (
+    <div>
+      <p>{translate('quality_gates.built_in.description.1')}</p>
+      <p>{translate('quality_gates.built_in.description.2')}</p>
+    </div>
+  );
+
+  return tooltip ? <Tooltip overlay={overlay}>{badge}</Tooltip> : badge;
+}

server/sonar-web/src/main/js/apps/quality-gates/components/DetailsHeader.js

@@ -18,6 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import React from 'react';
+import BuiltInBadge from './BuiltInBadge';
 import { translate } from '../../../helpers/l10n';
 
 export default class DetailsHeader extends React.PureComponent {
@@ -48,7 +49,10 @@ export default class DetailsHeader extends React.PureComponent {
       <div className="layout-page-header-panel layout-page-main-header issues-main-header">
         <div className="layout-page-header-panel-inner layout-page-main-header-inner">
           <div className="layout-page-main-inner">
-            <h2 className="pull-left">{qualityGate.name}</h2>
+            <h2 className="pull-left">
+              {qualityGate.name}
+              {qualityGate.isBuiltIn && <BuiltInBadge className="spacer-left" tooltip={true} />}
+            </h2>
             {edit && (
               <div className="pull-right">
                 <button id="quality-gate-rename" onClick={this.handleRenameClick}>

server/sonar-web/src/main/js/apps/quality-gates/components/List.js

@@ -19,6 +19,7 @@
  */
 import React from 'react';
 import { Link } from 'react-router';
+import BuiltInBadge from './BuiltInBadge';
 import { translate } from '../../../helpers/l10n';
 import { getQualityGateUrl } from '../../../helpers/urls';
 
@@ -35,10 +36,13 @@ export default function List({ organization, qualityGates }) {
           <table>
             <tbody>
               <tr>
-                <td className="text-top">{qualityGate.name}</td>
-                <td className="text-top thin nowrap spacer-left">
+                <td>{qualityGate.name}</td>
+                <td className="thin nowrap spacer-left text-right">
                   {qualityGate.isDefault && (
-                    <span className="badge pull-right">{translate('default')}</span>
+                    <span className="text-middle badge">{translate('default')}</span>
+                  )}
+                  {qualityGate.isBuiltIn && (
+                    <BuiltInBadge className="little-spacer-left" tooltip={false} />
                   )}
                 </td>
               </tr>

sonar-core/src/main/resources/org/sonar/l10n/core.properties

@@ -1158,6 +1158,10 @@ quality_gates.conditions.error=Error
 quality_gates.duplicated_conditions=This quality gate has duplicated conditions:
 quality_gates.intro.1=Quality Gate is the set of conditions the project must meet before it can be released into production.
 quality_gates.intro.2=It is possible to set a default Quality Gate, which will be applied to all projects not explicitly assigned to some other gate.
+quality_gates.built_in=Built-in
+quality_gates.built_in.description.1=This quality gate is provided by default.
+quality_gates.built_in.description.2=It will automatically be updated with the latest recommendations.
+
 
 #------------------------------------------------------------------------------
 #