SONAR-11830 Don't show empty cell on projects and applications

There are no individual files on applications and portfolios. Hence,
they can never be pinned. Because of this, we can remove the empty cell
at the start of each row.

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 6391a622928c3ff4ee992c5b737f76658294a828..52b01fc1436d4910d2bdde90d7a05862b5222c32 100644 (file)
--- a/server/sonar-web/src/main/js/apps/code/components/Component.tsx
+++ b/server/sonar-web/src/main/js/apps/code/components/Component.tsx
@@ -27,6 +27,7 @@ import { withScrollTo } from '../../../components/hoc/withScrollTo';
 
 interface Props {
   branchLike?: T.BranchLike;
+  canBePinned?: boolean;
   canBrowse?: boolean;
   component: T.ComponentMeasure;
   metrics: T.Metric[];
@@ -39,6 +40,7 @@ export class Component extends React.PureComponent<Props> {
   render() {
     const {
       branchLike,
+      canBePinned = true,
       canBrowse = false,
       component,
       metrics,
@@ -52,21 +54,23 @@ export class Component extends React.PureComponent<Props> {
     return (
       <tr className={classNames({ selected })}>
         <td className="blank" />
-        <td className="thin nowrap">
-          <span className="spacer-right">
+        {canBePinned && (
+          <td className="thin nowrap">
             {isFile && (
-              <WorkspaceContext.Consumer>
-                {({ openComponent }) => (
-                  <ComponentPin
-                    branchLike={branchLike}
-                    component={component}
-                    openComponent={openComponent}
-                  />
-                )}
-              </WorkspaceContext.Consumer>
+              <span className="spacer-right">
+                <WorkspaceContext.Consumer>
+                  {({ openComponent }) => (
+                    <ComponentPin
+                      branchLike={branchLike}
+                      component={component}
+                      openComponent={openComponent}
+                    />
+                  )}
+                </WorkspaceContext.Consumer>
+              </span>
             )}
-          </span>
-        </td>
+          </td>
+        )}
         <td className="code-name-cell">
           <ComponentName
             branchLike={branchLike}

diff --git a/server/sonar-web/src/main/js/apps/code/components/Components.tsx b/server/sonar-web/src/main/js/apps/code/components/Components.tsx
index 171e36b9464f9bc5e3ce7085704fc06a269e4045..41125ef8c33f174860f9847f4c944231c9479a33 100644 (file)
--- a/server/sonar-web/src/main/js/apps/code/components/Components.tsx
+++ b/server/sonar-web/src/main/js/apps/code/components/Components.tsx
@@ -43,11 +43,14 @@ export class Components extends React.PureComponent<Props> {
     );
     const metrics = metricKeys.map(metric => this.props.metrics[metric]);
     const colSpan = metrics.length + 4;
+    const canBePinned = baseComponent && !['APP', 'VW', 'SVW'].includes(baseComponent.qualifier);
+
     return (
       <table className="data boxed-padding zebra">
         {baseComponent && (
           <ComponentsHeader
             baseComponent={baseComponent}
+            canBePinned={canBePinned}
             metrics={metricKeys}
             rootComponent={rootComponent}
           />
@@ -56,6 +59,7 @@ export class Components extends React.PureComponent<Props> {
           <tbody>
             <Component
               branchLike={branchLike}
+              canBePinned={canBePinned}
               component={baseComponent}
               key={baseComponent.key}
               metrics={metrics}
@@ -72,6 +76,7 @@ export class Components extends React.PureComponent<Props> {
             components.map((component, index, list) => (
               <Component
                 branchLike={branchLike}
+                canBePinned={canBePinned}
                 canBrowse={true}
                 component={component}
                 key={component.key}
@@ -82,7 +87,7 @@ export class Components extends React.PureComponent<Props> {
               />
             ))
           ) : (
-            <ComponentsEmpty />
+            <ComponentsEmpty canBePinned={canBePinned} />
           )}
 
           <tr className="blank">

diff --git a/server/sonar-web/src/main/js/apps/code/components/ComponentsEmpty.tsx b/server/sonar-web/src/main/js/apps/code/components/ComponentsEmpty.tsx
index 3c3e4fab144b5da45ace108dd2e199de938c2ca6..6f314ebf25d14d6f6275033a8e2ba3246776b6bf 100644 (file)
--- a/server/sonar-web/src/main/js/apps/code/components/ComponentsEmpty.tsx
+++ b/server/sonar-web/src/main/js/apps/code/components/ComponentsEmpty.tsx
@@ -20,10 +20,14 @@
 import * as React from 'react';
 import { translate } from '../../../helpers/l10n';
 
-export default function ComponentsEmpty() {
+interface Props {
+  canBePinned?: boolean;
+}
+
+export default function ComponentsEmpty({ canBePinned = true }: Props) {
   return (
     <tr>
-      <td />
+      {canBePinned && <td />}
       <td className="note" colSpan={2}>
         {translate('no_results')}
       </td>

diff --git a/server/sonar-web/src/main/js/apps/code/components/ComponentsHeader.tsx b/server/sonar-web/src/main/js/apps/code/components/ComponentsHeader.tsx
index 81de436c90f5fef9636ef9a4731c5383ea11c571..ca8123fa5b8e2fdfd3b88f1c7297a3d06d7a0dc1 100644 (file)
--- a/server/sonar-web/src/main/js/apps/code/components/ComponentsHeader.tsx
+++ b/server/sonar-web/src/main/js/apps/code/components/ComponentsHeader.tsx
@@ -23,6 +23,7 @@ import { translate } from '../../../helpers/l10n';
 
 interface Props {
   baseComponent?: T.ComponentMeasure;
+  canBePinned?: boolean;
   metrics: string[];
   rootComponent: T.ComponentMeasure;
 }
@@ -34,7 +35,12 @@ const SHORT_NAME_METRICS = [
   'new_duplicated_lines_density'
 ];
 
-export default function ComponentsHeader({ baseComponent, metrics, rootComponent }: Props) {
+export default function ComponentsHeader({
+  baseComponent,
+  canBePinned = true,
+  metrics,
+  rootComponent
+}: Props) {
   const isPortfolio = ['VW', 'SVW'].includes(rootComponent.qualifier);
   let columns: string[] = [];
   if (isPortfolio) {
@@ -54,7 +60,7 @@ export default function ComponentsHeader({ baseComponent, metrics, rootComponent
   return (
     <thead>
       <tr className="code-components-header">
-        <th className="thin nowrap" colSpan={2} />
+        <th className="thin nowrap" colSpan={canBePinned ? 2 : 1} />
         <th />
         {baseComponent &&
           columns.map((column, index) => (

diff --git a/server/sonar-web/src/main/js/apps/code/components/__tests__/__snapshots__/Component-test.tsx.snap b/server/sonar-web/src/main/js/apps/code/components/__tests__/__snapshots__/Component-test.tsx.snap
index d7a9a10ec89c1b1b26e456ca6dd4883c93732dfe..138b237b2e5c1864234fd7eec29d2cf428f1fcde 100644 (file)
--- a/server/sonar-web/src/main/js/apps/code/components/__tests__/__snapshots__/Component-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/code/components/__tests__/__snapshots__/Component-test.tsx.snap
@@ -9,11 +9,7 @@ exports[`should render correctly 1`] = `
   />
   <td
     className="thin nowrap"
-  >
-    <span
-      className="spacer-right"
-    />
-  </td>
+  />
   <td
     className="code-name-cell"
   >

diff --git a/server/sonar-web/src/main/js/apps/code/components/__tests__/__snapshots__/Components-test.tsx.snap b/server/sonar-web/src/main/js/apps/code/components/__tests__/__snapshots__/Components-test.tsx.snap
index 668294412ec1d0d291c7ba01cfa7fe69cc4b67e0..b7df151910c072b0cbac392d12da2ba055c9c169 100644 (file)
--- a/server/sonar-web/src/main/js/apps/code/components/__tests__/__snapshots__/Components-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/code/components/__tests__/__snapshots__/Components-test.tsx.snap
@@ -12,6 +12,7 @@ exports[`renders correctly 1`] = `
         "qualifier": "TRK",
       }
     }
+    canBePinned={true}
     metrics={
       Array [
         "coverage",
@@ -27,6 +28,7 @@ exports[`renders correctly 1`] = `
   />
   <tbody>
     <withScrollTo(Component)
+      canBePinned={true}
       component={
         Object {
           "key": "foo",
@@ -70,6 +72,7 @@ exports[`renders correctly 1`] = `
   </tbody>
   <tbody>
     <withScrollTo(Component)
+      canBePinned={true}
       canBrowse={true}
       component={
         Object {
@@ -161,6 +164,7 @@ exports[`renders correctly for leak 1`] = `
         "qualifier": "TRK",
       }
     }
+    canBePinned={true}
     metrics={Array []}
     rootComponent={
       Object {
@@ -180,6 +184,7 @@ exports[`renders correctly for leak 1`] = `
           "type": "SHORT",
         }
       }
+      canBePinned={true}
       component={
         Object {
           "key": "foo",
@@ -222,6 +227,7 @@ exports[`renders correctly for leak 1`] = `
           "type": "SHORT",
         }
       }
+      canBePinned={true}
       canBrowse={true}
       component={
         Object {