From 1a2666353d24be549e2dbabc33cfed5fe2155732 Mon Sep 17 00:00:00 2001
From: Stas Vilchik <stas.vilchik@sonarsource.com>
Date: Thu, 11 Jan 2018 11:46:20 +0100
Subject: [PATCH] SONAR-10239 Stop using "External link" icon

---
 .../js/apps/code/components/Component.tsx     |  4 ++--
 ...{ComponentDetach.tsx => ComponentLink.tsx} | 13 ++++++-----
 .../drilldown/ComponentCell.js                | 15 +++++++------
 .../SourceViewer/SourceViewerHeader.js        | 22 ++++++++-----------
 .../js/components/SourceViewer/styles.css     | 12 +---------
 5 files changed, 28 insertions(+), 38 deletions(-)
 rename server/sonar-web/src/main/js/apps/code/components/{ComponentDetach.tsx => ComponentLink.tsx} (77%)

diff --git a/server/sonar-web/src/main/js/apps/code/components/Component.tsx b/server/sonar-web/src/main/js/apps/code/components/Component.tsx
index f4198dcc060..98bd83e638b 100644
--- a/server/sonar-web/src/main/js/apps/code/components/Component.tsx
+++ b/server/sonar-web/src/main/js/apps/code/components/Component.tsx
@@ -21,7 +21,7 @@ import * as classNames from 'classnames';
 import * as React from 'react';
 import ComponentName from './ComponentName';
 import ComponentMeasure from './ComponentMeasure';
-import ComponentDetach from './ComponentDetach';
+import ComponentLink from './ComponentLink';
 import ComponentPin from './ComponentPin';
 import { Component as IComponent } from '../types';
 
@@ -90,7 +90,7 @@ export default class Component extends React.PureComponent<Props> {
           componentAction = <ComponentPin branch={branch} component={component} />;
           break;
         default:
-          componentAction = <ComponentDetach branch={branch} component={component} />;
+          componentAction = <ComponentLink branch={branch} component={component} />;
       }
     }
 
diff --git a/server/sonar-web/src/main/js/apps/code/components/ComponentDetach.tsx b/server/sonar-web/src/main/js/apps/code/components/ComponentLink.tsx
similarity index 77%
rename from server/sonar-web/src/main/js/apps/code/components/ComponentDetach.tsx
rename to server/sonar-web/src/main/js/apps/code/components/ComponentLink.tsx
index 0a237c54bb8..3074d6c74d6 100644
--- a/server/sonar-web/src/main/js/apps/code/components/ComponentDetach.tsx
+++ b/server/sonar-web/src/main/js/apps/code/components/ComponentLink.tsx
@@ -19,20 +19,23 @@
  */
 import * as React from 'react';
 import { Link } from 'react-router';
-import { translate } from '../../../helpers/l10n';
 import { Component } from '../types';
+import LinkIcon from '../../../components/icons-components/LinkIcon';
+import { translate } from '../../../helpers/l10n';
+import { getProjectUrl } from '../../../helpers/urls';
 
 interface Props {
   branch?: string;
   component: Component;
 }
 
-export default function ComponentDetach({ component, branch }: Props) {
+export default function ComponentLink({ component, branch }: Props) {
   return (
     <Link
-      to={{ pathname: '/dashboard', query: { branch, id: component.refKey || component.key } }}
-      className="icon-detach"
+      className="link-no-underline"
       title={translate('code.open_component_page')}
-    />
+      to={getProjectUrl(component.refKey || component.key, branch)}>
+      <LinkIcon />
+    </Link>
   );
 }
diff --git a/server/sonar-web/src/main/js/apps/component-measures/drilldown/ComponentCell.js b/server/sonar-web/src/main/js/apps/component-measures/drilldown/ComponentCell.js
index 38d25a48286..033a8bcf66b 100644
--- a/server/sonar-web/src/main/js/apps/component-measures/drilldown/ComponentCell.js
+++ b/server/sonar-web/src/main/js/apps/component-measures/drilldown/ComponentCell.js
@@ -19,6 +19,8 @@
  */
 // @flow
 import React from 'react';
+import { Link } from 'react-router';
+import LinkIcon from '../../../components/icons-components/LinkIcon';
 import QualifierIcon from '../../../components/icons-components/QualifierIcon';
 import { splitPath } from '../../../helpers/path';
 import { getPathUrlAsString, getProjectUrl } from '../../../helpers/urls';
@@ -50,8 +52,7 @@ export default class ComponentCell extends React.PureComponent {
 
     if (['DIR', 'FIL', 'UTS'].includes(component.qualifier)) {
       const parts = splitPath(component.path);
-      head = parts.head;
-      tail = parts.tail;
+      ({ head, tail } = parts);
     }
     return (
       <span title={component.refKey || component.key}>
@@ -77,15 +78,15 @@ export default class ComponentCell extends React.PureComponent {
               {this.renderInner()}
             </a>
           ) : (
-            <a
-              id={'component-measures-component-link-' + component.key}
+            <Link
               className="link-no-underline"
-              href={getPathUrlAsString(getProjectUrl(component.refKey, branch))}>
+              id={'component-measures-component-link-' + component.key}
+              to={getProjectUrl(component.refKey, branch)}>
               <span className="big-spacer-right">
-                <i className="icon-detach" />
+                <LinkIcon />
               </span>
               {this.renderInner()}
-            </a>
+            </Link>
           )}
         </div>
       </td>
diff --git a/server/sonar-web/src/main/js/components/SourceViewer/SourceViewerHeader.js b/server/sonar-web/src/main/js/components/SourceViewer/SourceViewerHeader.js
index 53c2f4c2313..253f8db02ac 100644
--- a/server/sonar-web/src/main/js/components/SourceViewer/SourceViewerHeader.js
+++ b/server/sonar-web/src/main/js/components/SourceViewer/SourceViewerHeader.js
@@ -19,6 +19,7 @@
  */
 // @flow
 import React from 'react';
+import { Link } from 'react-router';
 import QualifierIcon from '../shared/QualifierIcon';
 import FavoriteContainer from '../controls/FavoriteContainer';
 import { getPathUrlAsString, getProjectUrl, getComponentIssuesUrl } from '../../helpers/urls';
@@ -179,19 +180,14 @@ export default class SourceViewerHeader extends React.PureComponent {
 
           <div className="source-viewer-header-measure">
             <span className="source-viewer-header-measure-value">
-              <a
-                href={getPathUrlAsString(
-                  getComponentIssuesUrl(project, {
-                    resolved: 'false',
-                    fileUuids: uuid,
-                    branch: this.props.branch
-                  })
-                )}
-                className="source-viewer-header-external-link"
-                target="_blank">
-                {measures.issues != null ? formatMeasure(measures.issues, 'SHORT_INT') : 0}{' '}
-                <i className="icon-detach" />
-              </a>
+              <Link
+                to={getComponentIssuesUrl(project, {
+                  resolved: 'false',
+                  fileUuids: uuid,
+                  branch: this.props.branch
+                })}>
+                {measures.issues != null ? formatMeasure(measures.issues, 'SHORT_INT') : 0}
+              </Link>
             </span>
             <span className="source-viewer-header-measure-label">
               {translate('metric.violations.name')}
diff --git a/server/sonar-web/src/main/js/components/SourceViewer/styles.css b/server/sonar-web/src/main/js/components/SourceViewer/styles.css
index 1387bb7333c..2c98827855f 100644
--- a/server/sonar-web/src/main/js/components/SourceViewer/styles.css
+++ b/server/sonar-web/src/main/js/components/SourceViewer/styles.css
@@ -327,17 +327,7 @@
   display: block;
   line-height: 18px;
   color: var(--baseFontColor);
-  font-size: 18px;
-  font-weight: 300;
-}
-
-.source-viewer-header-external-link {
-  border-bottom: none;
-}
-
-.source-viewer-header-external-link i {
-  position: relative;
-  top: -4px;
+  font-size: var(--bigFontSize);
 }
 
 .source-viewer-header-actions {
-- 
2.39.5