SONAR-13758 Add new code legend to Activity Chart

diff --git a/server/sonar-docs/package.json b/server/sonar-docs/package.json
index c0518493b8da32fd1bb705a608b0cdab6f24e7c8..d504b6cfcd990f94c6bd0cad9182f354c4d427e7 100644 (file)
--- a/server/sonar-docs/package.json
+++ b/server/sonar-docs/package.json
@@ -21,7 +21,7 @@
     "react-dom": "16.13.0",
     "react-helmet": "5.2.1",
     "react-typography": "0.16.19",
-    "sonar-ui-common": "1.0.20",
+    "sonar-ui-common": "1.0.22",
     "typography": "0.16.19"
   },
   "devDependencies": {

diff --git a/server/sonar-docs/yarn.lock b/server/sonar-docs/yarn.lock
index cc4ff77faaa97f4324e3bdbb041e7a4ae2939613..7b2495777d6a2ea76b09c9cc66bad221bcb7ec45 100644 (file)
--- a/server/sonar-docs/yarn.lock
+++ b/server/sonar-docs/yarn.lock
@@ -12736,10 +12736,10 @@ sockjs@0.3.19:
     faye-websocket "^0.10.0"
     uuid "^3.0.1"
 
-sonar-ui-common@1.0.20:
-  version "1.0.20"
-  resolved "https://repox.jfrog.io/repox/api/npm/npm/sonar-ui-common/-/sonar-ui-common-1.0.20.tgz#a52edc4f847b93dd7d0d0c686277f20ba3aaa234"
-  integrity sha1-pS7cT4R7k919DQxoYnfyC6OqojQ=
+sonar-ui-common@1.0.22:
+  version "1.0.22"
+  resolved "https://repox.jfrog.io/repox/api/npm/npm/sonar-ui-common/-/sonar-ui-common-1.0.22.tgz#938d5293eae683a7149bb0a05ac2e81f0e34f171"
+  integrity sha1-k41Sk+rmg6cUm7CgWsLoHw408XE=
   dependencies:
     "@types/react-select" "1.2.6"
     classnames "2.2.6"

diff --git a/server/sonar-web/package.json b/server/sonar-web/package.json
index e04e7ea9a9e373ab0fb7b854dc75120605e6e15a..d6c3076be7274930af645c9d1f8ff93f8eb0ffdd 100644 (file)
--- a/server/sonar-web/package.json
+++ b/server/sonar-web/package.json
@@ -38,7 +38,7 @@
     "rehype-slug": "3.0.0",
     "remark-custom-blocks": "2.5.0",
     "remark-rehype": "6.0.0",
-    "sonar-ui-common": "1.0.20",
+    "sonar-ui-common": "1.0.22",
     "unist-util-visit": "2.0.2",
     "valid-url": "1.0.9",
     "whatwg-fetch": "3.0.0"

diff --git a/server/sonar-web/src/main/js/components/activity-graph/GraphHistory.tsx b/server/sonar-web/src/main/js/components/activity-graph/GraphHistory.tsx
index 366cc3aac76ede2801cec7aeb9cc4a04775894e0..960d2cdc449d70f4d8e256e4d38dced2c4675c6d 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/GraphHistory.tsx
+++ b/server/sonar-web/src/main/js/components/activity-graph/GraphHistory.tsx
@@ -85,13 +85,9 @@ export default class GraphHistory extends React.PureComponent<Props, State> {
     return (
       <div className="activity-graph-container flex-grow display-flex-column display-flex-stretch display-flex-justify-center">
         {isCustom && this.props.removeCustomMetric ? (
-          <GraphsLegendCustom
-            removeMetric={this.props.removeCustomMetric}
-            series={series}
-            showLeakLegend={Boolean(leakPeriodDate)}
-          />
+          <GraphsLegendCustom removeMetric={this.props.removeCustomMetric} series={series} />
         ) : (
-          <GraphsLegendStatic series={series} showLeakLegend={Boolean(leakPeriodDate)} />
+          <GraphsLegendStatic series={series} />
         )}
 
         <div className="flex-1">
@@ -99,6 +95,7 @@ export default class GraphHistory extends React.PureComponent<Props, State> {
             {({ height, width }) => (
               <div>
                 <AdvancedTimeline
+                  displayNewCodeLegend={true}
                   endDate={graphEndDate}
                   formatYTick={this.formatValue}
                   height={height}

diff --git a/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendCustom.tsx b/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendCustom.tsx
index 0e120067944b114284a076cf36dd970079449d7d..111ad156727a4bcf263db203b140a91119eeeab7 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendCustom.tsx
+++ b/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendCustom.tsx
@@ -22,17 +22,15 @@ import Tooltip from 'sonar-ui-common/components/controls/Tooltip';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 import { Serie } from '../../types/project-activity';
 import GraphsLegendItem from './GraphsLegendItem';
-import GraphsLegendNewCode from './GraphsLegendNewCode';
 import { hasDataValues } from './utils';
 
 export interface GraphsLegendCustomProps {
   removeMetric: (metric: string) => void;
   series: Serie[];
-  showLeakLegend: boolean;
 }
 
 export default function GraphsLegendCustom(props: GraphsLegendCustomProps) {
-  const { series, showLeakLegend } = props;
+  const { series } = props;
   return (
     <div className="activity-graph-legends display-flex-center">
       <div className="flex-1">
@@ -63,8 +61,6 @@ export default function GraphsLegendCustom(props: GraphsLegendCustomProps) {
           );
         })}
       </div>
-
-      {showLeakLegend && <GraphsLegendNewCode />}
     </div>
   );
 }

diff --git a/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendStatic.tsx b/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendStatic.tsx
index 54349d2a99d39b56bd16a132e7fb83411e8cc8a1..5de340e510b07a5432b9e3e7569778ca5a4a6579 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendStatic.tsx
+++ b/server/sonar-web/src/main/js/components/activity-graph/GraphsLegendStatic.tsx
@@ -20,14 +20,12 @@
 import * as React from 'react';
 import { Serie } from '../../types/project-activity';
 import GraphsLegendItem from './GraphsLegendItem';
-import GraphsLegendNewCode from './GraphsLegendNewCode';
 
 export interface GraphsLegendStaticProps {
   series: Array<Pick<Serie, 'name' | 'translatedName'>>;
-  showLeakLegend: boolean;
 }
 
-export default function GraphsLegendStatic({ series, showLeakLegend }: GraphsLegendStaticProps) {
+export default function GraphsLegendStatic({ series }: GraphsLegendStaticProps) {
   return (
     <div className="activity-graph-legends">
       {series.map((serie, idx) => (
@@ -39,8 +37,6 @@ export default function GraphsLegendStatic({ series, showLeakLegend }: GraphsLeg
           name={serie.translatedName}
         />
       ))}
-
-      {showLeakLegend && <GraphsLegendNewCode />}
     </div>
   );
 }

diff --git a/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphHistory-test.tsx b/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphHistory-test.tsx
index 5d2849dbd154565b0528c567890b08c717c4f283..f9c6d9c6ac5f3e3ff40c00ddbe827133ca9e5aa4 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphHistory-test.tsx
+++ b/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphHistory-test.tsx
@@ -36,21 +36,27 @@ const SERIES = [
   }
 ];
 
-const DEFAULT_PROPS: GraphHistory['props'] = {
-  events: [],
-  graph: DEFAULT_GRAPH,
-  leakPeriodDate: parseDate('2017-05-16T13:50:02+0200'),
-  isCustom: false,
-  measuresHistory: [],
-  metricsType: 'INT',
-  removeCustomMetric: () => {},
-  showAreas: true,
-  series: SERIES,
-  updateGraphZoom: () => {},
-  updateSelectedDate: () => {},
-  updateTooltip: () => {}
-};
-
 it('should correctly render a graph', () => {
-  expect(shallow(<GraphHistory {...DEFAULT_PROPS} />)).toMatchSnapshot();
+  expect(shallowRender()).toMatchSnapshot();
+  expect(shallowRender({ isCustom: true })).toMatchSnapshot('custom');
 });
+
+function shallowRender(overrides: Partial<GraphHistory['props']> = {}) {
+  return shallow(
+    <GraphHistory
+      events={[]}
+      graph={DEFAULT_GRAPH}
+      leakPeriodDate={parseDate('2017-05-16T13:50:02+0200')}
+      isCustom={false}
+      measuresHistory={[]}
+      metricsType="INT"
+      removeCustomMetric={jest.fn()}
+      showAreas={true}
+      series={SERIES}
+      updateGraphZoom={jest.fn()}
+      updateSelectedDate={jest.fn()}
+      updateTooltip={jest.fn()}
+      {...overrides}
+    />
+  );
+}

diff --git a/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphsLegendCustom-test.tsx b/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphsLegendCustom-test.tsx
index 9d437a7a0f1b10d5f514f895d5edfe6fc19ad708..c925e3cd06f80cb4cb888220ed86e915a0bc00f1 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphsLegendCustom-test.tsx
+++ b/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphsLegendCustom-test.tsx
@@ -24,7 +24,6 @@ import GraphsLegendCustom, { GraphsLegendCustomProps } from '../GraphsLegendCust
 
 it('should render correctly', () => {
   expect(shallowRender()).toMatchSnapshot('default');
-  expect(shallowRender({ showLeakLegend: true })).toMatchSnapshot('with leak legend');
 });
 
 function shallowRender(props: Partial<GraphsLegendCustomProps> = {}) {
@@ -51,7 +50,6 @@ function shallowRender(props: Partial<GraphsLegendCustomProps> = {}) {
           type: 'INT'
         }
       ]}
-      showLeakLegend={false}
       {...props}
     />
   );

diff --git a/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphsLegendStatic-test.tsx b/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphsLegendStatic-test.tsx
index 4fa8d55ed7a1b0c27ab5184553943cce586961ae..d7307a5b8dd54201582fde4edf754b9056d9239b 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphsLegendStatic-test.tsx
+++ b/server/sonar-web/src/main/js/components/activity-graph/__tests__/GraphsLegendStatic-test.tsx
@@ -23,7 +23,6 @@ import GraphsLegendStatic, { GraphsLegendStaticProps } from '../GraphsLegendStat
 
 it('should render correctly', () => {
   expect(shallowRender()).toMatchSnapshot('default');
-  expect(shallowRender({ showLeakLegend: true })).toMatchSnapshot('with leak legend');
 });
 
 function shallowRender(props: Partial<GraphsLegendStaticProps> = {}) {
@@ -33,7 +32,6 @@ function shallowRender(props: Partial<GraphsLegendStaticProps> = {}) {
         { name: 'bugs', translatedName: 'Bugs' },
         { name: 'code_smells', translatedName: 'Code Smells' }
       ]}
-      showLeakLegend={false}
       {...props}
     />
   );

diff --git a/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphHistory-test.tsx.snap b/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphHistory-test.tsx.snap
index d3f064bbe89abe49cf0bfa6e0f01479f7e2ae975..bcab20a45b04294fe4f96f136ed6d461985d967f 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphHistory-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphHistory-test.tsx.snap
@@ -28,7 +28,46 @@ exports[`should correctly render a graph 1`] = `
         },
       ]
     }
-    showLeakLegend={true}
+  />
+  <div
+    className="flex-1"
+  >
+    <AutoSizer>
+      <Component />
+    </AutoSizer>
+  </div>
+</div>
+`;
+
+exports[`should correctly render a graph: custom 1`] = `
+<div
+  className="activity-graph-container flex-grow display-flex-column display-flex-stretch display-flex-justify-center"
+>
+  <GraphsLegendCustom
+    removeMetric={[MockFunction]}
+    series={
+      Array [
+        Object {
+          "data": Array [
+            Object {
+              "x": 2016-10-27T14:33:50.000Z,
+              "y": 5,
+            },
+            Object {
+              "x": 2016-10-27T10:21:15.000Z,
+              "y": 16,
+            },
+            Object {
+              "x": 2016-10-26T10:17:29.000Z,
+              "y": 12,
+            },
+          ],
+          "name": "bugs",
+          "translatedName": "metric.bugs.name",
+          "type": "INT",
+        },
+      ]
+    }
   />
   <div
     className="flex-1"

diff --git a/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendCustom-test.tsx.snap b/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendCustom-test.tsx.snap
index 35be613cd2d75803156f96492cf0a0befde2f1ce..c5adae3bb3e8fb2a6f21d3017d75e6178bd6980e 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendCustom-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendCustom-test.tsx.snap
@@ -99,6 +99,5 @@ exports[`should render correctly: with leak legend 1`] = `
       </span>
     </Tooltip>
   </div>
-  <GraphsLegendNewCode />
 </div>
 `;

diff --git a/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendStatic-test.tsx.snap b/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendStatic-test.tsx.snap
index cb0be89ef40af3dc0b43045e7c4854aebc8c37b8..7560341297e19305ae245fdc6fe68bdbd8a27a98 100644 (file)
--- a/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendStatic-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/activity-graph/__tests__/__snapshots__/GraphsLegendStatic-test.tsx.snap
@@ -39,6 +39,5 @@ exports[`should render correctly: with leak legend 1`] = `
     metric="code_smells"
     name="Code Smells"
   />
-  <GraphsLegendNewCode />
 </div>
 `;

diff --git a/server/sonar-web/yarn.lock b/server/sonar-web/yarn.lock
index ab8fe123f4afcfdbe26bb4ad3c84ace9fd53972d..a86f53247a6e2de94c42aa821dc49728771310bd 100644 (file)
--- a/server/sonar-web/yarn.lock
+++ b/server/sonar-web/yarn.lock
@@ -10765,10 +10765,10 @@ sockjs@0.3.19:
     faye-websocket "^0.10.0"
     uuid "^3.0.1"
 
-sonar-ui-common@1.0.20:
-  version "1.0.20"
-  resolved "https://repox.jfrog.io/repox/api/npm/npm/sonar-ui-common/-/sonar-ui-common-1.0.20.tgz#a52edc4f847b93dd7d0d0c686277f20ba3aaa234"
-  integrity sha1-pS7cT4R7k919DQxoYnfyC6OqojQ=
+sonar-ui-common@1.0.22:
+  version "1.0.22"
+  resolved "https://repox.jfrog.io/repox/api/npm/npm/sonar-ui-common/-/sonar-ui-common-1.0.22.tgz#938d5293eae683a7149bb0a05ac2e81f0e34f171"
+  integrity sha1-k41Sk+rmg6cUm7CgWsLoHw408XE=
   dependencies:
     "@types/react-select" "1.2.6"
     classnames "2.2.6"