SONARCLOUD-178 Simplify SC onboarding popup

server/sonar-web/src/main/js/app/components/StartupModal.tsx

@@ -112,11 +112,6 @@ export class StartupModal extends React.PureComponent<Props, State> {
     this.setState({ modal: ModalKey.onboarding });
   };
 
-  openOrganizationOnboarding = () => {
-    this.setState({ automatic: false, modal: undefined });
-    this.props.router.push({ pathname: '/create-organization', state: { paid: true } });
-  };
-
   openProjectOnboarding = (organization?: T.Organization) => {
     if (isSonarCloud()) {
       this.setState({ automatic: false, modal: undefined });
@@ -183,7 +178,6 @@ export class StartupModal extends React.PureComponent<Props, State> {
         {modal === ModalKey.onboarding && (
           <OnboardingModal
             onClose={this.closeOnboarding}
-            onOpenOrganizationOnboarding={this.openOrganizationOnboarding}
             onOpenProjectOnboarding={this.openProjectOnboarding}
             onOpenTeamOnboarding={this.openTeamOnboarding}
           />

server/sonar-web/src/main/js/apps/create/organization/CreateOrganization.tsx

@@ -93,7 +93,6 @@ type StateWithAutoImport = State & Required<Pick<State, 'almApplication'>>;
 type TabKeys = 'auto' | 'manual';
 
 interface LocationState {
-  paid?: boolean;
   tab?: TabKeys;
 }
 
@@ -301,7 +300,7 @@ export class CreateOrganization extends React.PureComponent<Props & WithRouterPr
     const { currentUser, location } = this.props;
     const { state } = this;
     const { organization, step, subscriptionPlans } = state;
-    const { paid, tab = 'auto' } = (location.state || {}) as LocationState;
+    const { tab = 'auto' } = (location.state || {}) as LocationState;
 
     const commonProps = {
       handleOrgDetailsFinish: this.handleOrgDetailsFinish,
@@ -318,7 +317,6 @@ export class CreateOrganization extends React.PureComponent<Props & WithRouterPr
           {...commonProps}
           createOrganization={this.props.createOrganization}
           onUpgradeFail={this.deleteOrganization}
-          onlyPaid={paid}
           organization={this.state.organization}
           step={this.state.step}
         />
@@ -364,7 +362,6 @@ export class CreateOrganization extends React.PureComponent<Props & WithRouterPr
           className={classNames({ hidden: tab !== 'manual' && this.hasAutoImport(state) })}
           createOrganization={this.props.createOrganization}
           onUpgradeFail={this.deleteOrganization}
-          onlyPaid={paid}
         />
 
         {almInstallId && almOrganization && !boundOrganization ? (

server/sonar-web/src/main/js/apps/create/organization/__tests__/CreateOrganization-test.tsx

@@ -106,14 +106,6 @@ it('should render with manual tab displayed', async () => {
   expect(getAlmAppInfo).not.toHaveBeenCalled();
 });
 
-it('should preselect paid plan on manual creation', async () => {
-  const location = { state: { paid: true } };
-  // @ts-ignore avoid passing everything from WithRouterProps
-  const wrapper = shallowRender({ location });
-  await waitAndUpdate(wrapper);
-  expect(wrapper.find('ManualOrganizationCreate').prop('onlyPaid')).toBe(true);
-});
-
 it('should render with auto tab displayed', async () => {
   const wrapper = shallowRender({ currentUser: { ...user, externalProvider: 'github' } });
   await waitAndUpdate(wrapper);

server/sonar-web/src/main/js/apps/tutorials/onboarding/OnboardingModal.tsx

@@ -21,7 +21,6 @@ import * as React from 'react';
 import { connect } from 'react-redux';
 import handleRequiredAuthentication from '../../../app/utils/handleRequiredAuthentication';
 import Modal from '../../../components/controls/Modal';
-import OnboardingPrivateIcon from '../../../components/icons-components/OnboardingPrivateIcon';
 import OnboardingProjectIcon from '../../../components/icons-components/OnboardingProjectIcon';
 import OnboardingTeamIcon from '../../../components/icons-components/OnboardingTeamIcon';
 import { Button, ResetButtonLink } from '../../../components/ui/buttons';
@@ -32,7 +31,6 @@ import '../styles.css';
 
 interface OwnProps {
   onClose: () => void;
-  onOpenOrganizationOnboarding: () => void;
   onOpenProjectOnboarding: () => void;
   onOpenTeamOnboarding: () => void;
 }
@@ -73,24 +71,13 @@ export class OnboardingModal extends React.PureComponent<Props> {
         <div className="modal-simple-body text-center onboarding-choices">
           <Button className="onboarding-choice" onClick={this.handleOpenProjectOnboarding}>
             <OnboardingProjectIcon className="big-spacer-bottom" />
-            <h6 className="onboarding-choice-name">
-              {translate('onboarding.analyze_public_code')}
-            </h6>
-            <p className="note">{translate('onboarding.analyze_public_code.note')}</p>
-          </Button>
-          <Button className="onboarding-choice" onClick={this.props.onOpenOrganizationOnboarding}>
-            <OnboardingPrivateIcon className="big-spacer-bottom" />
-            <h6 className="onboarding-choice-name">
-              {translate('onboarding.analyze_private_code')}
-            </h6>
-            <p className="note">{translate('onboarding.analyze_private_code.note')}</p>
+            <h6 className="onboarding-choice-name">{translate('onboarding.analyze_your_code')}</h6>
           </Button>
           <Button className="onboarding-choice" onClick={this.props.onOpenTeamOnboarding}>
             <OnboardingTeamIcon className="big-spacer-bottom" />
             <h6 className="onboarding-choice-name">
               {translate('onboarding.contribute_existing_project')}
             </h6>
-            <p className="note">{translate('onboarding.contribute_existing_project.note')}</p>
           </Button>
         </div>
         <div className="modal-simple-footer text-center">

server/sonar-web/src/main/js/apps/tutorials/onboarding/OnboardingPage.tsx

@@ -54,15 +54,6 @@ export class OnboardingPage extends React.PureComponent<OwnProps & DispatchProps
     this.props.router.replace('/');
   };
 
-  closeOrganizationOnboarding = ({ key }: Pick<T.Organization, 'key'>) => {
-    this.closeOnboarding();
-    this.props.router.push(`/organizations/${key}`);
-  };
-
-  openOrganizationOnboarding = () => {
-    this.props.router.push({ pathname: '/create-organization', state: { paid: true } });
-  };
-
   openTeamOnboarding = () => {
     this.setState({ modal: ModalKey.teamOnboarding });
   };
@@ -74,7 +65,6 @@ export class OnboardingPage extends React.PureComponent<OwnProps & DispatchProps
         {modal === ModalKey.onboarding && (
           <OnboardingModal
             onClose={this.closeOnboarding}
-            onOpenOrganizationOnboarding={this.openOrganizationOnboarding}
             onOpenProjectOnboarding={this.context.openProjectOnboarding}
             onOpenTeamOnboarding={this.openTeamOnboarding}
           />

server/sonar-web/src/main/js/apps/tutorials/onboarding/__tests__/OnboardingModal-test.tsx

@@ -28,7 +28,6 @@ it('renders correctly', () => {
       <OnboardingModal
         currentUser={{ isLoggedIn: true }}
         onClose={jest.fn()}
-        onOpenOrganizationOnboarding={jest.fn()}
         onOpenProjectOnboarding={jest.fn()}
         onOpenTeamOnboarding={jest.fn()}
       />
@@ -38,7 +37,6 @@ it('renders correctly', () => {
 
 it('should correctly open the different tutorials', () => {
   const onClose = jest.fn();
-  const onOpenOrganizationOnboarding = jest.fn();
   const onOpenProjectOnboarding = jest.fn();
   const onOpenTeamOnboarding = jest.fn();
   const push = jest.fn();
@@ -46,7 +44,6 @@ it('should correctly open the different tutorials', () => {
     <OnboardingModal
       currentUser={{ isLoggedIn: true }}
       onClose={onClose}
-      onOpenOrganizationOnboarding={onOpenOrganizationOnboarding}
       onOpenProjectOnboarding={onOpenProjectOnboarding}
       onOpenTeamOnboarding={onOpenTeamOnboarding}
     />,
@@ -57,7 +54,6 @@ it('should correctly open the different tutorials', () => {
   expect(onClose).toHaveBeenCalled();
 
   wrapper.find('Button').forEach(button => click(button));
-  expect(onOpenOrganizationOnboarding).toHaveBeenCalled();
   expect(onOpenProjectOnboarding).toHaveBeenCalled();
   expect(onOpenTeamOnboarding).toHaveBeenCalled();
 });

server/sonar-web/src/main/js/apps/tutorials/onboarding/__tests__/__snapshots__/OnboardingModal-test.tsx.snap

@@ -32,31 +32,8 @@ exports[`renders correctly 1`] = `
       <h6
         className="onboarding-choice-name"
       >
-        onboarding.analyze_public_code
+        onboarding.analyze_your_code
       </h6>
-      <p
-        className="note"
-      >
-        onboarding.analyze_public_code.note
-      </p>
-    </Button>
-    <Button
-      className="onboarding-choice"
-      onClick={[MockFunction]}
-    >
-      <OnboardingPrivateIcon
-        className="big-spacer-bottom"
-      />
-      <h6
-        className="onboarding-choice-name"
-      >
-        onboarding.analyze_private_code
-      </h6>
-      <p
-        className="note"
-      >
-        onboarding.analyze_private_code.note
-      </p>
     </Button>
     <Button
       className="onboarding-choice"
@@ -70,11 +47,6 @@ exports[`renders correctly 1`] = `
       >
         onboarding.contribute_existing_project
       </h6>
-      <p
-        className="note"
-      >
-        onboarding.contribute_existing_project.note
-      </p>
     </Button>
   </div>
   <div

server/sonar-web/src/main/js/apps/tutorials/styles.css

@@ -62,7 +62,7 @@
 .onboarding-choices {
   display: flex;
   justify-content: space-around;
-  padding: 44px 0;
+  padding: 44px 100px;
   background-color: var(--barBackgroundColor);
 }
 
@@ -86,7 +86,6 @@
 
 .onboarding-choice-name {
   padding-top: var(--gridSize);
-  padding-bottom: calc(0.5 * var(--gridSize));
   color: inherit;
   font-size: var(--mediumFontSize);
 }

server/sonar-web/src/main/js/components/icons-components/OnboardingPrivateIcon.tsx

@@ -1,50 +0,0 @@
-/*
- * SonarQube
- * Copyright (C) 2009-2018 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 Icon, { IconProps } from './Icon';
-
-export default function OnboardingPrivateIcon({
-  className,
-  fill = 'currentColor',
-  size
-}: IconProps) {
-  return (
-    <Icon className={className} size={size || 64} viewBox="0 0 64 64">
-      <g fill="none" stroke={fill} strokeWidth="2">
-        <path d="M2 59h60V13H2zm0-46h60V5H2zm3-4h2m2 0h2m2 0h2m2 0h42" />
-        <path d="M59 34h-6l-2-4h-6l-2 5h-6l-2 2h-6l-2-4h-6l-2 5h-6l-2 4H5m1 14v-9m4 9v-6m4 6V43m4 13V45m4 11V42m4 14V39m4 17V41m4 15V46m4 10V40m4 16V44m4 12V37m4 19V38m4 18V43m4 13V39m-3-18h-2m-2 0h-2m-2 0h-2M9 29h14M9 33h7m17-12h8m-14 4h8m-8-4h4m-21 4h12v-4H10z" />
-        <path d="M58 31V17H6v22" />
-        <path
-          d="M50 36c0-9.389-7.611-17-17-17s-17 7.611-17 17 7.611 17 17 17 17-7.611 17-17"
-          fill="#FFF"
-          stroke="none"
-        />
-        <path d="M50 36c0-9.389-7.611-17-17-17s-17 7.611-17 17 7.611 17 17 17 17-7.611 17-17z" />
-        <mask fill="#FFF" id="a">
-          <path d="M0 56h62V0H0z" />
-        </mask>
-        <path
-          d="M27 45h12V33H27zm10-12v-4c0-1.023-.391-2.047-1.172-2.828C35.048 25.391 34.023 25 33 25s-2.048.391-2.828 1.172C29.391 26.953 29 27.977 29 29v4"
-          mask="url(#a)"
-        />
-      </g>
-    </Icon>
-  );
-}

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

@@ -2814,12 +2814,9 @@ onboarding.team.first_step=Well congrats, the first step is done!
 onboarding.team.how_to_join=To join a team, the only thing you need to do is to be a user registered on Sonarcloud. The administrator of the Sonarcloud organization you wish to join has to add you to his organization's members {link}. Ask him to do so!
 onboarding.team.work_in_progress=We are currently working on a better way to join a team or invite people to yours.
 
-onboarding.analyze_public_code.note=Free
-onboarding.analyze_public_code=Analyze public code
-onboarding.analyze_private_code=Analyze private code
-onboarding.analyze_private_code.note=From 10$ / month
+onboarding.analyze_your_code.note=Free
+onboarding.analyze_your_code=Analyze your code
 onboarding.contribute_existing_project=Join a team
-onboarding.contribute_existing_project.note=Free
 
 onboarding.token.header=Provide a token
 onboarding.token.text=The token is used to identify you when an analysis is performed. If it has been compromised, you can revoke it at any point of time in your {link}.