SONAR-10800 Use 'Close' instead of 'Skip' to dismiss onboarding tutorial

3 files changed, 66 insertions, 39 deletions

diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/Onboarding.js b/server/sonar-web/src/main/js/apps/tutorials/onboarding/Onboarding.js
index cc04c85868c..afcf049e397 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/Onboarding.js
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/Onboarding.js
@@ -25,16 +25,18 @@ import TokenStep from './TokenStep';
 import OrganizationStep from './OrganizationStep';
 import AnalysisStep from './AnalysisStep';
 import ProjectWatcher from './ProjectWatcher';
+import DeferredSpinner from '../../../components/common/DeferredSpinner';
 import InstanceMessage from '../../../components/common/InstanceMessage';
 import handleRequiredAuthentication from '../../../app/utils/handleRequiredAuthentication';
 import { skipOnboarding } from '../../../api/users';
 import { translate, translateWithParameters } from '../../../helpers/l10n';
 import { getProjectUrl } from '../../../helpers/urls';
-import './styles.css';
 import { isSonarCloud } from '../../../helpers/system';
+import './styles.css';
 
 /*::
 type Props = {|
+  automatic?:boolean,
   className?: string,
   currentUser: { login: string, isLoggedIn: boolean },
   onFinish: () => void,
@@ -145,7 +147,7 @@ export default class Onboarding extends React.PureComponent {
       return null;
     }
 
-    const { organizationsEnabled } = this.props;
+    const { automatic, organizationsEnabled } = this.props;
     const { step, token } = this.state;
     let stepNumber = 1;
 
@@ -161,13 +163,12 @@ export default class Onboarding extends React.PureComponent {
               <InstanceMessage message={translate('onboarding.header')} />
             </h1>
             <div className="page-actions">
-              {this.state.skipping ? (
-                <i className="spinner" />
-              ) : (
+              <DeferredSpinner loading={this.state.skipping}>
                 <a className="js-skip text-muted" href="#" onClick={this.handleSkipClick}>
-                  {translate('tutorials.skip')}
+                  {automatic ? translate('tutorials.skip') : translate('close')}
                 </a>
-              )}
+              </DeferredSpinner>
+
               <p className="note">
                 {translate(
                   isSonarCloud()
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/OnboardingModal.tsx b/server/sonar-web/src/main/js/apps/tutorials/onboarding/OnboardingModal.tsx
index e1013a3f750..188e5cc7927 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/OnboardingModal.tsx
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/OnboardingModal.tsx
@@ -23,15 +23,16 @@ import { translate } from '../../../helpers/l10n';
 import { lazyLoad } from '../../../components/lazyLoad';
 
 interface Props {
+  automatic?: boolean;
   onFinish: () => void;
 }
 
 const OnboardingContainer = lazyLoad(() => import('./OnboardingContainer'));
 
-export default function OnboardingModal({ onFinish }: Props) {
+export default function OnboardingModal(props: Props) {
   return (
     <Modal contentLabel={translate('tutorials.onboarding')} large={true}>
-      <OnboardingContainer onFinish={onFinish} />
+      <OnboardingContainer {...props} />
     </Modal>
   );
 }
diff --git a/server/sonar-web/src/main/js/apps/tutorials/onboarding/__tests__/__snapshots__/Onboarding-test.js.snap b/server/sonar-web/src/main/js/apps/tutorials/onboarding/__tests__/__snapshots__/Onboarding-test.js.snap
index 313284fb6a0..1635dc70bd5 100644
--- a/server/sonar-web/src/main/js/apps/tutorials/onboarding/__tests__/__snapshots__/Onboarding-test.js.snap
+++ b/server/sonar-web/src/main/js/apps/tutorials/onboarding/__tests__/__snapshots__/Onboarding-test.js.snap
@@ -23,13 +23,18 @@ exports[`guides for on-premise 1`] = `
       <div
         className="page-actions"
       >
-        <a
-          className="js-skip text-muted"
-          href="#"
-          onClick={[Function]}
+        <DeferredSpinner
+          loading={false}
+          timeout={100}
         >
-          tutorials.skip
-        </a>
+          <a
+            className="js-skip text-muted"
+            href="#"
+            onClick={[Function]}
+          >
+            close
+          </a>
+        </DeferredSpinner>
         <p
           className="note"
         >
@@ -88,13 +93,18 @@ exports[`guides for on-premise 2`] = `
       <div
         className="page-actions"
       >
-        <a
-          className="js-skip text-muted"
-          href="#"
-          onClick={[Function]}
+        <DeferredSpinner
+          loading={false}
+          timeout={100}
         >
-          tutorials.skip
-        </a>
+          <a
+            className="js-skip text-muted"
+            href="#"
+            onClick={[Function]}
+          >
+            close
+          </a>
+        </DeferredSpinner>
         <p
           className="note"
         >
@@ -152,13 +162,18 @@ exports[`guides for sonarcloud 1`] = `
       <div
         className="page-actions"
       >
-        <a
-          className="js-skip text-muted"
-          href="#"
-          onClick={[Function]}
+        <DeferredSpinner
+          loading={false}
+          timeout={100}
         >
-          tutorials.skip
-        </a>
+          <a
+            className="js-skip text-muted"
+            href="#"
+            onClick={[Function]}
+          >
+            close
+          </a>
+        </DeferredSpinner>
         <p
           className="note"
         >
@@ -228,13 +243,18 @@ exports[`guides for sonarcloud 2`] = `
       <div
         className="page-actions"
       >
-        <a
-          className="js-skip text-muted"
-          href="#"
-          onClick={[Function]}
+        <DeferredSpinner
+          loading={false}
+          timeout={100}
         >
-          tutorials.skip
-        </a>
+          <a
+            className="js-skip text-muted"
+            href="#"
+            onClick={[Function]}
+          >
+            close
+          </a>
+        </DeferredSpinner>
         <p
           className="note"
         >
@@ -305,13 +325,18 @@ exports[`guides for sonarcloud 3`] = `
       <div
         className="page-actions"
       >
-        <a
-          className="js-skip text-muted"
-          href="#"
-          onClick={[Function]}
+        <DeferredSpinner
+          loading={false}
+          timeout={100}
         >
-          tutorials.skip
-        </a>
+          <a
+            className="js-skip text-muted"
+            href="#"
+            onClick={[Function]}
+          >
+            close
+          </a>
+        </DeferredSpinner>
         <p
           className="note"
         >