SONAR-9285 More precise page titles

7 files changed, 33 insertions, 14 deletions

diff --git a/server/sonar-web/src/main/js/apps/code/components/App.tsx b/server/sonar-web/src/main/js/apps/code/components/App.tsx
index 937a66ee751..3c9ebfc25f4 100644
--- a/server/sonar-web/src/main/js/apps/code/components/App.tsx
+++ b/server/sonar-web/src/main/js/apps/code/components/App.tsx
@@ -198,7 +198,7 @@ export default class App extends React.PureComponent<Props, State> {
 
     return (
       <div className="page page-limited">
-        <Helmet title={translate('code.page')} />
+        <Helmet title={sourceViewer !== undefined ? sourceViewer.name : translate('code.page')} />
 
         {error && <div className="alert alert-danger">{error}</div>}
 
diff --git a/server/sonar-web/src/main/js/apps/component-measures/components/App.js b/server/sonar-web/src/main/js/apps/component-measures/components/App.js
index b03d79fcaae..b18f85ca24f 100644
--- a/server/sonar-web/src/main/js/apps/component-measures/components/App.js
+++ b/server/sonar-web/src/main/js/apps/component-measures/components/App.js
@@ -25,9 +25,13 @@ import MeasureContentContainer from './MeasureContentContainer';
 import MeasureOverviewContainer from './MeasureOverviewContainer';
 import Sidebar from '../sidebar/Sidebar';
 import ScreenPositionHelper from '../../../components/common/ScreenPositionHelper';
-import { hasBubbleChart, parseQuery, serializeQuery } from '../utils';
+import { isProjectOverview, hasBubbleChart, parseQuery, serializeQuery } from '../utils';
 import { isSameBranchLike, getBranchLikeQuery } from '../../../helpers/branches';
-import { translate } from '../../../helpers/l10n';
+import {
+  getLocalizedMetricDomain,
+  translateWithParameters,
+  translate
+} from '../../../helpers/l10n';
 import { getDisplayMetrics } from '../../../helpers/measures';
 /*:: import type { Component, Query, Period } from '../types'; */
 /*:: import type { RawQuery } from '../../../helpers/query'; */
@@ -147,6 +151,21 @@ export default class App extends React.PureComponent {
     });
   };
 
+  getHelmetTitle = (
+    metric /*: Metric */,
+    query /*: {metric: string, selected: string, view: string }*/
+  ) => {
+    if (metric == null && hasBubbleChart(query.metric)) {
+      return isProjectOverview(query.metric)
+        ? translate('component_measures.overview.project_overview.facet')
+        : translateWithParameters(
+            'component_measures.domain_x_overview',
+            getLocalizedMetricDomain(query.metric)
+          );
+    }
+    return metric != null ? metric.name : translate('layout.measures');
+  };
+
   render() {
     const isLoading = this.state.loading || this.props.metricsKey.length <= 0;
     if (isLoading) {
@@ -158,7 +177,7 @@ export default class App extends React.PureComponent {
     const metric = metrics[query.metric];
     return (
       <div className="layout-page" id="component-measures">
-        <Helmet title={translate('layout.measures')} />
+        <Helmet title={this.getHelmetTitle(metric, query)} />
 
         <ScreenPositionHelper className="layout-page-side-outer">
           {({ top }) => (
@@ -181,11 +200,11 @@ export default class App extends React.PureComponent {
             branchLike={branchLike}
             className="layout-page-main"
             currentUser={this.props.currentUser}
-            rootComponent={component}
             fetchMeasures={fetchMeasures}
             leakPeriod={leakPeriod}
             metric={metric}
             metrics={metrics}
+            rootComponent={component}
             router={this.props.router}
             selected={query.selected}
             updateQuery={this.updateQuery}
@@ -197,11 +216,11 @@ export default class App extends React.PureComponent {
             <MeasureOverviewContainer
               branchLike={branchLike}
               className="layout-page-main"
-              rootComponent={component}
               currentUser={this.props.currentUser}
               domain={query.metric}
               leakPeriod={leakPeriod}
               metrics={metrics}
+              rootComponent={component}
               router={this.props.router}
               selected={query.selected}
               updateQuery={this.updateQuery}
diff --git a/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverview.js b/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverview.js
index 0128f7b8b1f..77cb425f7a9 100644
--- a/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverview.js
+++ b/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverview.js
@@ -156,14 +156,14 @@ export default class MeasureOverview extends React.PureComponent {
               {component.key !== rootComponent.key &&
                 isLoggedIn && (
                   <MeasureFavoriteContainer
-                    component={component.key}
                     className="measure-favorite spacer-right"
+                    component={component.key}
                   />
                 )}
               <PageActions
                 current={this.state.components.length}
-                loading={this.props.loading}
                 isFile={isFile}
+                loading={this.props.loading}
                 paging={this.state.paging}
               />
             </div>
diff --git a/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverviewContainer.js b/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverviewContainer.js
index b69a9a8378f..141cb9839db 100644
--- a/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverviewContainer.js
+++ b/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverviewContainer.js
@@ -128,8 +128,8 @@ export default class MeasureOverviewContainer extends React.PureComponent {
         component={this.state.component}
         currentUser={this.props.currentUser}
         domain={this.props.domain}
-        loading={this.state.loading.component || this.state.loading.bubbles}
         leakPeriod={this.props.leakPeriod}
+        loading={this.state.loading.component || this.state.loading.bubbles}
         metrics={this.props.metrics}
         rootComponent={this.props.rootComponent}
         updateLoading={this.updateLoading}
diff --git a/server/sonar-web/src/main/js/apps/component-measures/components/__tests__/__snapshots__/App-test.js.snap b/server/sonar-web/src/main/js/apps/component-measures/components/__tests__/__snapshots__/App-test.js.snap
index 0477a149877..a5a8537c675 100644
--- a/server/sonar-web/src/main/js/apps/component-measures/components/__tests__/__snapshots__/App-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/component-measures/components/__tests__/__snapshots__/App-test.js.snap
@@ -8,7 +8,7 @@ exports[`should render correctly 1`] = `
   <HelmetWrapper
     defer={true}
     encodeSpecialCharacters={true}
-    title="layout.measures"
+    title="Coverage"
   />
   <ScreenPositionHelper
     className="layout-page-side-outer"
diff --git a/server/sonar-web/src/main/js/apps/component-measures/drilldown/BubbleChart.js b/server/sonar-web/src/main/js/apps/component-measures/drilldown/BubbleChart.js
index 082dad7f72d..dad5a4ec0e2 100644
--- a/server/sonar-web/src/main/js/apps/component-measures/drilldown/BubbleChart.js
+++ b/server/sonar-web/src/main/js/apps/component-measures/drilldown/BubbleChart.js
@@ -145,12 +145,12 @@ export default class BubbleChart extends React.PureComponent {
 
     return (
       <OriginalBubbleChart
-        items={items}
-        height={HEIGHT}
-        padding={[25, 60, 50, 60]}
         formatXTick={formatXTick}
         formatYTick={formatYTick}
+        height={HEIGHT}
+        items={items}
         onBubbleClick={this.handleBubbleClick}
+        padding={[25, 60, 50, 60]}
         yDomain={getBubbleYDomain(this.props.domain)}
       />
     );
diff --git a/server/sonar-web/src/main/js/apps/issues/components/App.tsx b/server/sonar-web/src/main/js/apps/issues/components/App.tsx
index a433057b301..28a60d965e3 100644
--- a/server/sonar-web/src/main/js/apps/issues/components/App.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/components/App.tsx
@@ -995,7 +995,7 @@ export default class App extends React.PureComponent<Props, State> {
     const selectedIndex = this.getSelectedIndex();
     return (
       <div className="layout-page issues" id="issues-page">
-        <Helmet title={translate('issues.page')} />
+        <Helmet title={openIssue ? openIssue.message : translate('issues.page')} />
 
         {this.renderSide(openIssue)}