From 81400607613b2a4a2bb4bcee875eb39c805b77c1 Mon Sep 17 00:00:00 2001
From: 7PH <benjamin.raymond@sonarsource.com>
Date: Thu, 1 Jun 2023 10:09:39 +0200
Subject: [PATCH] SONAR-19391 Measures page's header for the source viewer
 should be moved to the new UI

---
 .../design-system/src/components/Breadcrumbs.tsx     |  3 +++
 .../src/components/__tests__/TreeMap-test.tsx        |  2 +-
 .../component-measures/components/MeasureContent.tsx |  1 +
 .../components/MeasureOverview.tsx                   |  1 +
 .../components/MeasuresBreadcrumbs.tsx               | 12 +++++++++---
 .../main/js/components/SourceViewer/SourceViewer.tsx |  4 +++-
 6 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/server/sonar-web/design-system/src/components/Breadcrumbs.tsx b/server/sonar-web/design-system/src/components/Breadcrumbs.tsx
index 056cde51d59..be9238b0222 100644
--- a/server/sonar-web/design-system/src/components/Breadcrumbs.tsx
+++ b/server/sonar-web/design-system/src/components/Breadcrumbs.tsx
@@ -38,6 +38,7 @@ import { ChevronDownIcon, ChevronRightIcon } from './icons';
 const WIDTH_OF_BREADCRUMB_DROPDOWN = 32;
 
 interface Props {
+  actions?: React.ReactNode;
   ariaLabel?: string;
   breadcrumbLimit?: number;
   children: React.ReactNode;
@@ -55,6 +56,7 @@ export function Breadcrumbs(props: Props) {
     children,
     expandButtonLabel,
     innerRef,
+    actions,
     maxWidth = LAYOUT_VIEWPORT_MAX_WIDTH_LARGE,
   } = props;
   const [lengthOfChildren, setLengthOfChildren] = React.useState<number[]>([]);
@@ -160,6 +162,7 @@ export function Breadcrumbs(props: Props) {
         </Dropdown>
       )}
       <ul className="sw-truncate sw-leading-6 sw-flex">{[...breadcrumbsToShow].reverse()}</ul>
+      {actions && <div className="sw-ml-2">{actions}</div>}
     </BreadcrumbWrapper>
   );
 }
diff --git a/server/sonar-web/design-system/src/components/__tests__/TreeMap-test.tsx b/server/sonar-web/design-system/src/components/__tests__/TreeMap-test.tsx
index 645d1499ea6..1f0121c3b18 100644
--- a/server/sonar-web/design-system/src/components/__tests__/TreeMap-test.tsx
+++ b/server/sonar-web/design-system/src/components/__tests__/TreeMap-test.tsx
@@ -53,7 +53,7 @@ it('should render correctly and forward click event', async () => {
 
   expect(container).toMatchSnapshot();
 
-  await user.click(screen.getByText('SonarQube_Web'));
+  await user.click(screen.getByRole('link', { name: 'SonarQube_Web' }));
   expect(onRectangleClick).toHaveBeenCalledTimes(1);
   expect(onRectangleClick).toHaveBeenCalledWith(items[1]);
 });
diff --git a/server/sonar-web/src/main/js/apps/component-measures/components/MeasureContent.tsx b/server/sonar-web/src/main/js/apps/component-measures/components/MeasureContent.tsx
index 5f241e9e2c4..aca949a8c60 100644
--- a/server/sonar-web/src/main/js/apps/component-measures/components/MeasureContent.tsx
+++ b/server/sonar-web/src/main/js/apps/component-measures/components/MeasureContent.tsx
@@ -405,6 +405,7 @@ export default class MeasureContent extends React.PureComponent<Props, State> {
         {isFileComponent ? (
           <div className="measure-details-viewer">
             <SourceViewer
+              hideHeader={true}
               branchLike={branchLike}
               component={baseComponent.key}
               metricKey={this.state.metric?.key}
diff --git a/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverview.tsx b/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverview.tsx
index 855983957b9..ff9f686eafb 100644
--- a/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverview.tsx
+++ b/server/sonar-web/src/main/js/apps/component-measures/components/MeasureOverview.tsx
@@ -129,6 +129,7 @@ export default class MeasureOverview extends React.PureComponent<Props, State> {
       return (
         <div className="measure-details-viewer">
           <SourceViewer
+            hideHeader={true}
             branchLike={branchLike}
             component={component.key}
             onIssueChange={this.props.onIssueChange}
diff --git a/server/sonar-web/src/main/js/apps/component-measures/components/MeasuresBreadcrumbs.tsx b/server/sonar-web/src/main/js/apps/component-measures/components/MeasuresBreadcrumbs.tsx
index b5c578c07e8..7eca8c1f172 100644
--- a/server/sonar-web/src/main/js/apps/component-measures/components/MeasuresBreadcrumbs.tsx
+++ b/server/sonar-web/src/main/js/apps/component-measures/components/MeasuresBreadcrumbs.tsx
@@ -17,7 +17,8 @@
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-import { Breadcrumbs, HoverLink } from 'design-system';
+import classNames from 'classnames';
+import { Breadcrumbs, ClipboardIconButton, HoverLink } from 'design-system';
 import * as React from 'react';
 import { getBreadcrumbs } from '../../../api/components';
 import { getBranchLikeQuery, isSameBranchLike } from '../../../helpers/branch-like';
@@ -25,7 +26,7 @@ import { KeyboardKeys } from '../../../helpers/keycodes';
 import { translate } from '../../../helpers/l10n';
 import { collapsePath, limitComponentName } from '../../../helpers/path';
 import { BranchLike } from '../../../types/branch-like';
-import { ComponentQualifier } from '../../../types/component';
+import { ComponentQualifier, isProject } from '../../../types/component';
 import { ComponentMeasure, ComponentMeasureIntern } from '../../../types/types';
 
 interface Props {
@@ -97,6 +98,7 @@ export default class MeasuresBreadcrumbs extends React.PureComponent<Props, Stat
 
   render() {
     const { breadcrumbs } = this.state;
+    const lastBreadcrumb = breadcrumbs[breadcrumbs.length - 1];
 
     if (breadcrumbs.length <= 0) {
       return null;
@@ -105,8 +107,12 @@ export default class MeasuresBreadcrumbs extends React.PureComponent<Props, Stat
     return (
       <Breadcrumbs
         ariaLabel={translate('breadcrumbs')}
-        className={this.props.className}
+        className={classNames(this.props.className)}
         maxWidth={500}
+        actions={
+          !isProject(lastBreadcrumb.qualifier) &&
+          lastBreadcrumb.path && <ClipboardIconButton copyValue={lastBreadcrumb.path} />
+        }
       >
         {breadcrumbs.map((component) => (
           <HoverLink
diff --git a/server/sonar-web/src/main/js/components/SourceViewer/SourceViewer.tsx b/server/sonar-web/src/main/js/components/SourceViewer/SourceViewer.tsx
index 3f813f76da8..caccba9fa30 100644
--- a/server/sonar-web/src/main/js/components/SourceViewer/SourceViewer.tsx
+++ b/server/sonar-web/src/main/js/components/SourceViewer/SourceViewer.tsx
@@ -63,6 +63,7 @@ import loadIssues from './helpers/loadIssues';
 import './styles.css';
 
 export interface Props {
+  hideHeader?: boolean;
   aroundLine?: number;
   branchLike: BranchLike | undefined;
   component: string;
@@ -560,6 +561,7 @@ export default class SourceViewer extends React.PureComponent<Props, State> {
 
   render() {
     const { component, loading, sources, notAccessible, sourceRemoved } = this.state;
+    const { hideHeader } = this.props;
 
     if (loading) {
       return null;
@@ -588,7 +590,7 @@ export default class SourceViewer extends React.PureComponent<Props, State> {
     return (
       <SourceViewerContext.Provider value={{ branchLike: this.props.branchLike, file: component }}>
         <div className="source-viewer">
-          {this.renderHeader(component)}
+          {!hideHeader && this.renderHeader(component)}
           {sourceRemoved && (
             <Alert className="spacer-top" variant="warning">
               {translate('code_viewer.no_source_code_displayed_due_to_source_removed')}
-- 
2.39.5