aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--server/sonar-web/src/main/js/apps/overview/badges/BadgesModal.tsx4
-rw-r--r--server/sonar-web/src/main/js/apps/overview/badges/__tests__/__snapshots__/BadgesModal-test.tsx.snap3
-rw-r--r--server/sonar-web/src/main/js/apps/overview/badges/styles.css35
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/ClangGCC.js6
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/DotNet.js8
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/JavaGradle.js6
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/JavaMaven.js4
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Msvc.js8
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Other.js4
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/ClangGCC-test.js.snap30
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Command-test.js.snap39
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/DotNet-test.js.snap32
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/JavaGradle-test.js.snap16
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/JavaMaven-test.js.snap8
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Msvc-test.js.snap32
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Other-test.js.snap18
-rw-r--r--server/sonar-web/src/main/js/apps/tutorials/onboarding/styles.css42
-rw-r--r--server/sonar-web/src/main/js/components/common/CodeSnippet.css (renamed from server/sonar-web/src/main/js/apps/overview/badges/BadgeSnippet.tsx)47
-rw-r--r--server/sonar-web/src/main/js/components/common/CodeSnippet.tsx (renamed from server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Command.js)48
-rw-r--r--server/sonar-web/src/main/js/components/common/__tests__/CodeSnippet-test.tsx (renamed from server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/Command-test.js)13
-rw-r--r--server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/CodeSnippet-test.tsx.snap111
21 files changed, 267 insertions, 247 deletions
diff --git a/server/sonar-web/src/main/js/apps/overview/badges/BadgesModal.tsx b/server/sonar-web/src/main/js/apps/overview/badges/BadgesModal.tsx
index fc98e4eb71a..3592c4daea3 100644
--- a/server/sonar-web/src/main/js/apps/overview/badges/BadgesModal.tsx
+++ b/server/sonar-web/src/main/js/apps/overview/badges/BadgesModal.tsx
@@ -19,10 +19,10 @@
*/
import * as React from 'react';
import BadgeButton from './BadgeButton';
-import BadgeSnippet from './BadgeSnippet';
import BadgeParams from './BadgeParams';
import { BadgeType, BadgeOptions, getBadgeUrl } from './utils';
import { Metric } from '../../../app/types';
+import CodeSnippet from '../../../components/common/CodeSnippet';
import Modal from '../../../components/controls/Modal';
import { translate } from '../../../helpers/l10n';
import './styles.css';
@@ -101,7 +101,7 @@ export default class BadgesModal extends React.PureComponent<Props, State> {
type={selectedType}
updateOptions={this.handleUpdateOptions}
/>
- <BadgeSnippet snippet={getBadgeUrl(selectedType, fullBadgeOptions)} />
+ <CodeSnippet isOneLine={true} snippet={getBadgeUrl(selectedType, fullBadgeOptions)} />
</div>
<footer className="modal-foot">
<ResetButtonLink className="js-modal-close" onClick={this.handleClose}>
diff --git a/server/sonar-web/src/main/js/apps/overview/badges/__tests__/__snapshots__/BadgesModal-test.tsx.snap b/server/sonar-web/src/main/js/apps/overview/badges/__tests__/__snapshots__/BadgesModal-test.tsx.snap
index 8366543e432..00776343f26 100644
--- a/server/sonar-web/src/main/js/apps/overview/badges/__tests__/__snapshots__/BadgesModal-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/overview/badges/__tests__/__snapshots__/BadgesModal-test.tsx.snap
@@ -75,7 +75,8 @@ exports[`should display the modal after click 2`] = `
type="measure"
updateOptions={[Function]}
/>
- <BadgeSnippet
+ <CodeSnippet
+ isOneLine={true}
snippet="host/api/project_badges/measure?branch=branch-6.6&project=foo&metric=alert_status"
/>
</div>
diff --git a/server/sonar-web/src/main/js/apps/overview/badges/styles.css b/server/sonar-web/src/main/js/apps/overview/badges/styles.css
index 3fe0529fe4c..f3866498378 100644
--- a/server/sonar-web/src/main/js/apps/overview/badges/styles.css
+++ b/server/sonar-web/src/main/js/apps/overview/badges/styles.css
@@ -48,38 +48,3 @@
background-color: var(--lightBlue);
border-color: var(--darkBlue);
}
-
-.badge-snippet {
- position: relative;
- margin: var(--gridSize) 0;
- background: var(--gray40);
- color: var(--snippetFontColor);
- border-radius: 3px;
-}
-
-.badge-snippet pre {
- padding: calc(2 * var(--gridSize));
- padding-bottom: 40px;
- overflow: auto;
-}
-
-.badge-snippet button {
- position: absolute;
- top: auto;
- top: 40px;
- right: calc(2 * var(--gridSize));
- height: var(--smallControlHeight);
- line-height: 18px;
- border: 1px solid #fff;
- color: #fff;
- font-size: 11px;
- font-weight: normal;
- user-select: none;
-}
-
-.badge-snippet button:hover,
-.badge-snippet button:focus,
-.badge-snippet button:active {
- background-color: #fff;
- color: var(--gray40);
-}
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/ClangGCC.js b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/ClangGCC.js
index 249c8cc2976..26d3596d2e9 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/ClangGCC.js
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/ClangGCC.js
@@ -19,9 +19,9 @@
*/
// @flow
import React from 'react';
-import Command from './Command';
import SQScanner from './SQScanner';
import BuildWrapper from './BuildWrapper';
+import CodeSnippet from '../../../../components/common/CodeSnippet';
import { translate } from '../../../../helpers/l10n';
/*::
@@ -67,8 +67,8 @@ export default function ClangGCC(props /*: Props */) {
__html: translate('onboarding.analysis.sq_scanner.execute.text')
}}
/>
- <Command command={command1} isOneLine={true} />
- <Command command={command2} isOneLine={props.os === 'win'} />
+ <CodeSnippet isOneLine={true} snippet={command1} />
+ <CodeSnippet isOneLine={props.os === 'win'} snippet={command2} />
<p
className="big-spacer-top markdown"
dangerouslySetInnerHTML={{ __html: translate('onboarding.analysis.sq_scanner.docs') }}
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/DotNet.js b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/DotNet.js
index 493eb4f690b..7e5fd4f24e0 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/DotNet.js
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/DotNet.js
@@ -19,8 +19,8 @@
*/
// @flow
import React from 'react';
-import Command from './Command';
import MSBuildScanner from './MSBuildScanner';
+import CodeSnippet from '../../../../components/common/CodeSnippet';
import { translate } from '../../../../helpers/l10n';
/*::
@@ -58,9 +58,9 @@ export default function DotNet(props /*: Props */) {
__html: translate('onboarding.analysis.msbuild.execute.text')
}}
/>
- <Command command={command1} isOneLine={true} />
- <Command command={command2} isOneLine={true} />
- <Command command={command3} isOneLine={true} />
+ <CodeSnippet isOneLine={true} snippet={command1} />
+ <CodeSnippet isOneLine={true} snippet={command2} />
+ <CodeSnippet isOneLine={true} snippet={command3} />
<p
className="big-spacer-top markdown"
dangerouslySetInnerHTML={{ __html: translate('onboarding.analysis.msbuild.docs') }}
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/JavaGradle.js b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/JavaGradle.js
index 83f34e622e3..41913848279 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/JavaGradle.js
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/JavaGradle.js
@@ -19,7 +19,7 @@
*/
// @flow
import React from 'react';
-import Command from './Command';
+import CodeSnippet from '../../../../components/common/CodeSnippet';
import { translate } from '../../../../helpers/l10n';
/*::
@@ -47,11 +47,11 @@ export default function JavaGradle(props /*: Props */) {
className="spacer-bottom markdown"
dangerouslySetInnerHTML={{ __html: translate('onboarding.analysis.java.gradle.text.1') }}
/>
- <Command command={config} />
+ <CodeSnippet snippet={config} />
<p className="spacer-top spacer-bottom markdown">
{translate('onboarding.analysis.java.gradle.text.2')}
</p>
- <Command command={command} />
+ <CodeSnippet snippet={command} />
<p
className="big-spacer-top markdown"
dangerouslySetInnerHTML={{ __html: translate('onboarding.analysis.java.gradle.docs') }}
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/JavaMaven.js b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/JavaMaven.js
index 1c7f56e137d..a54a97e1443 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/JavaMaven.js
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/JavaMaven.js
@@ -19,7 +19,7 @@
*/
// @flow
import React from 'react';
-import Command from './Command';
+import CodeSnippet from '../../../../components/common/CodeSnippet';
import { translate } from '../../../../helpers/l10n';
/*::
@@ -42,7 +42,7 @@ export default function JavaMaven(props /*: Props */) {
<div>
<h4 className="spacer-bottom">{translate('onboarding.analysis.java.maven.header')}</h4>
<p className="spacer-bottom markdown">{translate('onboarding.analysis.java.maven.text')}</p>
- <Command command={command} />
+ <CodeSnippet snippet={command} />
<p
className="big-spacer-top markdown"
dangerouslySetInnerHTML={{ __html: translate('onboarding.analysis.java.maven.docs') }}
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Msvc.js b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Msvc.js
index c8fc8106595..756c2daea31 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Msvc.js
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Msvc.js
@@ -19,9 +19,9 @@
*/
// @flow
import React from 'react';
-import Command from './Command';
import MSBuildScanner from './MSBuildScanner';
import BuildWrapper from './BuildWrapper';
+import CodeSnippet from '../../../../components/common/CodeSnippet';
import { translate } from '../../../../helpers/l10n';
/*::
@@ -61,9 +61,9 @@ export default function Msvc(props /*: Props */) {
__html: translate('onboarding.analysis.msbuild.execute.text')
}}
/>
- <Command command={command1} isOneLine={true} />
- <Command command={command2} isOneLine={true} />
- <Command command={command3} isOneLine={true} />
+ <CodeSnippet isOneLine={true} snippet={command1} />
+ <CodeSnippet isOneLine={true} snippet={command2} />
+ <CodeSnippet isOneLine={true} snippet={command3} />
<p
className="big-spacer-top markdown"
dangerouslySetInnerHTML={{ __html: translate('onboarding.analysis.msbuild.docs') }}
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Other.js b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Other.js
index 2698d23cd09..47be65b1952 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Other.js
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Other.js
@@ -19,8 +19,8 @@
*/
// @flow
import React from 'react';
-import Command from './Command';
import SQScanner from './SQScanner';
+import CodeSnippet from '../../../../components/common/CodeSnippet';
import { translate } from '../../../../helpers/l10n';
/*::
@@ -56,7 +56,7 @@ export default function Other(props /*: Props */) {
__html: translate('onboarding.analysis.sq_scanner.execute.text')
}}
/>
- <Command command={command} isOneLine={props.os === 'win'} />
+ <CodeSnippet isOneLine={props.os === 'win'} snippet={command} />
<p
className="big-spacer-top markdown"
dangerouslySetInnerHTML={{ __html: translate('onboarding.analysis.sq_scanner.docs') }}
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/ClangGCC-test.js.snap b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/ClangGCC-test.js.snap
index 42680367bee..4375df814f3 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/ClangGCC-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/ClangGCC-test.js.snap
@@ -22,12 +22,13 @@ exports[`renders correctly 1`] = `
}
}
/>
- <Command
- command="build-wrapper-win-x86-64.exe --out-dir bw-output make clean all"
+ <CodeSnippet
isOneLine={true}
+ snippet="build-wrapper-win-x86-64.exe --out-dir bw-output make clean all"
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={true}
+ snippet={
Array [
"sonar-scanner.bat",
"-Dsonar.projectKey=projectKey",
@@ -38,7 +39,6 @@ exports[`renders correctly 1`] = `
"-Dsonar.login=token",
]
}
- isOneLine={true}
/>
<p
className="big-spacer-top markdown"
@@ -73,12 +73,13 @@ exports[`renders correctly 2`] = `
}
}
/>
- <Command
- command="build-wrapper-linux-x86-64 --out-dir bw-output make clean all"
+ <CodeSnippet
isOneLine={true}
+ snippet="build-wrapper-linux-x86-64 --out-dir bw-output make clean all"
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={false}
+ snippet={
Array [
"sonar-scanner",
"-Dsonar.projectKey=projectKey",
@@ -89,7 +90,6 @@ exports[`renders correctly 2`] = `
"-Dsonar.login=token",
]
}
- isOneLine={false}
/>
<p
className="big-spacer-top markdown"
@@ -124,12 +124,13 @@ exports[`renders correctly 3`] = `
}
}
/>
- <Command
- command="build-wrapper-linux-x86-64 --out-dir bw-output make clean all"
+ <CodeSnippet
isOneLine={true}
+ snippet="build-wrapper-linux-x86-64 --out-dir bw-output make clean all"
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={false}
+ snippet={
Array [
"sonar-scanner",
"-Dsonar.projectKey=projectKey",
@@ -140,7 +141,6 @@ exports[`renders correctly 3`] = `
"-Dsonar.login=token",
]
}
- isOneLine={false}
/>
<p
className="big-spacer-top markdown"
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Command-test.js.snap b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Command-test.js.snap
deleted file mode 100644
index a7a6a001caa..00000000000
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Command-test.js.snap
+++ /dev/null
@@ -1,39 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`renders correctly 1`] = `
-<Command
- command="foo
-bar"
->
- <div
- className="onboarding-command"
- >
- <pre>
- foo
-bar
- </pre>
- <ClipboardButton
- copyValue="foo
-bar"
- tooltipPlacement="top"
- >
- <Button
- className="js-copy-to-clipboard no-select"
- data-clipboard-text="foo
-bar"
- innerRef={[Function]}
- >
- <button
- className="button js-copy-to-clipboard no-select"
- data-clipboard-text="foo
-bar"
- onClick={[Function]}
- type="button"
- >
- copy
- </button>
- </Button>
- </ClipboardButton>
- </div>
-</Command>
-`;
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/DotNet-test.js.snap b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/DotNet-test.js.snap
index 56d2150cae2..e21df31e564 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/DotNet-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/DotNet-test.js.snap
@@ -16,8 +16,9 @@ exports[`renders correctly 1`] = `
}
}
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={true}
+ snippet={
Array [
"SonarQube.Scanner.MSBuild.exe begin",
"/k:\\"projectKey\\"",
@@ -26,20 +27,19 @@ exports[`renders correctly 1`] = `
"/d:sonar.login=\\"token\\"",
]
}
- isOneLine={true}
/>
- <Command
- command="MsBuild.exe /t:Rebuild"
+ <CodeSnippet
isOneLine={true}
+ snippet="MsBuild.exe /t:Rebuild"
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={true}
+ snippet={
Array [
"SonarQube.Scanner.MSBuild.exe end",
"/d:sonar.login=\\"token\\"",
]
}
- isOneLine={true}
/>
<p
className="big-spacer-top markdown"
@@ -68,8 +68,9 @@ exports[`renders correctly 2`] = `
}
}
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={true}
+ snippet={
Array [
"SonarQube.Scanner.MSBuild.exe begin",
"/k:\\"projectKey\\"",
@@ -78,20 +79,19 @@ exports[`renders correctly 2`] = `
"/d:sonar.login=\\"token\\"",
]
}
- isOneLine={true}
/>
- <Command
- command="MsBuild.exe /t:Rebuild"
+ <CodeSnippet
isOneLine={true}
+ snippet="MsBuild.exe /t:Rebuild"
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={true}
+ snippet={
Array [
"SonarQube.Scanner.MSBuild.exe end",
"/d:sonar.login=\\"token\\"",
]
}
- isOneLine={true}
/>
<p
className="big-spacer-top markdown"
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/JavaGradle-test.js.snap b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/JavaGradle-test.js.snap
index 264de313eac..fe46b14fff4 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/JavaGradle-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/JavaGradle-test.js.snap
@@ -15,8 +15,8 @@ exports[`renders correctly 1`] = `
}
}
/>
- <Command
- command="plugins {
+ <CodeSnippet
+ snippet="plugins {
id \\"org.sonarqube\\" version \\"2.6\\"
}"
/>
@@ -25,8 +25,8 @@ exports[`renders correctly 1`] = `
>
onboarding.analysis.java.gradle.text.2
</p>
- <Command
- command={
+ <CodeSnippet
+ snippet={
Array [
"./gradlew sonarqube",
undefined,
@@ -69,8 +69,8 @@ exports[`renders correctly 2`] = `
}
}
/>
- <Command
- command="plugins {
+ <CodeSnippet
+ snippet="plugins {
id \\"org.sonarqube\\" version \\"2.6\\"
}"
/>
@@ -79,8 +79,8 @@ exports[`renders correctly 2`] = `
>
onboarding.analysis.java.gradle.text.2
</p>
- <Command
- command={
+ <CodeSnippet
+ snippet={
Array [
"./gradlew sonarqube",
"-Dsonar.organization=organization",
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/JavaMaven-test.js.snap b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/JavaMaven-test.js.snap
index 60d6f6c8dfb..00a5d783eb5 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/JavaMaven-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/JavaMaven-test.js.snap
@@ -12,8 +12,8 @@ exports[`renders correctly 1`] = `
>
onboarding.analysis.java.maven.text
</p>
- <Command
- command={
+ <CodeSnippet
+ snippet={
Array [
"mvn sonar:sonar",
undefined,
@@ -53,8 +53,8 @@ exports[`renders correctly 2`] = `
>
onboarding.analysis.java.maven.text
</p>
- <Command
- command={
+ <CodeSnippet
+ snippet={
Array [
"mvn sonar:sonar",
"-Dsonar.organization=organization",
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Msvc-test.js.snap b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Msvc-test.js.snap
index c5260a8f2e7..a5e4f91b4e3 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Msvc-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Msvc-test.js.snap
@@ -20,8 +20,9 @@ exports[`renders correctly 1`] = `
}
}
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={true}
+ snippet={
Array [
"SonarQube.Scanner.MSBuild.exe begin",
"/k:\\"projectKey\\"",
@@ -31,20 +32,19 @@ exports[`renders correctly 1`] = `
"/d:sonar.login=\\"token\\"",
]
}
- isOneLine={true}
/>
- <Command
- command="build-wrapper-win-x86-64.exe --out-dir bw-output MsBuild.exe /t:Rebuild"
+ <CodeSnippet
isOneLine={true}
+ snippet="build-wrapper-win-x86-64.exe --out-dir bw-output MsBuild.exe /t:Rebuild"
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={true}
+ snippet={
Array [
"SonarQube.Scanner.MSBuild.exe end",
"/d:sonar.login=\\"token\\"",
]
}
- isOneLine={true}
/>
<p
className="big-spacer-top markdown"
@@ -77,8 +77,9 @@ exports[`renders correctly 2`] = `
}
}
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={true}
+ snippet={
Array [
"SonarQube.Scanner.MSBuild.exe begin",
"/k:\\"projectKey\\"",
@@ -88,20 +89,19 @@ exports[`renders correctly 2`] = `
"/d:sonar.login=\\"token\\"",
]
}
- isOneLine={true}
/>
- <Command
- command="build-wrapper-win-x86-64.exe --out-dir bw-output MsBuild.exe /t:Rebuild"
+ <CodeSnippet
isOneLine={true}
+ snippet="build-wrapper-win-x86-64.exe --out-dir bw-output MsBuild.exe /t:Rebuild"
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={true}
+ snippet={
Array [
"SonarQube.Scanner.MSBuild.exe end",
"/d:sonar.login=\\"token\\"",
]
}
- isOneLine={true}
/>
<p
className="big-spacer-top markdown"
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Other-test.js.snap b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Other-test.js.snap
index ba21667f2f5..7c7ae719489 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Other-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/__snapshots__/Other-test.js.snap
@@ -18,8 +18,9 @@ exports[`renders correctly 1`] = `
}
}
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={true}
+ snippet={
Array [
"sonar-scanner.bat",
"-Dsonar.projectKey=projectKey",
@@ -29,7 +30,6 @@ exports[`renders correctly 1`] = `
"-Dsonar.login=token",
]
}
- isOneLine={true}
/>
<p
className="big-spacer-top markdown"
@@ -60,8 +60,9 @@ exports[`renders correctly 2`] = `
}
}
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={false}
+ snippet={
Array [
"sonar-scanner",
"-Dsonar.projectKey=projectKey",
@@ -71,7 +72,6 @@ exports[`renders correctly 2`] = `
"-Dsonar.login=token",
]
}
- isOneLine={false}
/>
<p
className="big-spacer-top markdown"
@@ -102,8 +102,9 @@ exports[`renders correctly 3`] = `
}
}
/>
- <Command
- command={
+ <CodeSnippet
+ isOneLine={false}
+ snippet={
Array [
"sonar-scanner",
"-Dsonar.projectKey=projectKey",
@@ -113,7 +114,6 @@ exports[`renders correctly 3`] = `
"-Dsonar.login=token",
]
}
- isOneLine={false}
/>
<p
className="big-spacer-top markdown"
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/styles.css b/server/sonar-web/src/main/js/apps/tutorials/onboarding/styles.css
index e12fb2dde86..9c8dfc093fc 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/styles.css
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/styles.css
@@ -58,48 +58,6 @@
outline: none;
}
-.onboarding-command {
- position: relative;
- margin: 8px 0;
-}
-
-.onboarding-command pre {
- padding: 15px;
- border-radius: 2px;
- background: var(--gray40);
- color: var(--snippetFontColor);
- overflow: auto;
-}
-
-.onboarding-command button {
- position: absolute;
- top: 15px;
- right: 15px;
- height: 20px;
- line-height: 18px;
- border: 1px solid #fff;
- color: #fff;
- font-size: 11px;
- font-weight: normal;
- user-select: none;
-}
-
-.onboarding-command button:hover,
-.onboarding-command button:focus,
-.onboarding-command button:active {
- background-color: #fff;
- color: var(--gray40);
-}
-
-.onboarding-command-oneline pre {
- padding-bottom: 40px;
-}
-
-.onboarding-command-oneline button {
- top: auto;
- top: 40px;
-}
-
.onboarding .page-actions {
text-align: right;
margin-bottom: 0;
diff --git a/server/sonar-web/src/main/js/apps/overview/badges/BadgeSnippet.tsx b/server/sonar-web/src/main/js/components/common/CodeSnippet.css
index 5deaf71cbbd..18232d67b36 100644
--- a/server/sonar-web/src/main/js/apps/overview/badges/BadgeSnippet.tsx
+++ b/server/sonar-web/src/main/js/components/common/CodeSnippet.css
@@ -17,18 +17,43 @@
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
-import * as React from 'react';
-import ClipboardButton from '../../../components/controls/ClipboardButton';
+.code-snippet {
+ position: relative;
+ margin: var(--gridSize) 0;
+ background: var(--gray40);
+ color: var(--snippetFontColor);
+ border-radius: 3px;
+}
+
+.code-snippet pre {
+ padding: calc(2 * var(--gridSize));
+ overflow: auto;
+}
+
+.code-snippet button {
+ position: absolute;
+ top: calc(2 * var(--gridSize));
+ right: calc(2 * var(--gridSize));
+ line-height: 18px;
+ border: 1px solid #fff;
+ color: #fff;
+ font-size: 11px;
+ font-weight: normal;
+ user-select: none;
+}
+
+.code-snippet button:hover,
+.code-snippet button:focus,
+.code-snippet button:active {
+ background-color: #fff;
+ color: var(--gray40);
+}
-interface Props {
- snippet: string;
+.code-snippet-oneline pre {
+ padding-bottom: 40px;
}
-export default function BadgeSnippet({ snippet }: Props) {
- return (
- <div className="badge-snippet">
- <pre>{snippet}</pre>
- <ClipboardButton copyValue={snippet} tooltipPlacement="top" />
- </div>
- );
+.code-snippet-oneline button {
+ top: auto;
+ top: 40px;
}
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Command.js b/server/sonar-web/src/main/js/components/common/CodeSnippet.tsx
index 5e3706585f2..6e2469597bc 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/Command.js
+++ b/server/sonar-web/src/main/js/components/common/CodeSnippet.tsx
@@ -17,37 +17,31 @@
* 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 classNames from 'classnames';
-import ClipboardButton from '../../../../components/controls/ClipboardButton';
-import { translate } from '../../../../helpers/l10n';
+import * as React from 'react';
+import * as classNames from 'classnames';
+import ClipboardButton from '../controls/ClipboardButton';
+import './CodeSnippet.css';
-/*::
-type Props = {
- command: string | Array<?string>,
- isOneLine?: boolean
-};
-*/
+interface Props {
+ className?: string;
+ isOneLine?: boolean;
+ noCopy?: boolean;
+ snippet: string | (string | undefined)[];
+}
// keep this "useless" concatentation for the readability reason
// eslint-disable-next-line no-useless-concat
const s = ' \\' + '\n ';
-export default class Command extends React.PureComponent {
- /*:: props: Props; */
-
- render() {
- const { command, isOneLine } = this.props;
- const commandArray = Array.isArray(command) ? command.filter(line => line != null) : [command];
- const finalCommand = isOneLine ? commandArray.join(' ') : commandArray.join(s);
-
- return (
- <div
- className={classNames('onboarding-command', { 'onboarding-command-oneline': isOneLine })}>
- <pre>{finalCommand}</pre>
- <ClipboardButton copyValue={finalCommand} tooltipPlacement="top" />
- </div>
- );
- }
+export default function CodeSnippet({ className, isOneLine, noCopy, snippet }: Props) {
+ const snippetArray = Array.isArray(snippet)
+ ? snippet.filter(line => line !== undefined)
+ : [snippet];
+ const finalSnippet = isOneLine ? snippetArray.join(' ') : snippetArray.join(s);
+ return (
+ <div className={classNames('code-snippet', { 'code-snippet-oneline': isOneLine }, className)}>
+ <pre>{finalSnippet}</pre>
+ {!noCopy && <ClipboardButton copyValue={finalSnippet} tooltipPlacement="top" />}
+ </div>
+ );
}
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/Command-test.js b/server/sonar-web/src/main/js/components/common/__tests__/CodeSnippet-test.tsx
index f4aa51cd5c8..8956e411a50 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/commands/__tests__/Command-test.js
+++ b/server/sonar-web/src/main/js/components/common/__tests__/CodeSnippet-test.tsx
@@ -17,11 +17,16 @@
* 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 * as React from 'react';
import { mount } from 'enzyme';
-import Command from '../Command';
+import CodeSnippet from '../CodeSnippet';
it('renders correctly', () => {
- expect(mount(<Command command={'foo\nbar'} />)).toMatchSnapshot();
+ expect(mount(<CodeSnippet snippet={'foo\nbar'} />)).toMatchSnapshot();
+ expect(mount(<CodeSnippet snippet={'foo\nbar'} noCopy={true} />)).toMatchSnapshot();
+});
+
+it('renders correctly with array snippet', () => {
+ expect(mount(<CodeSnippet snippet={['foo', 'bar']} />)).toMatchSnapshot();
+ expect(mount(<CodeSnippet snippet={['foo', 'bar']} isOneLine={true} />)).toMatchSnapshot();
});
diff --git a/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/CodeSnippet-test.tsx.snap b/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/CodeSnippet-test.tsx.snap
new file mode 100644
index 00000000000..5e330d13abe
--- /dev/null
+++ b/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/CodeSnippet-test.tsx.snap
@@ -0,0 +1,111 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders correctly 1`] = `
+<CodeSnippet
+ snippet="foo
+bar"
+>
+ <div
+ className="code-snippet"
+ >
+ <pre>
+ foo
+bar
+ </pre>
+ <ClipboardButton
+ copyValue="foo
+bar"
+ tooltipPlacement="top"
+ >
+ <button
+ className="js-copy-to-clipboard no-select"
+ data-clipboard-text="foo
+bar"
+ >
+ copy
+ </button>
+ </ClipboardButton>
+ </div>
+</CodeSnippet>
+`;
+
+exports[`renders correctly 2`] = `
+<CodeSnippet
+ noCopy={true}
+ snippet="foo
+bar"
+>
+ <div
+ className="code-snippet"
+ >
+ <pre>
+ foo
+bar
+ </pre>
+ </div>
+</CodeSnippet>
+`;
+
+exports[`renders correctly with array snippet 1`] = `
+<CodeSnippet
+ snippet={
+ Array [
+ "foo",
+ "bar",
+ ]
+ }
+>
+ <div
+ className="code-snippet"
+ >
+ <pre>
+ foo \\
+ bar
+ </pre>
+ <ClipboardButton
+ copyValue="foo \\\\
+ bar"
+ tooltipPlacement="top"
+ >
+ <button
+ className="js-copy-to-clipboard no-select"
+ data-clipboard-text="foo \\\\
+ bar"
+ >
+ copy
+ </button>
+ </ClipboardButton>
+ </div>
+</CodeSnippet>
+`;
+
+exports[`renders correctly with array snippet 2`] = `
+<CodeSnippet
+ isOneLine={true}
+ snippet={
+ Array [
+ "foo",
+ "bar",
+ ]
+ }
+>
+ <div
+ className="code-snippet code-snippet-oneline"
+ >
+ <pre>
+ foo bar
+ </pre>
+ <ClipboardButton
+ copyValue="foo bar"
+ tooltipPlacement="top"
+ >
+ <button
+ className="js-copy-to-clipboard no-select"
+ data-clipboard-text="foo bar"
+ >
+ copy
+ </button>
+ </ClipboardButton>
+ </div>
+</CodeSnippet>
+`;