SC-687 Fix tutorial for manual projects (#1848)

3 files changed, 112 insertions, 28 deletions

diff --git a/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/AnalyzeTutorialSonarCloud.tsx b/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/AnalyzeTutorialSonarCloud.tsx
index 50b32bbf6e4..6f713d53b0f 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/AnalyzeTutorialSonarCloud.tsx
+++ b/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/AnalyzeTutorialSonarCloud.tsx
@@ -127,6 +127,10 @@ export default class AnalyzeTutorialSonarCloud extends React.PureComponent<Props
     this.mounted = false;
   }
 
+  stopLoading = () => {
+    this.setState({ loading: false });
+  };
+
   configureBitbucket = () => {
     this.setState({ alm: alms[ALM_KEYS.BITBUCKET], loading: false });
   };
@@ -146,6 +150,7 @@ export default class AnalyzeTutorialSonarCloud extends React.PureComponent<Props
     }
 
     if (!component.alm) {
+      this.stopLoading();
       return;
     }
 
@@ -155,19 +160,14 @@ export default class AnalyzeTutorialSonarCloud extends React.PureComponent<Props
       return;
     }
 
-    getGithubLanguages(url).then(
-      almLanguagesStats => {
-        if (this.mounted) {
-          this.setState({
-            almLanguageStats: almLanguagesStats,
-            loading: false
-          });
-        }
-      },
-      () => {
-        this.setState({ loading: false });
+    getGithubLanguages(url).then(almLanguagesStats => {
+      if (this.mounted) {
+        this.setState({
+          almLanguageStats: almLanguagesStats,
+          loading: false
+        });
       }
-    );
+    }, this.stopLoading);
   };
 
   configureMicrosoft = () => {
diff --git a/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/__tests__/AnalyzeTutorialSonarCloud-test.tsx b/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/__tests__/AnalyzeTutorialSonarCloud-test.tsx
index 7352248c892..8a52c8404c1 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/__tests__/AnalyzeTutorialSonarCloud-test.tsx
+++ b/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/__tests__/AnalyzeTutorialSonarCloud-test.tsx
@@ -71,18 +71,18 @@ beforeEach(() => {
   jest.clearAllMocks();
 });
 
+const compGitHub = {
+  ...component,
+  alm: { key: 'github', url: 'https://github.com/luke/lightsaber' }
+};
+
 it('shows a loading screen', () => {
-  expect(shallowRender()
-    .find('DeferredSpinner')
-    .prop('loading') as boolean).toBe(true);
+  const wrapper = shallowRender({ component: compGitHub });
+  expect(wrapper.find('DeferredSpinner').prop('loading') as boolean).toBe(true);
 });
 
 it('renders for GitHub', async () => {
-  const comp = {
-    ...component,
-    alm: { key: 'github', url: 'https://github.com/luke/lightsaber' }
-  };
-  const wrapper = shallowRender({ component: comp });
+  const wrapper = shallowRender({ component: compGitHub });
   await waitAndUpdate(wrapper);
 
   expect(wrapper).toMatchSnapshot();
@@ -120,11 +120,8 @@ it('renders for Azure', () => {
   expect(shallowRender({ component: comp })).toMatchSnapshot();
 });
 
-it('renders for a non supported component', async () => {
-  const wrapper = shallowRender();
-  await waitAndUpdate(wrapper);
-
-  expect(wrapper).toMatchSnapshot();
+it('renders for a manual project', () => {
+  expect(shallowRender()).toMatchSnapshot();
 });
 
 it('renders the finished state', async () => {
diff --git a/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/__tests__/__snapshots__/AnalyzeTutorialSonarCloud-test.tsx.snap b/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/__tests__/__snapshots__/AnalyzeTutorialSonarCloud-test.tsx.snap
index 65cf812dc0d..1f4fe642d6e 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/__tests__/__snapshots__/AnalyzeTutorialSonarCloud-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/tutorials/analyzeProject/__tests__/__snapshots__/AnalyzeTutorialSonarCloud-test.tsx.snap
@@ -188,12 +188,99 @@ exports[`renders for GitHub 1`] = `
 </DeferredSpinner>
 `;
 
-exports[`renders for a non supported component 1`] = `
+exports[`renders for a manual project 1`] = `
 <DeferredSpinner
   customSpinner={<Unknown />}
-  loading={true}
+  loading={false}
   timeout={100}
-/>
+>
+  <div
+    className="page-analysis-container page-analysis-container-sonarcloud"
+  >
+    <div
+      className="page-analysis big-spacer-top big-spacer-bottom huge-spacer-left huge-spacer-right"
+    >
+      <div
+        className="page-header big-spacer-bottom"
+      >
+        <h1
+          className="big-spacer-bottom"
+        >
+          onboarding.project_analysis.header
+        </h1>
+        <p>
+          <InstanceMessage
+            message="onboarding.project_analysis.description"
+          />
+        </p>
+      </div>
+      <div
+        className="analysis-modes"
+      >
+        <div
+          className="mode-type mode-type-travis"
+          key="travis"
+        >
+          <div
+            className="icon"
+          />
+          <div
+            className="name"
+          >
+            With Travis CI
+          </div>
+          <button
+            className="button big-spacer-top big-spacer-bottom"
+            onClick={[Function]}
+            type="button"
+          >
+            projects.configure_analysis
+          </button>
+        </div>
+        <div
+          className="mode-type mode-type-other"
+          key="other"
+        >
+          <div
+            className="icon"
+          />
+          <div
+            className="name"
+          >
+            With other CI tools
+          </div>
+          <button
+            className="button big-spacer-top big-spacer-bottom"
+            onClick={[Function]}
+            type="button"
+          >
+            projects.configure_analysis
+          </button>
+        </div>
+        <div
+          className="mode-type mode-type-manual"
+          key="manual"
+        >
+          <div
+            className="icon"
+          />
+          <div
+            className="name"
+          >
+            Manually
+          </div>
+          <button
+            className="button big-spacer-top big-spacer-bottom"
+            onClick={[Function]}
+            type="button"
+          >
+            projects.configure_analysis
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</DeferredSpinner>
 `;
 
 exports[`should have a spinner 1`] = `