SONAR-9418 Add analysis events on project activity graph tooltips

diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltips.js b/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltips.js
index eda9919fcaee62d8944dec1624fc7b02ee45828b..6162767369a4b37f3c422d96042d85431c1e4d39 100644 (file)
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltips.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltips.js
@@ -22,13 +22,15 @@ import React from 'react';
 import BubblePopup from '../../../components/common/BubblePopup';
 import FormattedDate from '../../../components/ui/FormattedDate';
 import GraphsTooltipsContent from './GraphsTooltipsContent';
+import GraphsTooltipsContentEvents from './GraphsTooltipsContentEvents';
 import GraphsTooltipsContentCoverage from './GraphsTooltipsContentCoverage';
 import GraphsTooltipsContentDuplication from './GraphsTooltipsContentDuplication';
 import GraphsTooltipsContentOverview from './GraphsTooltipsContentOverview';
-import type { MeasureHistory } from '../types';
+import type { Event, MeasureHistory } from '../types';
 import type { Serie } from '../../../components/charts/AdvancedTimeline';
 
 type Props = {
+  events: Array<Event>,
   formatValue: (number | string) => string,
   graph: string,
   graphWidth: number,
@@ -45,7 +47,7 @@ export default class GraphsTooltips extends React.PureComponent {
   props: Props;
 
   render() {
-    const { measuresHistory, tooltipIdx } = this.props;
+    const { events, measuresHistory, tooltipIdx } = this.props;
     const top = 50;
     let left = this.props.tooltipPos + 60;
     let customClass;
@@ -91,6 +93,7 @@ export default class GraphsTooltips extends React.PureComponent {
                 measuresHistory={measuresHistory}
                 tooltipIdx={tooltipIdx}
               />}
+            {events && events.length > 0 && <GraphsTooltipsContentEvents events={events} />}
           </table>
         </div>
       </BubblePopup>

diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltipsContentEvents.js b/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltipsContentEvents.js
new file mode 100644 (file)
index 0000000..589d607
--- /dev/null
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/GraphsTooltipsContentEvents.js
@@ -0,0 +1,47 @@
+/*
+ * 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.
+ */
+// @flow
+import React from 'react';
+import ProjectEventIcon from '../../../components/icons-components/ProjectEventIcon';
+import { translate } from '../../../helpers/l10n';
+import type { Event } from '../types';
+
+type Props = {
+  events: Array<Event>
+};
+
+export default function GraphsTooltipsContentEvents({ events }: Props) {
+  return (
+    <tbody>
+      <tr><td className="project-activity-graph-tooltip-separator" colSpan="3"><hr /></td></tr>
+      {events.map(event => (
+        <tr key={event.key} className="project-activity-graph-tooltip-line">
+          <td className="spacer-right thin">
+            <ProjectEventIcon className={'project-activity-event-icon ' + event.category} />
+          </td>
+          <td colSpan="2">
+            <span>{translate('event.category', event.category)}:</span>
+            {' '} {event.name}
+          </td>
+        </tr>
+      ))}
+    </tbody>
+  );
+}

diff --git a/server/sonar-web/src/main/js/apps/projectActivity/components/StaticGraphs.js b/server/sonar-web/src/main/js/apps/projectActivity/components/StaticGraphs.js
index d07737c8d02c30e3e4183d26d49456d063aba746..7209c9ee15b213239023bb3616271111a3289fdd 100644 (file)
--- a/server/sonar-web/src/main/js/apps/projectActivity/components/StaticGraphs.js
+++ b/server/sonar-web/src/main/js/apps/projectActivity/components/StaticGraphs.js
@@ -85,6 +85,20 @@ export default class StaticGraphs extends React.PureComponent {
     return sortBy(filteredEvents, 'date');
   };
 
+  getSelectedDateEvents = () => {
+    const { selectedDate } = this.state;
+    const { analyses } = this.props;
+    if (analyses && selectedDate) {
+      const analysis = analyses.find(
+        analysis => analysis.date.valueOf() === selectedDate.valueOf()
+      );
+      if (analysis) {
+        return analysis.events;
+      }
+    }
+    return [];
+  };
+
   hasSeriesData = () => some(this.props.series, serie => serie.data && serie.data.length > 2);
 
   updateTooltip = (selectedDate: ?Date, tooltipXPos: ?number, tooltipIdx: ?number) =>
@@ -123,7 +137,6 @@ export default class StaticGraphs extends React.PureComponent {
               <div>
                 <AdvancedTimeline
                   endDate={this.props.graphEndDate}
-                  events={this.getEvents()}
                   height={height}
                   width={width}
                   interpolate="linear"
@@ -141,6 +154,7 @@ export default class StaticGraphs extends React.PureComponent {
                 {selectedDate != null &&
                   tooltipXPos != null &&
                   <GraphsTooltips
+                    events={this.getSelectedDateEvents()}
                     formatValue={this.formatValue}
                     graph={graph}
                     graphWidth={width}