SONAR-14893 Adding Bitbucket pipline tutorial

server/sonar-web/src/main/js/components/tutorials/TutorialSelectionRenderer.tsx

@@ -22,6 +22,7 @@ import { translate } from 'sonar-ui-common/helpers/l10n';
 import { getBaseUrl } from 'sonar-ui-common/helpers/urls';
 import { AlmKeys, AlmSettingsInstance, ProjectAlmBindingResponse } from '../../types/alm-settings';
 import AzurePipelinesTutorial from './azure-pipelines/AzurePipelinesTutorial';
+import BitbucketPipelinesTutorial from './bitbucket-pipelines/BitbucketPipelinesTutorial';
 import GitHubActionTutorial from './github-action/GitHubActionTutorial';
 import GitLabCITutorial from './gitlabci/GitLabCITutorial';
 import JenkinsTutorial from './jenkins/JenkinsTutorial';
@@ -120,6 +121,22 @@ export default function TutorialSelectionRenderer(props: TutorialSelectionRender
               </button>
             )}
 
+            {projectBinding?.alm === AlmKeys.BitbucketCloud && (
+              <button
+                className="button button-huge display-flex-column spacer-left spacer-right bitbucket-pipelines"
+                onClick={() => props.onSelectTutorial(TutorialModes.BitbucketPipelines)}
+                type="button">
+                <img
+                  alt="" // Should be ignored by screen readers
+                  height={80}
+                  src={`${getBaseUrl()}/images/alm/bitbucket.svg`}
+                />
+                <div className="medium big-spacer-top">
+                  {translate('onboarding.tutorial.choose_method.bitbucket_pipelines')}
+                </div>
+              </button>
+            )}
+
             {jenkinsAvailable && (
               <button
                 className="button button-huge display-flex-column spacer-left spacer-right tutorial-mode-jenkins"
@@ -157,6 +174,16 @@ export default function TutorialSelectionRenderer(props: TutorialSelectionRender
         <ManualTutorial component={component} currentUser={currentUser} />
       )}
 
+      {selectedTutorial === TutorialModes.BitbucketPipelines && projectBinding !== undefined && (
+        <BitbucketPipelinesTutorial
+          almBinding={almBinding}
+          baseUrl={baseUrl}
+          component={component}
+          currentUser={currentUser}
+          projectBinding={projectBinding}
+        />
+      )}
+
       {selectedTutorial === TutorialModes.GitHubActions && projectBinding !== undefined && (
         <GitHubActionTutorial
           almBinding={almBinding}

server/sonar-web/src/main/js/components/tutorials/__tests__/TutorialSelectionRenderer-test.tsx

@@ -24,6 +24,7 @@ import {
   mockAlmSettingsInstance,
   mockProjectAzureBindingResponse,
   mockProjectBitbucketBindingResponse,
+  mockProjectBitbucketCloudBindingResponse,
   mockProjectGithubBindingResponse,
   mockProjectGitLabBindingResponse
 } from '../../../helpers/mocks/alm-settings';
@@ -122,6 +123,23 @@ it('should allow mode selection for GitLab', () => {
   expect(onSelectTutorial).toHaveBeenLastCalledWith(TutorialModes.Manual);
 });
 
+it('should allow mode selection for Bitbucket pipepline', () => {
+  const onSelectTutorial = jest.fn();
+  const wrapper = shallowRender({
+    onSelectTutorial,
+    projectBinding: mockProjectBitbucketCloudBindingResponse()
+  });
+
+  click(wrapper.find('button.tutorial-mode-jenkins'));
+  expect(onSelectTutorial).toHaveBeenLastCalledWith(TutorialModes.Jenkins);
+
+  click(wrapper.find('button.bitbucket-pipelines'));
+  expect(onSelectTutorial).toHaveBeenLastCalledWith(TutorialModes.BitbucketPipelines);
+
+  click(wrapper.find('button.tutorial-mode-manual'));
+  expect(onSelectTutorial).toHaveBeenLastCalledWith(TutorialModes.Manual);
+});
+
 it('should allow mode selection for Azure DevOps', () => {
   const onSelectTutorial = jest.fn();
   const wrapper = shallowRender({

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/AnalysisCommand.tsx

@@ -0,0 +1,201 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2021 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import { Dictionary } from 'lodash';
+import * as React from 'react';
+import { withAppState } from '../../hoc/withAppState';
+import CreateYmlFile from '../components/CreateYmlFile';
+import { BuildTools } from '../types';
+import { PreambuleYaml } from './PreambuleYaml';
+
+export interface AnalysisCommandProps {
+  appState: T.AppState;
+  buildTool?: BuildTools;
+  component: T.Component;
+}
+
+const YamlTemplate: Dictionary<(branchesEnabled?: boolean, projectKey?: string) => string> = {
+  [BuildTools.Gradle]: branchesEnabled => `image: openjdk:8
+
+clone:
+  depth: full
+  
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - gradle
+            - sonar
+          script:
+            - bash ./gradlew sonarqube
+${
+  branchesEnabled
+    ? `
+  pull-requests:
+    '**':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - gradle
+            - sonar
+          script:
+            - bash ./gradlew sonarqube
+`
+    : ''
+}
+definitions:
+  caches:
+    sonar: ~/.sonar`,
+  [BuildTools.Maven]: branchesEnabled => `image: maven:3.3.9
+
+clone:
+  depth: full
+  
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - maven
+            - sonar
+          script:
+            - mvn verify sonar:sonar
+${
+  branchesEnabled
+    ? `
+  pull-requests:
+    '**':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - maven
+            - sonar
+          script:
+            - mvn verify sonar:sonar
+`
+    : ''
+}  
+definitions:
+  caches:
+    sonar: ~/.sonar`,
+  [BuildTools.DotNet]: (
+    branchesEnabled,
+    projectKey
+  ) => `image: mcr.microsoft.com/dotnet/core/sdk:latest
+     
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - dotnetcore
+            - sonar
+          script:
+            - apt-get update
+            - apt-get install --yes openjdk-11-jre
+            - dotnet tool install --global dotnet-sonarscanner
+            - export PATH="$PATH:/root/.dotnet/tools"
+            - dotnet sonarscanner begin /k:"${projectKey}" /d:"sonar.login=\${SONAR_TOKEN}"  /d:"sonar.host.url=\${SONAR_HOST_URL}"
+            - dotnet build 
+            - dotnet sonarscanner end /d:"sonar.login=\${SONAR_TOKEN}"
+            ${
+              branchesEnabled
+                ? `
+  pull-requests:
+    '**':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - dotnetcore
+            - sonar
+          script:
+            - apt-get update
+            - apt-get install --yes openjdk-11-jre
+            - dotnet tool install --global dotnet-sonarscanner
+            - export PATH="$PATH:/root/.dotnet/tools"
+            - dotnet sonarscanner begin /k:"${projectKey}" /d:"sonar.login=\${SONAR_TOKEN}"  /d:"sonar.host.url=\${SONAR_HOST_URL}"
+            - dotnet build 
+            - dotnet sonarscanner end /d:"sonar.login=\${SONAR_TOKEN}"
+                `
+                : ''
+            }  
+definitions:
+  caches:
+    sonar: ~/.sonar`,
+  [BuildTools.Other]: branchesEnabled => `image: maven:3.3.9
+
+clone:
+  depth: full
+
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          script:
+            - pipe: sonarsource/sonarqube-scan:1.0.0
+              variables:
+                SONAR_HOST_URL: \${SONAR_HOST_URL} # Get the value from the repository/workspace variable.
+                SONAR_TOKEN: \${SONAR_TOKEN} # Get the value from the repository/workspace variable. You shouldn't set secret in clear text here.
+${
+  branchesEnabled
+    ? `
+  pull-requests:
+    '**':
+      - step:
+          name: SonarQube analysis
+          script:
+            - pipe: sonarsource/sonarqube-scan:1.0.0
+              variables:
+                SONAR_HOST_URL: \${SONAR_HOST_URL} # Get the value from the repository/workspace variable.
+                SONAR_TOKEN: \${SONAR_TOKEN} # Get the value from the repository/workspace variable. You shouldn't set secret in clear text here.
+`
+    : ''
+}  
+definitions:
+  caches:
+    sonar: ~/.sonar`
+};
+
+export function AnalysisCommand(props: AnalysisCommandProps) {
+  const {
+    buildTool,
+    component,
+    appState: { branchesEnabled }
+  } = props;
+
+  if (!buildTool) {
+    return null;
+  }
+
+  const yamlTemplate = YamlTemplate[buildTool](branchesEnabled, component.key);
+
+  return (
+    <>
+      <PreambuleYaml buildTool={buildTool} component={component} />
+      <CreateYmlFile yamlFileName="bitbucket-pipelines.yml" yamlTemplate={yamlTemplate} />
+    </>
+  );
+}
+
+export default withAppState(AnalysisCommand);

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/BitbucketPipelinesTutorial.tsx

@@ -0,0 +1,77 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2021 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * 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 { translate } from 'sonar-ui-common/helpers/l10n';
+import { AlmSettingsInstance, ProjectAlmBindingResponse } from '../../../types/alm-settings';
+import Step from '../components/Step';
+import YamlFileStep from '../components/YamlFileStep';
+import AnalysisCommand from './AnalysisCommand';
+import RepositoryVariables from './RepositoryVariables';
+
+export enum Steps {
+  REPOSITORY_VARIABLES = 1,
+  YAML = 2
+}
+
+export interface BitbucketPipelinesTutorialProps {
+  almBinding?: AlmSettingsInstance;
+  baseUrl: string;
+  component: T.Component;
+  currentUser: T.LoggedInUser;
+  projectBinding: ProjectAlmBindingResponse;
+}
+
+export default function BitbucketPipelinesTutorial(props: BitbucketPipelinesTutorialProps) {
+  const { almBinding, baseUrl, currentUser, component, projectBinding } = props;
+
+  const [step, setStep] = React.useState<Steps>(Steps.REPOSITORY_VARIABLES);
+  return (
+    <>
+      <Step
+        finished={step > Steps.REPOSITORY_VARIABLES}
+        onOpen={() => setStep(Steps.REPOSITORY_VARIABLES)}
+        open={step === Steps.REPOSITORY_VARIABLES}
+        renderForm={() => (
+          <RepositoryVariables
+            almBinding={almBinding}
+            baseUrl={baseUrl}
+            component={component}
+            currentUser={currentUser}
+            onDone={() => setStep(Steps.YAML)}
+            projectBinding={projectBinding}
+          />
+        )}
+        stepNumber={Steps.REPOSITORY_VARIABLES}
+        stepTitle={translate('onboarding.tutorial.with.bitbucket_pipelines.create_secret.title')}
+      />
+      <Step
+        onOpen={() => setStep(Steps.YAML)}
+        open={step === Steps.YAML}
+        renderForm={() => (
+          <YamlFileStep>
+            {buildTool => <AnalysisCommand buildTool={buildTool} component={component} />}
+          </YamlFileStep>
+        )}
+        stepNumber={Steps.YAML}
+        stepTitle={translate('onboarding.tutorial.with.bitbucket_pipelines.yaml.title')}
+      />
+    </>
+  );
+}

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/PreambuleYaml.tsx

@@ -0,0 +1,79 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2021 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * 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 { FormattedMessage } from 'react-intl';
+import { ClipboardIconButton } from 'sonar-ui-common/components/controls/clipboard';
+import { translate } from 'sonar-ui-common/helpers/l10n';
+import CodeSnippet from '../../common/CodeSnippet';
+import DefaultProjectKey from '../components/DefaultProjectKey';
+import { BuildTools } from '../types';
+import { buildGradleSnippet, mavenPomSnippet } from '../utils';
+
+export interface PreambuleYamlProps {
+  buildTool: BuildTools;
+  component: T.Component;
+}
+
+export function PreambuleYaml(props: PreambuleYamlProps) {
+  const { buildTool, component } = props;
+  switch (buildTool) {
+    case BuildTools.Gradle:
+      return (
+        <li className="abs-width-600">
+          <FormattedMessage
+            defaultMessage={translate('onboarding.tutorial.with.yaml.gradle')}
+            id="onboarding.tutorial.with.yaml.gradle"
+            values={{
+              gradle: (
+                <>
+                  <code className="rule">build.gradle</code>
+                  <ClipboardIconButton copyValue="build.gradle" />
+                </>
+              ),
+              sq: <code className="rule">org.sonarqube</code>
+            }}
+          />
+          <CodeSnippet snippet={buildGradleSnippet(component.key)} />
+        </li>
+      );
+    case BuildTools.Maven:
+      return (
+        <li className="abs-width-600">
+          <FormattedMessage
+            defaultMessage={translate('onboarding.tutorial.with.yaml.maven.pom')}
+            id="onboarding.tutorial.with.yaml.maven.pom"
+            values={{
+              pom: (
+                <>
+                  <code className="rule">pom.xml</code>
+                  <ClipboardIconButton copyValue="pom.xml" />
+                </>
+              )
+            }}
+          />
+          <CodeSnippet snippet={mavenPomSnippet(component.key)} />
+        </li>
+      );
+    case BuildTools.Other:
+      return <DefaultProjectKey component={component} />;
+    default:
+      return null;
+  }
+}

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/RepositoryVariables.tsx

@@ -0,0 +1,119 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2021 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * 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 { FormattedMessage } from 'react-intl';
+import { Button } from 'sonar-ui-common/components/controls/buttons';
+import { ClipboardIconButton } from 'sonar-ui-common/components/controls/clipboard';
+import { translate } from 'sonar-ui-common/helpers/l10n';
+import { AlmSettingsInstance, ProjectAlmBindingResponse } from '../../../types/alm-settings';
+import SentenceWithHighlights from '../components/SentenceWithHighlights';
+import TokenStepGenerator from '../components/TokenStepGenerator';
+
+export interface RepositoryVariablesProps {
+  almBinding?: AlmSettingsInstance;
+  baseUrl: string;
+  component: T.Component;
+  currentUser: T.LoggedInUser;
+  onDone: () => void;
+  projectBinding: ProjectAlmBindingResponse;
+}
+
+export default function RepositoryVariables(props: RepositoryVariablesProps) {
+  const { almBinding, baseUrl, component, currentUser, projectBinding } = props;
+  return (
+    <div className="boxed-group-inner">
+      <p className="big-spacer-bottom">
+        <FormattedMessage
+          defaultMessage={translate('onboarding.tutorial.with.bitbucket_pipelines.variables.intro')}
+          id="onboarding.tutorial.with.bitbucket_pipelines.variables.intro"
+          values={{
+            repository_variables: almBinding?.url ? (
+              <a
+                href={`${almBinding.url}/${projectBinding.slug}/admin/addon/admin/pipelines/repository-variables`}
+                target="_blank"
+                rel="noopener noreferrer">
+                {translate('onboarding.tutorial.with.bitbucket_pipelines.variables.intro.link')}
+              </a>
+            ) : (
+              <b>
+                {translate('onboarding.tutorial.with.bitbucket_pipelines.variables.intro.link')}
+              </b>
+            )
+          }}
+        />
+      </p>
+      <ol className="list-styled">
+        <li>
+          <SentenceWithHighlights
+            translationKey="onboarding.tutorial.with.bitbucket_pipelines.variables.name"
+            highlightKeys={['name']}
+          />
+          <code className="rule little-spacer-left">SONAR_TOKEN</code>
+          <ClipboardIconButton copyValue="SONAR_TOKEN" />
+        </li>
+        <TokenStepGenerator component={component} currentUser={currentUser} />
+        <li>
+          <SentenceWithHighlights
+            translationKey="onboarding.tutorial.with.bitbucket_pipelines.variables.secured"
+            highlightKeys={['secured']}
+          />
+        </li>
+        <li>
+          <SentenceWithHighlights
+            translationKey="onboarding.tutorial.with.bitbucket_pipelines.variables.add"
+            highlightKeys={['add']}
+          />
+        </li>
+      </ol>
+
+      <hr className="no-horizontal-margins" />
+
+      <ol className="list-styled big-spacer-top big-spacer-bottom">
+        <li>
+          <SentenceWithHighlights
+            translationKey="onboarding.tutorial.with.bitbucket_pipelines.variables.name"
+            highlightKeys={['name']}
+          />
+
+          <code className="rule little-spacer-left">SONAR_HOST_URL</code>
+          <ClipboardIconButton copyValue="SONAR_HOST_URL" />
+        </li>
+        <li className="big-spacer-bottom">
+          <FormattedMessage
+            defaultMessage={translate('onboarding.tutorial.env_variables')}
+            id="onboarding.tutorial.env_variables"
+            values={{
+              extra: <ClipboardIconButton copyValue={baseUrl} />,
+              field: <strong>{translate('onboarding.tutorial.env_variables.field')}</strong>,
+              value: <code className="rule">{baseUrl}</code>
+            }}
+          />
+        </li>
+        <li>
+          <SentenceWithHighlights
+            translationKey="onboarding.tutorial.with.bitbucket_pipelines.variables.add"
+            highlightKeys={['add']}
+          />
+        </li>
+      </ol>
+      <Button onClick={props.onDone}>{translate('continue')}</Button>
+    </div>
+  );
+}

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/__tests__/AnalysisCommand-test.tsx

@@ -0,0 +1,45 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2021 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import { shallow } from 'enzyme';
+import * as React from 'react';
+import { mockAppState, mockComponent } from '../../../../helpers/testMocks';
+import { BuildTools } from '../../types';
+import { AnalysisCommand, AnalysisCommandProps } from '../AnalysisCommand';
+
+it.each([[BuildTools.DotNet], [BuildTools.Gradle], [BuildTools.Maven], [BuildTools.Other]])(
+  'should render correctly for %s',
+  buildTool => {
+    expect(shallowRender({ buildTool })).toMatchSnapshot();
+    expect(
+      shallowRender({ appState: mockAppState({ branchesEnabled: true }), buildTool })
+    ).toMatchSnapshot('with branch enabled');
+  }
+);
+
+function shallowRender(props: Partial<AnalysisCommandProps> = {}) {
+  return shallow<AnalysisCommandProps>(
+    <AnalysisCommand
+      appState={mockAppState()}
+      buildTool={BuildTools.DotNet}
+      component={mockComponent()}
+      {...props}
+    />
+  );
+}

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/__tests__/BitbucketPipelinesTutorial-test.tsx

@@ -0,0 +1,51 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2021 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import { shallow } from 'enzyme';
+import * as React from 'react';
+import {
+  mockAlmSettingsInstance,
+  mockProjectBitbucketCloudBindingResponse
+} from '../../../../helpers/mocks/alm-settings';
+import { mockComponent, mockLoggedInUser } from '../../../../helpers/testMocks';
+import Step from '../../components/Step';
+import BitbucketPipelinesTutorial, {
+  BitbucketPipelinesTutorialProps
+} from '../BitbucketPipelinesTutorial';
+
+it('should render correctly', () => {
+  const wrapper = shallowRender();
+  expect(wrapper).toMatchSnapshot('For variable steps');
+  const stepYaml = wrapper.find(Step).at(1);
+  stepYaml.simulate('open');
+  expect(wrapper).toMatchSnapshot('For yaml steps');
+});
+
+function shallowRender(props: Partial<BitbucketPipelinesTutorialProps> = {}) {
+  return shallow<BitbucketPipelinesTutorialProps>(
+    <BitbucketPipelinesTutorial
+      almBinding={mockAlmSettingsInstance()}
+      baseUrl="test"
+      currentUser={mockLoggedInUser()}
+      component={mockComponent()}
+      projectBinding={mockProjectBitbucketCloudBindingResponse()}
+      {...props}
+    />
+  );
+}

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/__tests__/PreambuleYaml-test.tsx

@@ -0,0 +1,37 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2021 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import { shallow } from 'enzyme';
+import * as React from 'react';
+import { mockComponent } from '../../../../helpers/testMocks';
+import { BuildTools } from '../../types';
+import { PreambuleYaml, PreambuleYamlProps } from '../PreambuleYaml';
+
+it.each([[BuildTools.DotNet], [BuildTools.Gradle], [BuildTools.Maven], [BuildTools.Other]])(
+  'should render correctly for %s',
+  buildTool => {
+    expect(shallowRender({ buildTool })).toMatchSnapshot();
+  }
+);
+
+function shallowRender(props: Partial<PreambuleYamlProps> = {}) {
+  return shallow<PreambuleYamlProps>(
+    <PreambuleYaml buildTool={BuildTools.DotNet} component={mockComponent()} {...props} />
+  );
+}

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/__tests__/RepositoryVariables-test.tsx

@@ -0,0 +1,45 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2021 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import { shallow } from 'enzyme';
+import * as React from 'react';
+import {
+  mockAlmSettingsInstance,
+  mockProjectBitbucketCloudBindingResponse
+} from '../../../../helpers/mocks/alm-settings';
+import { mockComponent, mockLoggedInUser } from '../../../../helpers/testMocks';
+import RepositoryVariables, { RepositoryVariablesProps } from '../RepositoryVariables';
+
+it('should render correctly', () => {
+  expect(shallowRender()).toMatchSnapshot();
+});
+
+function shallowRender(props: Partial<RepositoryVariablesProps> = {}) {
+  return shallow<RepositoryVariablesProps>(
+    <RepositoryVariables
+      almBinding={mockAlmSettingsInstance()}
+      currentUser={mockLoggedInUser()}
+      baseUrl="test"
+      onDone={jest.fn()}
+      component={mockComponent()}
+      projectBinding={mockProjectBitbucketCloudBindingResponse()}
+      {...props}
+    />
+  );
+}

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/__tests__/__snapshots__/AnalysisCommand-test.tsx.snap

@@ -0,0 +1,469 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render correctly for dotnet 1`] = `
+<Fragment>
+  <PreambuleYaml
+    buildTool="dotnet"
+    component={
+      Object {
+        "breadcrumbs": Array [],
+        "key": "my-project",
+        "name": "MyProject",
+        "qualifier": "TRK",
+        "qualityGate": Object {
+          "isDefault": true,
+          "key": "30",
+          "name": "Sonar way",
+        },
+        "qualityProfiles": Array [
+          Object {
+            "deleted": false,
+            "key": "my-qp",
+            "language": "ts",
+            "name": "Sonar way",
+          },
+        ],
+        "tags": Array [],
+      }
+    }
+  />
+  <CreateYmlFile
+    yamlFileName="bitbucket-pipelines.yml"
+    yamlTemplate="image: mcr.microsoft.com/dotnet/core/sdk:latest
+     
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - dotnetcore
+            - sonar
+          script:
+            - apt-get update
+            - apt-get install --yes openjdk-11-jre
+            - dotnet tool install --global dotnet-sonarscanner
+            - export PATH=\\"$PATH:/root/.dotnet/tools\\"
+            - dotnet sonarscanner begin /k:\\"my-project\\" /d:\\"sonar.login=\${SONAR_TOKEN}\\"  /d:\\"sonar.host.url=\${SONAR_HOST_URL}\\"
+            - dotnet build 
+            - dotnet sonarscanner end /d:\\"sonar.login=\${SONAR_TOKEN}\\"
+              
+definitions:
+  caches:
+    sonar: ~/.sonar"
+  />
+</Fragment>
+`;
+
+exports[`should render correctly for dotnet: with branch enabled 1`] = `
+<Fragment>
+  <PreambuleYaml
+    buildTool="dotnet"
+    component={
+      Object {
+        "breadcrumbs": Array [],
+        "key": "my-project",
+        "name": "MyProject",
+        "qualifier": "TRK",
+        "qualityGate": Object {
+          "isDefault": true,
+          "key": "30",
+          "name": "Sonar way",
+        },
+        "qualityProfiles": Array [
+          Object {
+            "deleted": false,
+            "key": "my-qp",
+            "language": "ts",
+            "name": "Sonar way",
+          },
+        ],
+        "tags": Array [],
+      }
+    }
+  />
+  <CreateYmlFile
+    yamlFileName="bitbucket-pipelines.yml"
+    yamlTemplate="image: mcr.microsoft.com/dotnet/core/sdk:latest
+     
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - dotnetcore
+            - sonar
+          script:
+            - apt-get update
+            - apt-get install --yes openjdk-11-jre
+            - dotnet tool install --global dotnet-sonarscanner
+            - export PATH=\\"$PATH:/root/.dotnet/tools\\"
+            - dotnet sonarscanner begin /k:\\"my-project\\" /d:\\"sonar.login=\${SONAR_TOKEN}\\"  /d:\\"sonar.host.url=\${SONAR_HOST_URL}\\"
+            - dotnet build 
+            - dotnet sonarscanner end /d:\\"sonar.login=\${SONAR_TOKEN}\\"
+            
+  pull-requests:
+    '**':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - dotnetcore
+            - sonar
+          script:
+            - apt-get update
+            - apt-get install --yes openjdk-11-jre
+            - dotnet tool install --global dotnet-sonarscanner
+            - export PATH=\\"$PATH:/root/.dotnet/tools\\"
+            - dotnet sonarscanner begin /k:\\"my-project\\" /d:\\"sonar.login=\${SONAR_TOKEN}\\"  /d:\\"sonar.host.url=\${SONAR_HOST_URL}\\"
+            - dotnet build 
+            - dotnet sonarscanner end /d:\\"sonar.login=\${SONAR_TOKEN}\\"
+                  
+definitions:
+  caches:
+    sonar: ~/.sonar"
+  />
+</Fragment>
+`;
+
+exports[`should render correctly for gradle 1`] = `
+<Fragment>
+  <PreambuleYaml
+    buildTool="gradle"
+    component={
+      Object {
+        "breadcrumbs": Array [],
+        "key": "my-project",
+        "name": "MyProject",
+        "qualifier": "TRK",
+        "qualityGate": Object {
+          "isDefault": true,
+          "key": "30",
+          "name": "Sonar way",
+        },
+        "qualityProfiles": Array [
+          Object {
+            "deleted": false,
+            "key": "my-qp",
+            "language": "ts",
+            "name": "Sonar way",
+          },
+        ],
+        "tags": Array [],
+      }
+    }
+  />
+  <CreateYmlFile
+    yamlFileName="bitbucket-pipelines.yml"
+    yamlTemplate="image: openjdk:8
+
+clone:
+  depth: full
+  
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - gradle
+            - sonar
+          script:
+            - bash ./gradlew sonarqube
+
+definitions:
+  caches:
+    sonar: ~/.sonar"
+  />
+</Fragment>
+`;
+
+exports[`should render correctly for gradle: with branch enabled 1`] = `
+<Fragment>
+  <PreambuleYaml
+    buildTool="gradle"
+    component={
+      Object {
+        "breadcrumbs": Array [],
+        "key": "my-project",
+        "name": "MyProject",
+        "qualifier": "TRK",
+        "qualityGate": Object {
+          "isDefault": true,
+          "key": "30",
+          "name": "Sonar way",
+        },
+        "qualityProfiles": Array [
+          Object {
+            "deleted": false,
+            "key": "my-qp",
+            "language": "ts",
+            "name": "Sonar way",
+          },
+        ],
+        "tags": Array [],
+      }
+    }
+  />
+  <CreateYmlFile
+    yamlFileName="bitbucket-pipelines.yml"
+    yamlTemplate="image: openjdk:8
+
+clone:
+  depth: full
+  
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - gradle
+            - sonar
+          script:
+            - bash ./gradlew sonarqube
+
+  pull-requests:
+    '**':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - gradle
+            - sonar
+          script:
+            - bash ./gradlew sonarqube
+
+definitions:
+  caches:
+    sonar: ~/.sonar"
+  />
+</Fragment>
+`;
+
+exports[`should render correctly for maven 1`] = `
+<Fragment>
+  <PreambuleYaml
+    buildTool="maven"
+    component={
+      Object {
+        "breadcrumbs": Array [],
+        "key": "my-project",
+        "name": "MyProject",
+        "qualifier": "TRK",
+        "qualityGate": Object {
+          "isDefault": true,
+          "key": "30",
+          "name": "Sonar way",
+        },
+        "qualityProfiles": Array [
+          Object {
+            "deleted": false,
+            "key": "my-qp",
+            "language": "ts",
+            "name": "Sonar way",
+          },
+        ],
+        "tags": Array [],
+      }
+    }
+  />
+  <CreateYmlFile
+    yamlFileName="bitbucket-pipelines.yml"
+    yamlTemplate="image: maven:3.3.9
+
+clone:
+  depth: full
+  
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - maven
+            - sonar
+          script:
+            - mvn verify sonar:sonar
+  
+definitions:
+  caches:
+    sonar: ~/.sonar"
+  />
+</Fragment>
+`;
+
+exports[`should render correctly for maven: with branch enabled 1`] = `
+<Fragment>
+  <PreambuleYaml
+    buildTool="maven"
+    component={
+      Object {
+        "breadcrumbs": Array [],
+        "key": "my-project",
+        "name": "MyProject",
+        "qualifier": "TRK",
+        "qualityGate": Object {
+          "isDefault": true,
+          "key": "30",
+          "name": "Sonar way",
+        },
+        "qualityProfiles": Array [
+          Object {
+            "deleted": false,
+            "key": "my-qp",
+            "language": "ts",
+            "name": "Sonar way",
+          },
+        ],
+        "tags": Array [],
+      }
+    }
+  />
+  <CreateYmlFile
+    yamlFileName="bitbucket-pipelines.yml"
+    yamlTemplate="image: maven:3.3.9
+
+clone:
+  depth: full
+  
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - maven
+            - sonar
+          script:
+            - mvn verify sonar:sonar
+
+  pull-requests:
+    '**':
+      - step:
+          name: SonarQube analysis
+          caches:
+            - maven
+            - sonar
+          script:
+            - mvn verify sonar:sonar
+  
+definitions:
+  caches:
+    sonar: ~/.sonar"
+  />
+</Fragment>
+`;
+
+exports[`should render correctly for other 1`] = `
+<Fragment>
+  <PreambuleYaml
+    buildTool="other"
+    component={
+      Object {
+        "breadcrumbs": Array [],
+        "key": "my-project",
+        "name": "MyProject",
+        "qualifier": "TRK",
+        "qualityGate": Object {
+          "isDefault": true,
+          "key": "30",
+          "name": "Sonar way",
+        },
+        "qualityProfiles": Array [
+          Object {
+            "deleted": false,
+            "key": "my-qp",
+            "language": "ts",
+            "name": "Sonar way",
+          },
+        ],
+        "tags": Array [],
+      }
+    }
+  />
+  <CreateYmlFile
+    yamlFileName="bitbucket-pipelines.yml"
+    yamlTemplate="image: maven:3.3.9
+
+clone:
+  depth: full
+
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          script:
+            - pipe: sonarsource/sonarqube-scan:1.0.0
+              variables:
+                SONAR_HOST_URL: \${SONAR_HOST_URL} # Get the value from the repository/workspace variable.
+                SONAR_TOKEN: \${SONAR_TOKEN} # Get the value from the repository/workspace variable. You shouldn't set secret in clear text here.
+  
+definitions:
+  caches:
+    sonar: ~/.sonar"
+  />
+</Fragment>
+`;
+
+exports[`should render correctly for other: with branch enabled 1`] = `
+<Fragment>
+  <PreambuleYaml
+    buildTool="other"
+    component={
+      Object {
+        "breadcrumbs": Array [],
+        "key": "my-project",
+        "name": "MyProject",
+        "qualifier": "TRK",
+        "qualityGate": Object {
+          "isDefault": true,
+          "key": "30",
+          "name": "Sonar way",
+        },
+        "qualityProfiles": Array [
+          Object {
+            "deleted": false,
+            "key": "my-qp",
+            "language": "ts",
+            "name": "Sonar way",
+          },
+        ],
+        "tags": Array [],
+      }
+    }
+  />
+  <CreateYmlFile
+    yamlFileName="bitbucket-pipelines.yml"
+    yamlTemplate="image: maven:3.3.9
+
+clone:
+  depth: full
+
+pipelines:
+  branches:
+    '{master}':
+      - step:
+          name: SonarQube analysis
+          script:
+            - pipe: sonarsource/sonarqube-scan:1.0.0
+              variables:
+                SONAR_HOST_URL: \${SONAR_HOST_URL} # Get the value from the repository/workspace variable.
+                SONAR_TOKEN: \${SONAR_TOKEN} # Get the value from the repository/workspace variable. You shouldn't set secret in clear text here.
+
+  pull-requests:
+    '**':
+      - step:
+          name: SonarQube analysis
+          script:
+            - pipe: sonarsource/sonarqube-scan:1.0.0
+              variables:
+                SONAR_HOST_URL: \${SONAR_HOST_URL} # Get the value from the repository/workspace variable.
+                SONAR_TOKEN: \${SONAR_TOKEN} # Get the value from the repository/workspace variable. You shouldn't set secret in clear text here.
+  
+definitions:
+  caches:
+    sonar: ~/.sonar"
+  />
+</Fragment>
+`;

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/__tests__/__snapshots__/BitbucketPipelinesTutorial-test.tsx.snap

@@ -0,0 +1,41 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render correctly: For variable steps 1`] = `
+<Fragment>
+  <Step
+    finished={false}
+    onOpen={[Function]}
+    open={true}
+    renderForm={[Function]}
+    stepNumber={1}
+    stepTitle="onboarding.tutorial.with.bitbucket_pipelines.create_secret.title"
+  />
+  <Step
+    onOpen={[Function]}
+    open={false}
+    renderForm={[Function]}
+    stepNumber={2}
+    stepTitle="onboarding.tutorial.with.bitbucket_pipelines.yaml.title"
+  />
+</Fragment>
+`;
+
+exports[`should render correctly: For yaml steps 1`] = `
+<Fragment>
+  <Step
+    finished={true}
+    onOpen={[Function]}
+    open={false}
+    renderForm={[Function]}
+    stepNumber={1}
+    stepTitle="onboarding.tutorial.with.bitbucket_pipelines.create_secret.title"
+  />
+  <Step
+    onOpen={[Function]}
+    open={true}
+    renderForm={[Function]}
+    stepNumber={2}
+    stepTitle="onboarding.tutorial.with.bitbucket_pipelines.yaml.title"
+  />
+</Fragment>
+`;

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/__tests__/__snapshots__/PreambuleYaml-test.tsx.snap

@@ -0,0 +1,101 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render correctly for dotnet 1`] = `""`;
+
+exports[`should render correctly for gradle 1`] = `
+<li
+  className="abs-width-600"
+>
+  <FormattedMessage
+    defaultMessage="onboarding.tutorial.with.yaml.gradle"
+    id="onboarding.tutorial.with.yaml.gradle"
+    values={
+      Object {
+        "gradle": <React.Fragment>
+          <code
+            className="rule"
+          >
+            build.gradle
+          </code>
+          <ClipboardIconButton
+            copyValue="build.gradle"
+          />
+        </React.Fragment>,
+        "sq": <code
+          className="rule"
+        >
+          org.sonarqube
+        </code>,
+      }
+    }
+  />
+  <CodeSnippet
+    snippet="plugins {
+  id \\"org.sonarqube\\" version \\"3.2.0\\"
+}
+
+sonarqube {
+  properties {
+    property \\"sonar.projectKey\\", \\"my-project\\"
+  }
+}"
+  />
+</li>
+`;
+
+exports[`should render correctly for maven 1`] = `
+<li
+  className="abs-width-600"
+>
+  <FormattedMessage
+    defaultMessage="onboarding.tutorial.with.yaml.maven.pom"
+    id="onboarding.tutorial.with.yaml.maven.pom"
+    values={
+      Object {
+        "pom": <React.Fragment>
+          <code
+            className="rule"
+          >
+            pom.xml
+          </code>
+          <ClipboardIconButton
+            copyValue="pom.xml"
+          />
+        </React.Fragment>,
+      }
+    }
+  />
+  <CodeSnippet
+    snippet="<properties>
+  <sonar.projectKey>my-project</sonar.projectKey>
+</properties>"
+  />
+</li>
+`;
+
+exports[`should render correctly for other 1`] = `
+<DefaultProjectKey
+  component={
+    Object {
+      "breadcrumbs": Array [],
+      "key": "my-project",
+      "name": "MyProject",
+      "qualifier": "TRK",
+      "qualityGate": Object {
+        "isDefault": true,
+        "key": "30",
+        "name": "Sonar way",
+      },
+      "qualityProfiles": Array [
+        Object {
+          "deleted": false,
+          "key": "my-qp",
+          "language": "ts",
+          "name": "Sonar way",
+        },
+      ],
+      "tags": Array [],
+    }
+  }
+/>
+`;

server/sonar-web/src/main/js/components/tutorials/bitbucket-pipelines/__tests__/__snapshots__/RepositoryVariables-test.tsx.snap

@@ -0,0 +1,161 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render correctly 1`] = `
+<div
+  className="boxed-group-inner"
+>
+  <p
+    className="big-spacer-bottom"
+  >
+    <FormattedMessage
+      defaultMessage="onboarding.tutorial.with.bitbucket_pipelines.variables.intro"
+      id="onboarding.tutorial.with.bitbucket_pipelines.variables.intro"
+      values={
+        Object {
+          "repository_variables": <b>
+            onboarding.tutorial.with.bitbucket_pipelines.variables.intro.link
+          </b>,
+        }
+      }
+    />
+  </p>
+  <ol
+    className="list-styled"
+  >
+    <li>
+      <SentenceWithHighlights
+        highlightKeys={
+          Array [
+            "name",
+          ]
+        }
+        translationKey="onboarding.tutorial.with.bitbucket_pipelines.variables.name"
+      />
+      <code
+        className="rule little-spacer-left"
+      >
+        SONAR_TOKEN
+      </code>
+      <ClipboardIconButton
+        copyValue="SONAR_TOKEN"
+      />
+    </li>
+    <TokenStepGenerator
+      component={
+        Object {
+          "breadcrumbs": Array [],
+          "key": "my-project",
+          "name": "MyProject",
+          "qualifier": "TRK",
+          "qualityGate": Object {
+            "isDefault": true,
+            "key": "30",
+            "name": "Sonar way",
+          },
+          "qualityProfiles": Array [
+            Object {
+              "deleted": false,
+              "key": "my-qp",
+              "language": "ts",
+              "name": "Sonar way",
+            },
+          ],
+          "tags": Array [],
+        }
+      }
+      currentUser={
+        Object {
+          "groups": Array [],
+          "isLoggedIn": true,
+          "login": "luke",
+          "name": "Skywalker",
+          "scmAccounts": Array [],
+        }
+      }
+    />
+    <li>
+      <SentenceWithHighlights
+        highlightKeys={
+          Array [
+            "secured",
+          ]
+        }
+        translationKey="onboarding.tutorial.with.bitbucket_pipelines.variables.secured"
+      />
+    </li>
+    <li>
+      <SentenceWithHighlights
+        highlightKeys={
+          Array [
+            "add",
+          ]
+        }
+        translationKey="onboarding.tutorial.with.bitbucket_pipelines.variables.add"
+      />
+    </li>
+  </ol>
+  <hr
+    className="no-horizontal-margins"
+  />
+  <ol
+    className="list-styled big-spacer-top big-spacer-bottom"
+  >
+    <li>
+      <SentenceWithHighlights
+        highlightKeys={
+          Array [
+            "name",
+          ]
+        }
+        translationKey="onboarding.tutorial.with.bitbucket_pipelines.variables.name"
+      />
+      <code
+        className="rule little-spacer-left"
+      >
+        SONAR_HOST_URL
+      </code>
+      <ClipboardIconButton
+        copyValue="SONAR_HOST_URL"
+      />
+    </li>
+    <li
+      className="big-spacer-bottom"
+    >
+      <FormattedMessage
+        defaultMessage="onboarding.tutorial.env_variables"
+        id="onboarding.tutorial.env_variables"
+        values={
+          Object {
+            "extra": <ClipboardIconButton
+              copyValue="test"
+            />,
+            "field": <strong>
+              onboarding.tutorial.env_variables.field
+            </strong>,
+            "value": <code
+              className="rule"
+            >
+              test
+            </code>,
+          }
+        }
+      />
+    </li>
+    <li>
+      <SentenceWithHighlights
+        highlightKeys={
+          Array [
+            "add",
+          ]
+        }
+        translationKey="onboarding.tutorial.with.bitbucket_pipelines.variables.add"
+      />
+    </li>
+  </ol>
+  <Button
+    onClick={[MockFunction]}
+  >
+    continue
+  </Button>
+</div>
+`;

server/sonar-web/src/main/js/components/tutorials/github-action/commands/CreateYmlFile.tsx → server/sonar-web/src/main/js/components/tutorials/components/CreateYmlFile.tsx

@@ -21,14 +21,15 @@ import * as React from 'react';
 import { FormattedMessage } from 'react-intl';
 import { ClipboardIconButton } from 'sonar-ui-common/components/controls/clipboard';
 import { translate } from 'sonar-ui-common/helpers/l10n';
-import CodeSnippet from '../../../common/CodeSnippet';
+import CodeSnippet from '../../common/CodeSnippet';
 
 export interface CreateYmlFileProps {
+  yamlFileName: string;
   yamlTemplate: string;
 }
 
 export default function CreateYmlFile(props: CreateYmlFileProps) {
-  const { yamlTemplate } = props;
+  const { yamlTemplate, yamlFileName } = props;
   return (
     <li className="abs-width-800">
       <FormattedMessage
@@ -37,8 +38,8 @@ export default function CreateYmlFile(props: CreateYmlFileProps) {
         values={{
           file: (
             <>
-              <code className="rule">.github/workflows/build.yml</code>
-              <ClipboardIconButton copyValue=".github/workflows/build.yml" />
+              <code className="rule">{yamlFileName}</code>
+              <ClipboardIconButton copyValue={yamlFileName} />
             </>
           )
         }}

server/sonar-web/src/main/js/components/tutorials/github-action/YamlFileStep.tsx → server/sonar-web/src/main/js/components/tutorials/components/YamlFileStep.tsx

@@ -19,17 +19,22 @@
  */
 import * as React from 'react';
 import { translate } from 'sonar-ui-common/helpers/l10n';
-import AllSet from '../components/AllSet';
 import RenderOptions from '../components/RenderOptions';
 import { BuildTools } from '../types';
-import AnalysisCommand from './AnalysisCommand';
+import AllSet from './AllSet';
 
 export interface YamlFileStepProps {
+  children?: (buildTool?: BuildTools) => React.ReactElement<{}>;
+}
+
+export interface AnalysisCommandProps {
+  appState: T.AppState;
+  buildTool?: BuildTools;
   component: T.Component;
 }
 
 export default function YamlFileStep(props: YamlFileStepProps) {
-  const { component } = props;
+  const { children } = props;
   const buildTools = [BuildTools.Maven, BuildTools.Gradle, BuildTools.DotNet, BuildTools.Other];
   const [buildToolSelected, setBuildToolSelected] = React.useState<BuildTools>();
 
@@ -47,7 +52,7 @@ export default function YamlFileStep(props: YamlFileStepProps) {
             optionLabelKey="onboarding.build"
           />
         </li>
-        <AnalysisCommand buildTool={buildToolSelected} component={component} />
+        {children && children(buildToolSelected)}
       </ol>
       {buildToolSelected !== undefined && (
         <>

server/sonar-web/src/main/js/components/tutorials/github-action/commands/__tests__/CreateYmlFile-test.tsx → server/sonar-web/src/main/js/components/tutorials/components/__tests__/CreateYmlFile-test.tsx

@@ -19,13 +19,15 @@
  */
 import { shallow } from 'enzyme';
 import * as React from 'react';
+import { GradleProps } from '../../github-action/commands/Gradle';
 import CreateYmlFile, { CreateYmlFileProps } from '../CreateYmlFile';
-import { GradleProps } from '../Gradle';
 
 it('should render correctly', () => {
   expect(shallowRender()).toMatchSnapshot();
 });
 
 function shallowRender(props: Partial<CreateYmlFileProps> = {}) {
-  return shallow<GradleProps>(<CreateYmlFile yamlTemplate="temaplate" {...props} />);
+  return shallow<GradleProps>(
+    <CreateYmlFile yamlFileName="test.yml" yamlTemplate="temaplate" {...props} />
+  );
 }

server/sonar-web/src/main/js/components/tutorials/github-action/__tests__/YamlFileStep-test.tsx → server/sonar-web/src/main/js/components/tutorials/components/__tests__/YamlFileStep-test.tsx

@@ -19,7 +19,6 @@
  */
 import { shallow } from 'enzyme';
 import * as React from 'react';
-import { mockComponent } from '../../../../helpers/testMocks';
 import YamlFileStep, { YamlFileStepProps } from '../YamlFileStep';
 
 it('should render correctly', () => {
@@ -27,5 +26,5 @@ it('should render correctly', () => {
 });
 
 function shallowRender(props: Partial<YamlFileStepProps> = {}) {
-  return shallow<YamlFileStepProps>(<YamlFileStep component={mockComponent()} {...props} />);
+  return shallow<YamlFileStepProps>(<YamlFileStep {...props} />);
 }

server/sonar-web/src/main/js/components/tutorials/github-action/commands/__tests__/__snapshots__/CreateYmlFile-test.tsx.snap → server/sonar-web/src/main/js/components/tutorials/components/__tests__/__snapshots__/CreateYmlFile-test.tsx.snap

@@ -13,10 +13,10 @@ exports[`should render correctly 1`] = `
           <code
             className="rule"
           >
-            .github/workflows/build.yml
+            test.yml
           </code>
           <ClipboardIconButton
-            copyValue=".github/workflows/build.yml"
+            copyValue="test.yml"
           />
         </React.Fragment>,
       }

server/sonar-web/src/main/js/components/tutorials/components/__tests__/__snapshots__/YamlFileStep-test.tsx.snap

@@ -0,0 +1,26 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`should render correctly 1`] = `
+<Fragment>
+  <ol
+    className="list-styled big-spacer-top big-spacer-bottom"
+  >
+    <li>
+      onboarding.build
+      <RenderOptions
+        name="language"
+        onCheck={[Function]}
+        optionLabelKey="onboarding.build"
+        options={
+          Array [
+            "maven",
+            "gradle",
+            "dotnet",
+            "other",
+          ]
+        }
+      />
+    </li>
+  </ol>
+</Fragment>
+`;

server/sonar-web/src/main/js/components/tutorials/github-action/GitHubActionTutorial.tsx

@@ -21,8 +21,9 @@ import * as React from 'react';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 import { AlmSettingsInstance, ProjectAlmBindingResponse } from '../../../types/alm-settings';
 import Step from '../components/Step';
+import YamlFileStep from '../components/YamlFileStep';
+import AnalysisCommand from './AnalysisCommand';
 import SecretStep from './SecretStep';
-import YamlFileStep from './YamlFileStep';
 
 export enum Steps {
   CREATE_SECRET = 1,
@@ -63,7 +64,11 @@ export default function GitHubActionTutorial(props: GitHubActionTutorialProps) {
       <Step
         onOpen={() => setStep(Steps.YAML)}
         open={step === Steps.YAML}
-        renderForm={() => <YamlFileStep component={component} />}
+        renderForm={() => (
+          <YamlFileStep>
+            {buildTool => <AnalysisCommand buildTool={buildTool} component={component} />}
+          </YamlFileStep>
+        )}
         stepNumber={Steps.YAML}
         stepTitle={translate('onboarding.tutorial.with.github_action.yaml.title')}
       />

server/sonar-web/src/main/js/components/tutorials/github-action/__tests__/__snapshots__/YamlFileStep-test.tsx.snap

@@ -1,50 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`should render correctly 1`] = `
-<Fragment>
-  <ol
-    className="list-styled big-spacer-top big-spacer-bottom"
-  >
-    <li>
-      onboarding.build
-      <RenderOptions
-        name="language"
-        onCheck={[Function]}
-        optionLabelKey="onboarding.build"
-        options={
-          Array [
-            "maven",
-            "gradle",
-            "dotnet",
-            "other",
-          ]
-        }
-      />
-    </li>
-    <Connect(withAppState(AnalysisCommand))
-      component={
-        Object {
-          "breadcrumbs": Array [],
-          "key": "my-project",
-          "name": "MyProject",
-          "qualifier": "TRK",
-          "qualityGate": Object {
-            "isDefault": true,
-            "key": "30",
-            "name": "Sonar way",
-          },
-          "qualityProfiles": Array [
-            Object {
-              "deleted": false,
-              "key": "my-qp",
-              "language": "ts",
-              "name": "Sonar way",
-            },
-          ],
-          "tags": Array [],
-        }
-      }
-    />
-  </ol>
-</Fragment>
-`;

server/sonar-web/src/main/js/components/tutorials/github-action/commands/DotNet.tsx

@@ -18,7 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import * as React from 'react';
-import CreateYmlFile from './CreateYmlFile';
+import CreateYmlFile from '../../components/CreateYmlFile';
 
 export interface DotNetProps {
   branchesEnabled?: boolean;
@@ -73,5 +73,10 @@ jobs:
 
 export default function DotNet(props: DotNetProps) {
   const { component, branchesEnabled } = props;
-  return <CreateYmlFile yamlTemplate={dotnetYamlTemplate(component.key, !!branchesEnabled)} />;
+  return (
+    <CreateYmlFile
+      yamlFileName=".github/workflows/build.yml"
+      yamlTemplate={dotnetYamlTemplate(component.key, !!branchesEnabled)}
+    />
+  );
 }

server/sonar-web/src/main/js/components/tutorials/github-action/commands/Gradle.tsx

@@ -22,8 +22,8 @@ import { FormattedMessage } from 'react-intl';
 import { ClipboardIconButton } from 'sonar-ui-common/components/controls/clipboard';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 import CodeSnippet from '../../../common/CodeSnippet';
+import CreateYmlFile from '../../components/CreateYmlFile';
 import { buildGradleSnippet } from '../../utils';
-import CreateYmlFile from './CreateYmlFile';
 
 export interface GradleProps {
   branchesEnabled?: boolean;
@@ -73,8 +73,8 @@ export default function Gradle(props: GradleProps) {
     <>
       <li className="abs-width-600">
         <FormattedMessage
-          defaultMessage={translate('onboarding.tutorial.with.github_action.yaml.gradle')}
-          id="onboarding.tutorial.with.github_action.yaml.gradle"
+          defaultMessage={translate('onboarding.tutorial.with.yaml.gradle')}
+          id="onboarding.tutorial.with.yaml.gradle"
           values={{
             gradle: (
               <>
@@ -87,7 +87,10 @@ export default function Gradle(props: GradleProps) {
         />
         <CodeSnippet snippet={buildGradleSnippet(component.key)} />
       </li>
-      <CreateYmlFile yamlTemplate={gradleYamlTemplate(!!branchesEnabled)} />
+      <CreateYmlFile
+        yamlFileName=".github/workflows/build.yml"
+        yamlTemplate={gradleYamlTemplate(!!branchesEnabled)}
+      />
     </>
   );
 }

server/sonar-web/src/main/js/components/tutorials/github-action/commands/JavaMaven.tsx

@@ -22,8 +22,8 @@ import { FormattedMessage } from 'react-intl';
 import { ClipboardIconButton } from 'sonar-ui-common/components/controls/clipboard';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 import CodeSnippet from '../../../common/CodeSnippet';
+import CreateYmlFile from '../../components/CreateYmlFile';
 import { mavenPomSnippet } from '../../utils';
-import CreateYmlFile from './CreateYmlFile';
 
 export interface JavaMavenProps {
   branchesEnabled?: boolean;
@@ -73,8 +73,8 @@ export default function JavaMaven(props: JavaMavenProps) {
     <>
       <li className="abs-width-600">
         <FormattedMessage
-          defaultMessage={translate('onboarding.tutorial.with.github_action.yaml.maven.pom')}
-          id="onboarding.tutorial.with.github_action.yaml.maven.pom"
+          defaultMessage={translate('onboarding.tutorial.with.yaml.maven.pom')}
+          id="onboarding.tutorial.with.yaml.maven.pom"
           values={{
             pom: (
               <>
@@ -86,7 +86,10 @@ export default function JavaMaven(props: JavaMavenProps) {
         />
         <CodeSnippet snippet={mavenPomSnippet(component.key)} />
       </li>
-      <CreateYmlFile yamlTemplate={mavenYamlTemplte(!!branchesEnabled)} />
+      <CreateYmlFile
+        yamlFileName=".github/workflows/build.yml"
+        yamlTemplate={mavenYamlTemplte(!!branchesEnabled)}
+      />
     </>
   );
 }

server/sonar-web/src/main/js/components/tutorials/github-action/commands/Others.tsx

@@ -18,8 +18,8 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import * as React from 'react';
+import CreateYmlFile from '../../components/CreateYmlFile';
 import DefaultProjectKey from '../../components/DefaultProjectKey';
-import CreateYmlFile from './CreateYmlFile';
 
 export interface OthersProps {
   branchesEnabled?: boolean;
@@ -75,7 +75,10 @@ export default function Others(props: OthersProps) {
   return (
     <>
       <DefaultProjectKey component={component} />
-      <CreateYmlFile yamlTemplate={yamlTemplate(!!branchesEnabled)} />
+      <CreateYmlFile
+        yamlFileName=".github/workflows/build.yml"
+        yamlTemplate={yamlTemplate(!!branchesEnabled)}
+      />
     </>
   );
 }

server/sonar-web/src/main/js/components/tutorials/github-action/commands/__tests__/__snapshots__/DotNet-test.tsx.snap

@@ -2,6 +2,7 @@
 
 exports[`should render correctly 1`] = `
 <CreateYmlFile
+  yamlFileName=".github/workflows/build.yml"
   yamlTemplate="name: Build
 on:
   push:
@@ -53,6 +54,7 @@ jobs:
 
 exports[`should render correctly: without branch enabled 1`] = `
 <CreateYmlFile
+  yamlFileName=".github/workflows/build.yml"
   yamlTemplate="name: Build
 on:
   push:

server/sonar-web/src/main/js/components/tutorials/github-action/commands/__tests__/__snapshots__/Gradle-test.tsx.snap

@@ -6,8 +6,8 @@ exports[`should render correctly 1`] = `
     className="abs-width-600"
   >
     <FormattedMessage
-      defaultMessage="onboarding.tutorial.with.github_action.yaml.gradle"
-      id="onboarding.tutorial.with.github_action.yaml.gradle"
+      defaultMessage="onboarding.tutorial.with.yaml.gradle"
+      id="onboarding.tutorial.with.yaml.gradle"
       values={
         Object {
           "gradle": <React.Fragment>
@@ -41,6 +41,7 @@ sonarqube {
     />
   </li>
   <CreateYmlFile
+    yamlFileName=".github/workflows/build.yml"
     yamlTemplate="name: Build
 on:
   push:
@@ -88,8 +89,8 @@ exports[`should render correctly: without branch enabled 1`] = `
     className="abs-width-600"
   >
     <FormattedMessage
-      defaultMessage="onboarding.tutorial.with.github_action.yaml.gradle"
-      id="onboarding.tutorial.with.github_action.yaml.gradle"
+      defaultMessage="onboarding.tutorial.with.yaml.gradle"
+      id="onboarding.tutorial.with.yaml.gradle"
       values={
         Object {
           "gradle": <React.Fragment>
@@ -123,6 +124,7 @@ sonarqube {
     />
   </li>
   <CreateYmlFile
+    yamlFileName=".github/workflows/build.yml"
     yamlTemplate="name: Build
 on:
   push:

server/sonar-web/src/main/js/components/tutorials/github-action/commands/__tests__/__snapshots__/JavaMaven-test.tsx.snap

@@ -6,8 +6,8 @@ exports[`should render correctly 1`] = `
     className="abs-width-600"
   >
     <FormattedMessage
-      defaultMessage="onboarding.tutorial.with.github_action.yaml.maven.pom"
-      id="onboarding.tutorial.with.github_action.yaml.maven.pom"
+      defaultMessage="onboarding.tutorial.with.yaml.maven.pom"
+      id="onboarding.tutorial.with.yaml.maven.pom"
       values={
         Object {
           "pom": <React.Fragment>
@@ -30,6 +30,7 @@ exports[`should render correctly 1`] = `
     />
   </li>
   <CreateYmlFile
+    yamlFileName=".github/workflows/build.yml"
     yamlTemplate="name: Build
 on:
   push:
@@ -77,8 +78,8 @@ exports[`should render correctly: without branch enabled 1`] = `
     className="abs-width-600"
   >
     <FormattedMessage
-      defaultMessage="onboarding.tutorial.with.github_action.yaml.maven.pom"
-      id="onboarding.tutorial.with.github_action.yaml.maven.pom"
+      defaultMessage="onboarding.tutorial.with.yaml.maven.pom"
+      id="onboarding.tutorial.with.yaml.maven.pom"
       values={
         Object {
           "pom": <React.Fragment>
@@ -101,6 +102,7 @@ exports[`should render correctly: without branch enabled 1`] = `
     />
   </li>
   <CreateYmlFile
+    yamlFileName=".github/workflows/build.yml"
     yamlTemplate="name: Build
 on:
   push:

server/sonar-web/src/main/js/components/tutorials/github-action/commands/__tests__/__snapshots__/Others-test.tsx.snap

@@ -27,6 +27,7 @@ exports[`should render correctly 1`] = `
     }
   />
   <CreateYmlFile
+    yamlFileName=".github/workflows/build.yml"
     yamlTemplate="name: Build
 on:
   push:
@@ -85,6 +86,7 @@ exports[`should render correctly: without branch enabled 1`] = `
     }
   />
   <CreateYmlFile
+    yamlFileName=".github/workflows/build.yml"
     yamlTemplate="name: Build
 on:
   push:

server/sonar-web/src/main/js/components/tutorials/types.ts

@@ -20,6 +20,7 @@
 export enum TutorialModes {
   Manual = 'manual',
   Jenkins = 'jenkins',
+  BitbucketPipelines = 'bitbucket-pipelines',
   GitLabCI = 'gitlab-ci',
   GitHubActions = 'github-actions',
   AzurePipelines = 'azure-pipelines'

sonar-core/src/main/resources/org/sonar/l10n/core.properties

@@ -3435,6 +3435,24 @@ onboarding.tutorial.choose_method.jenkins=With Jenkins
 onboarding.tutorial.choose_method.github_action=With GitHub Actions
 onboarding.tutorial.choose_method.gitlab_ci=With GitLab CI
 onboarding.tutorial.choose_method.azure_pipelines=With Azure Pipelines
+onboarding.tutorial.choose_method.bitbucket_pipelines=With Bitbucket Pipelines
+
+
+onboarding.tutorial.with.yaml.maven.pom=Update your {pom} file with the following properties:
+onboarding.tutorial.with.yaml.gradle=Update your {gradle} file with the {sq} plugin and it's configuration:
+
+
+
+onboarding.tutorial.with.bitbucket_pipelines.create_secret.title=Create repository variables
+onboarding.tutorial.with.bitbucket_pipelines.yaml.title=Create your pipelines builds configuration
+onboarding.tutorial.with.bitbucket_pipelines.variables.intro=In your Bitbucket repository, go to {repository_variables} and create two new variables:
+onboarding.tutorial.with.bitbucket_pipelines.variables.intro.link=Repository settings > Repository variables
+onboarding.tutorial.with.bitbucket_pipelines.variables.name.sentence=In the {name} field, enter
+onboarding.tutorial.with.bitbucket_pipelines.variables.name.sentence.name=Name
+onboarding.tutorial.with.bitbucket_pipelines.variables.add.sentence=Click on {add}
+onboarding.tutorial.with.bitbucket_pipelines.variables.add.sentence.add=Add
+onboarding.tutorial.with.bitbucket_pipelines.variables.secured.sentence=Make sure {secured} is check
+onboarding.tutorial.with.bitbucket_pipelines.variables.secured.sentence.secured=Secured
 
 onboarding.tutorial.with.github_action.create_secret.title=Create GitHub Secrets
 onboarding.tutorial.with.github_action.secret.intro=In your GitHub repository, go to {settings_secret} and create two new secrets:
@@ -3447,9 +3465,6 @@ onboarding.tutorial.with.github_action.secret.add.sentence=Click on {add_secret}
 onboarding.tutorial.with.github_action.secret.add.sentence.add_secret=Add secret
 onboarding.tutorial.with.github_action.yaml.title=Create Workflow YAML File
 onboarding.tutorial.with.github_action.yaml.create_yml=Create or update your {file} YAML file with the following content:
-onboarding.tutorial.with.github_action.yaml.maven.pom=Update your {pom} file with the following properties:
-onboarding.tutorial.with.github_action.yaml.gradle=Update your {gradle} file with the {sq} plugin and it's configuration:
-
 
 onboarding.tutorial.with.gitlab_ci.title=Analyze your project with GitLab CI
 onboarding.tutorial.with.gitlab_ci.unsupported=This tutorial is only available for projects bound to GitLab.