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 });
{modal === ModalKey.onboarding && (
<OnboardingModal
onClose={this.closeOnboarding}
- onOpenOrganizationOnboarding={this.openOrganizationOnboarding}
onOpenProjectOnboarding={this.openProjectOnboarding}
onOpenTeamOnboarding={this.openTeamOnboarding}
/>
type TabKeys = 'auto' | 'manual';
interface LocationState {
- paid?: boolean;
tab?: TabKeys;
}
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,
{...commonProps}
createOrganization={this.props.createOrganization}
onUpgradeFail={this.deleteOrganization}
- onlyPaid={paid}
organization={this.state.organization}
step={this.state.step}
/>
className={classNames({ hidden: tab !== 'manual' && this.hasAutoImport(state) })}
createOrganization={this.props.createOrganization}
onUpgradeFail={this.deleteOrganization}
- onlyPaid={paid}
/>
{almInstallId && almOrganization && !boundOrganization ? (
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);
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';
interface OwnProps {
onClose: () => void;
- onOpenOrganizationOnboarding: () => void;
onOpenProjectOnboarding: () => void;
onOpenTeamOnboarding: () => void;
}
<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">
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 });
};
{modal === ModalKey.onboarding && (
<OnboardingModal
onClose={this.closeOnboarding}
- onOpenOrganizationOnboarding={this.openOrganizationOnboarding}
onOpenProjectOnboarding={this.context.openProjectOnboarding}
onOpenTeamOnboarding={this.openTeamOnboarding}
/>
<OnboardingModal
currentUser={{ isLoggedIn: true }}
onClose={jest.fn()}
- onOpenOrganizationOnboarding={jest.fn()}
onOpenProjectOnboarding={jest.fn()}
onOpenTeamOnboarding={jest.fn()}
/>
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();
<OnboardingModal
currentUser={{ isLoggedIn: true }}
onClose={onClose}
- onOpenOrganizationOnboarding={onOpenOrganizationOnboarding}
onOpenProjectOnboarding={onOpenProjectOnboarding}
onOpenTeamOnboarding={onOpenTeamOnboarding}
/>,
expect(onClose).toHaveBeenCalled();
wrapper.find('Button').forEach(button => click(button));
- expect(onOpenOrganizationOnboarding).toHaveBeenCalled();
expect(onOpenProjectOnboarding).toHaveBeenCalled();
expect(onOpenTeamOnboarding).toHaveBeenCalled();
});
<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"
>
onboarding.contribute_existing_project
</h6>
- <p
- className="note"
- >
- onboarding.contribute_existing_project.note
- </p>
</Button>
</div>
<div
.onboarding-choices {
display: flex;
justify-content: space-around;
- padding: 44px 0;
+ padding: 44px 100px;
background-color: var(--barBackgroundColor);
}
.onboarding-choice-name {
padding-top: var(--gridSize);
- padding-bottom: calc(0.5 * var(--gridSize));
color: inherit;
font-size: var(--mediumFontSize);
}
+++ /dev/null
-/*
- * 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>
- );
-}
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}.