From f52d0c2586ee1fffb12e882cc86c41e036b46ce0 Mon Sep 17 00:00:00 2001 From: Stas Vilchik Date: Fri, 28 Sep 2018 16:49:25 +0200 Subject: [PATCH] SONARCLOUD-138 Make forms clearer when upgrading an organization (#761) --- .../sonar-docs/src/tooltips/billing/coupon.md | 1 - .../components/extensions/exposeLibraries.ts | 2 + .../create/organization/BillingFormShim.tsx | 24 +-- .../js/apps/create/organization/CardForm.tsx | 91 ----------- .../apps/create/organization/CouponForm.tsx | 122 -------------- .../organization/PaymentMethodSelect.tsx | 57 ------- .../js/apps/create/organization/PlanStep.tsx | 47 +++--- .../__mocks__/BillingFormShim.tsx | 17 +- .../__tests__/BillingFormShim-test.tsx | 1 - .../organization/__tests__/CardForm-test.tsx | 38 ----- .../__tests__/CouponForm-test.tsx | 36 ----- .../__tests__/PaymentMethodSelect-test.tsx | 34 ---- .../organization/__tests__/PlanStep-test.tsx | 47 +----- .../BillingFormShim-test.tsx.snap | 1 - .../__snapshots__/CardForm-test.tsx.snap | 107 ------------ .../__snapshots__/CouponForm-test.tsx.snap | 22 --- .../PaymentMethodSelect-test.tsx.snap | 79 --------- .../__snapshots__/PlanStep-test.tsx.snap | 152 ++---------------- .../src/main/js/apps/tutorials/styles.css | 4 + .../js/components/controls/HelpTooltip.tsx | 9 +- .../resources/org/sonar/l10n/core.properties | 1 - 21 files changed, 53 insertions(+), 839 deletions(-) delete mode 100644 server/sonar-docs/src/tooltips/billing/coupon.md delete mode 100644 server/sonar-web/src/main/js/apps/create/organization/CardForm.tsx delete mode 100644 server/sonar-web/src/main/js/apps/create/organization/CouponForm.tsx delete mode 100644 server/sonar-web/src/main/js/apps/create/organization/PaymentMethodSelect.tsx delete mode 100644 server/sonar-web/src/main/js/apps/create/organization/__tests__/CardForm-test.tsx delete mode 100644 server/sonar-web/src/main/js/apps/create/organization/__tests__/CouponForm-test.tsx delete mode 100644 server/sonar-web/src/main/js/apps/create/organization/__tests__/PaymentMethodSelect-test.tsx delete mode 100644 server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/CardForm-test.tsx.snap delete mode 100644 server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/CouponForm-test.tsx.snap delete mode 100644 server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/PaymentMethodSelect-test.tsx.snap diff --git a/server/sonar-docs/src/tooltips/billing/coupon.md b/server/sonar-docs/src/tooltips/billing/coupon.md deleted file mode 100644 index 50319dbc179..00000000000 --- a/server/sonar-docs/src/tooltips/billing/coupon.md +++ /dev/null @@ -1 +0,0 @@ -A coupon is a way to pay for yearly subscriptions or to use other payment methods than card. Contact us for more information. diff --git a/server/sonar-web/src/main/js/app/components/extensions/exposeLibraries.ts b/server/sonar-web/src/main/js/app/components/extensions/exposeLibraries.ts index 3198accbe06..c4fc23fa0db 100644 --- a/server/sonar-web/src/main/js/app/components/extensions/exposeLibraries.ts +++ b/server/sonar-web/src/main/js/app/components/extensions/exposeLibraries.ts @@ -62,6 +62,7 @@ import ActionsDropdown, { ActionsDropdownItem } from '../../../components/contro import ConfirmButton from '../../../components/controls/ConfirmButton'; import SimpleModal from '../../../components/controls/SimpleModal'; import SearchSelect from '../../../components/controls/SearchSelect'; +import RadioToggle from '../../../components/controls/RadioToggle'; const exposeLibraries = () => { const global = window as any; @@ -103,6 +104,7 @@ const exposeLibraries = () => { Modal, PullRequestIcon, QualifierIcon, + RadioToggle, Rating, ReloadButton, ResetButtonLink, diff --git a/server/sonar-web/src/main/js/apps/create/organization/BillingFormShim.tsx b/server/sonar-web/src/main/js/apps/create/organization/BillingFormShim.tsx index f08e3ffc80e..df4a59ebce6 100644 --- a/server/sonar-web/src/main/js/apps/create/organization/BillingFormShim.tsx +++ b/server/sonar-web/src/main/js/apps/create/organization/BillingFormShim.tsx @@ -18,37 +18,21 @@ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ import * as React from 'react'; -import { CurrentUser, SubscriptionPlan, Coupon } from '../../../app/types'; +import { CurrentUser, SubscriptionPlan } from '../../../app/types'; interface ChildrenProps { - alertError: string | undefined; - couponValue: string; onSubmit: React.FormEventHandler; - renderAdditionalInfo: () => React.ReactNode; - renderBillingNameInput: () => React.ReactNode; - renderBraintreeClient: () => React.ReactNode; - renderCountrySelect: () => React.ReactNode; - renderCouponInput: (children?: React.ReactNode) => React.ReactNode; - renderEmailInput: () => React.ReactNode; - renderNextCharge: () => React.ReactNode; - renderPlanSelect: () => React.ReactNode; - renderResetButton: () => React.ReactNode; - renderSpinner: () => React.ReactNode; - renderSubmitButton: (text?: string) => React.ReactNode; - renderTermsOfService: () => React.ReactNode; - renderTypeOfUseSelect: () => React.ReactNode; + renderFormFields: () => React.ReactElement; + renderSubmitGroup: (submitText?: string) => React.ReactElement; } interface Props { children: (props: ChildrenProps) => React.ReactElement; - country?: string; + initialCountry?: string; currentUser: CurrentUser; - onClose: () => void; onCommit: () => void; - onCouponUpdate?: (coupon?: Coupon) => void; onFailToUpgrade?: () => void; organizationKey: string | (() => Promise); - skipBraintreeInit?: boolean; subscriptionPlans: SubscriptionPlan[]; } diff --git a/server/sonar-web/src/main/js/apps/create/organization/CardForm.tsx b/server/sonar-web/src/main/js/apps/create/organization/CardForm.tsx deleted file mode 100644 index 39a739f8ff3..00000000000 --- a/server/sonar-web/src/main/js/apps/create/organization/CardForm.tsx +++ /dev/null @@ -1,91 +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 * as classNames from 'classnames'; -import BillingFormShim from './BillingFormShim'; -import { withCurrentUser } from './withCurrentUser'; -import { CurrentUser, SubscriptionPlan } from '../../../app/types'; -import { translate } from '../../../helpers/l10n'; - -interface Props { - createOrganization: () => Promise; - currentUser: CurrentUser; - onFailToUpgrade: () => void; - onSubmit: () => void; - subscriptionPlans: SubscriptionPlan[]; -} - -export class CardForm extends React.PureComponent { - handleClose = () => { - // do nothing - }; - - render() { - return ( -
- - {form => ( -
-
-
-

{translate('billing.upgrade.billing_info')}

- {form.renderEmailInput()} - {form.renderTypeOfUseSelect()} - {form.renderBillingNameInput()} - {form.renderCountrySelect()} - {form.renderAdditionalInfo()} -
-
-

{translate('billing.upgrade.plan')}

- {form.renderPlanSelect()} -

{translate('billing.upgrade.card_info')}

- {form.renderBraintreeClient()} -
-
-
- {form.renderNextCharge()} -
- {form.alertError &&

{form.alertError}

} -
-
- {form.renderSpinner()} - {form.renderSubmitButton( - translate('onboarding.create_organization.create_and_upgrade') - )} -
- {form.renderTermsOfService()} -
- )} - -
- ); - } -} - -export default withCurrentUser(CardForm); diff --git a/server/sonar-web/src/main/js/apps/create/organization/CouponForm.tsx b/server/sonar-web/src/main/js/apps/create/organization/CouponForm.tsx deleted file mode 100644 index fc0a7ab28fe..00000000000 --- a/server/sonar-web/src/main/js/apps/create/organization/CouponForm.tsx +++ /dev/null @@ -1,122 +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 * as classNames from 'classnames'; -import BillingFormShim from './BillingFormShim'; -import { withCurrentUser } from './withCurrentUser'; -import { CurrentUser, Coupon } from '../../../app/types'; -import { translate } from '../../../helpers/l10n'; -import DocTooltip from '../../../components/docs/DocTooltip'; - -interface Props { - createOrganization: () => Promise; - currentUser: CurrentUser; - onFailToUpgrade: () => void; - onSubmit: () => void; -} - -interface State { - coupon?: Coupon; -} - -export class CouponForm extends React.PureComponent { - state: State = {}; - - handleClose = () => { - // do nothing - }; - - handleCouponUpdate = (coupon?: Coupon) => { - this.setState({ coupon }); - }; - - renderBillingInformation() { - if (!this.state.coupon || !this.state.coupon.billing) { - return null; - } - const { billing } = this.state.coupon; - return ( -
-

{translate('billing.upgrade.billing_info')}

-
    - {Boolean(billing.name) &&
  • {billing.name}
    • } - {Boolean(billing.address) &&
  • {billing.address}
    • } - {Boolean(billing.country) &&
  • {billing.country}
    • } - {Boolean(billing.email) &&
  • {billing.email}
    • } -
-
- ); - } - - render() { - return ( -
- - {form => ( -
- {form.renderCouponInput( - - )} - {this.renderBillingInformation()} - {this.state.coupon && - !this.state.coupon.billing && ( - <> -

{translate('billing.upgrade.billing_info')}

- {form.renderEmailInput()} - {form.renderTypeOfUseSelect()} - {form.renderBillingNameInput()} - {form.renderCountrySelect()} - {form.renderAdditionalInfo()} - - )} - {this.state.coupon && ( -
{form.renderNextCharge()}
- )} - {form.alertError &&

{form.alertError}

} -
- {form.renderSpinner()} - {form.renderSubmitButton( - translate('onboarding.create_organization.create_and_upgrade') - )} -
- {form.renderTermsOfService()} -
- )} - -
- ); - } -} - -export default withCurrentUser(CouponForm); diff --git a/server/sonar-web/src/main/js/apps/create/organization/PaymentMethodSelect.tsx b/server/sonar-web/src/main/js/apps/create/organization/PaymentMethodSelect.tsx deleted file mode 100644 index ddf53728c55..00000000000 --- a/server/sonar-web/src/main/js/apps/create/organization/PaymentMethodSelect.tsx +++ /dev/null @@ -1,57 +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 RadioToggle from '../../../components/controls/RadioToggle'; -import { translate } from '../../../helpers/l10n'; - -export enum PaymentMethod { - Card = 'card', - Coupon = 'coupon' -} - -interface Props { - onChange: (paymentMethod: PaymentMethod) => void; - paymentMethod: PaymentMethod | undefined; -} - -export default class PaymentMethodSelect extends React.PureComponent { - render() { - const options = Object.values(PaymentMethod).map(value => ({ - label: translate('billing', value), - value - })); - - return ( -
- -
- -
-
- ); - } -} diff --git a/server/sonar-web/src/main/js/apps/create/organization/PlanStep.tsx b/server/sonar-web/src/main/js/apps/create/organization/PlanStep.tsx index f715a4f4d48..5118540ce81 100644 --- a/server/sonar-web/src/main/js/apps/create/organization/PlanStep.tsx +++ b/server/sonar-web/src/main/js/apps/create/organization/PlanStep.tsx @@ -18,9 +18,8 @@ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. */ import * as React from 'react'; -import PaymentMethodSelect, { PaymentMethod } from './PaymentMethodSelect'; -import CardForm from './CardForm'; -import CouponForm from './CouponForm'; +import BillingFormShim from './BillingFormShim'; +import { withCurrentUser } from './withCurrentUser'; import PlanSelect, { Plan } from './PlanSelect'; import Step from '../../tutorials/components/Step'; import { translate } from '../../../helpers/l10n'; @@ -29,6 +28,8 @@ import { SubscriptionPlan } from '../../../app/types'; import { SubmitButton } from '../../../components/ui/buttons'; import DeferredSpinner from '../../../components/common/DeferredSpinner'; +const BillingForm = withCurrentUser(BillingFormShim); + interface Props { createOrganization: () => Promise; deleteOrganization: () => void; @@ -41,7 +42,6 @@ interface Props { } interface State { - paymentMethod?: PaymentMethod; plan: Plan; ready: boolean; submitting: boolean; @@ -79,10 +79,6 @@ export default class PlanStep extends React.PureComponent { this.setState({ plan }); }; - handlePaymentMethodChange = (paymentMethod: PaymentMethod) => { - this.setState({ paymentMethod }); - }; - stopSubmitting = () => { if (this.mounted) { this.setState({ submitting: false }); @@ -108,27 +104,22 @@ export default class PlanStep extends React.PureComponent { )} {this.state.plan === Plan.Paid ? ( - <> - - {this.state.paymentMethod === PaymentMethod.Card && ( - - )} - {this.state.paymentMethod === PaymentMethod.Coupon && ( - + + {({ onSubmit, renderFormFields, renderSubmitGroup }) => ( +
+ {renderFormFields()} +
+ {renderSubmitGroup( + translate('onboarding.create_organization.create_and_upgrade') + )} +
+
)} - + ) : (
diff --git a/server/sonar-web/src/main/js/apps/create/organization/__mocks__/BillingFormShim.tsx b/server/sonar-web/src/main/js/apps/create/organization/__mocks__/BillingFormShim.tsx index 4c9b4e3596a..48f5e0dc984 100644 --- a/server/sonar-web/src/main/js/apps/create/organization/__mocks__/BillingFormShim.tsx +++ b/server/sonar-web/src/main/js/apps/create/organization/__mocks__/BillingFormShim.tsx @@ -24,22 +24,9 @@ export default class BillingFormShim extends React.Component<{ children: any }> return (
{this.props.children({ - alertError: undefined, - couponValue: '', onSubmit: jest.fn(), - renderAdditionalInfo: () =>
, - renderBillingNameInput: () =>
, - renderBraintreeClient: () =>
, - renderCountrySelect: () =>
, - renderCouponInput: () =>
, - renderEmailInput: () =>
, - renderNextCharge: () =>
, - renderPlanSelect: () =>
, - renderResetButton: () =>
, - renderSpinner: () =>
, - renderSubmitButton: () =>
, - renderTermsOfService: () =>
, - renderTypeOfUseSelect: () =>
+ renderFormFields: () =>
, + renderSubmitGroup: () =>
})}
); diff --git a/server/sonar-web/src/main/js/apps/create/organization/__tests__/BillingFormShim-test.tsx b/server/sonar-web/src/main/js/apps/create/organization/__tests__/BillingFormShim-test.tsx index 91e2eb8a4ef..71119febaf6 100644 --- a/server/sonar-web/src/main/js/apps/create/organization/__tests__/BillingFormShim-test.tsx +++ b/server/sonar-web/src/main/js/apps/create/organization/__tests__/BillingFormShim-test.tsx @@ -38,7 +38,6 @@ it('should render', () => { shallow( diff --git a/server/sonar-web/src/main/js/apps/create/organization/__tests__/CardForm-test.tsx b/server/sonar-web/src/main/js/apps/create/organization/__tests__/CardForm-test.tsx deleted file mode 100644 index 0d8c015ad02..00000000000 --- a/server/sonar-web/src/main/js/apps/create/organization/__tests__/CardForm-test.tsx +++ /dev/null @@ -1,38 +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 { shallow } from 'enzyme'; -import { CardForm } from '../CardForm'; - -jest.mock('../BillingFormShim'); - -it('should render', () => { - const wrapper = shallow( - - ); - expect(wrapper).toMatchSnapshot(); - expect(wrapper.find('BillingFormShim').dive()).toMatchSnapshot(); -}); diff --git a/server/sonar-web/src/main/js/apps/create/organization/__tests__/CouponForm-test.tsx b/server/sonar-web/src/main/js/apps/create/organization/__tests__/CouponForm-test.tsx deleted file mode 100644 index 110e213413c..00000000000 --- a/server/sonar-web/src/main/js/apps/create/organization/__tests__/CouponForm-test.tsx +++ /dev/null @@ -1,36 +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 { shallow } from 'enzyme'; -import { CouponForm } from '../CouponForm'; - -jest.mock('../BillingFormShim'); - -it('should render', () => { - const wrapper = shallow( - - ); - expect(wrapper).toMatchSnapshot(); -}); diff --git a/server/sonar-web/src/main/js/apps/create/organization/__tests__/PaymentMethodSelect-test.tsx b/server/sonar-web/src/main/js/apps/create/organization/__tests__/PaymentMethodSelect-test.tsx deleted file mode 100644 index fea97e71637..00000000000 --- a/server/sonar-web/src/main/js/apps/create/organization/__tests__/PaymentMethodSelect-test.tsx +++ /dev/null @@ -1,34 +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 { shallow } from 'enzyme'; -import PaymentMethodSelect, { PaymentMethod } from '../PaymentMethodSelect'; - -it('should render and change', () => { - const onChange = jest.fn(); - const wrapper = shallow(); - expect(wrapper).toMatchSnapshot(); - - wrapper.find('RadioToggle').prop('onCheck')(PaymentMethod.Card); - expect(onChange).toBeCalledWith(PaymentMethod.Card); - - wrapper.setProps({ paymentMethod: PaymentMethod.Card }); - expect(wrapper).toMatchSnapshot(); -}); diff --git a/server/sonar-web/src/main/js/apps/create/organization/__tests__/PlanStep-test.tsx b/server/sonar-web/src/main/js/apps/create/organization/__tests__/PlanStep-test.tsx index ff6937f0014..876a20f0bfd 100644 --- a/server/sonar-web/src/main/js/apps/create/organization/__tests__/PlanStep-test.tsx +++ b/server/sonar-web/src/main/js/apps/create/organization/__tests__/PlanStep-test.tsx @@ -22,7 +22,6 @@ import { shallow } from 'enzyme'; import PlanStep from '../PlanStep'; import { waitAndUpdate, click } from '../../../../helpers/testUtils'; import { Plan } from '../PlanSelect'; -import { PaymentMethod } from '../PaymentMethodSelect'; jest.mock('../../../../app/components/extensions/utils', () => ({ getExtensionStart: jest.fn().mockResolvedValue(undefined) @@ -49,7 +48,7 @@ it('should render and use free plan', async () => { expect(onFreePlanChoose).toBeCalled(); }); -it('should upgrade using card', async () => { +it('should upgrade', async () => { const onPaidPlanChoose = jest.fn(); const wrapper = shallow( { wrapper .dive() - .find('PaymentMethodSelect') - .prop('onChange')(PaymentMethod.Card); - expect(wrapper.dive()).toMatchSnapshot(); - - wrapper - .dive() - .find('Connect(withCurrentUser(CardForm))') - .prop('onSubmit')(); - expect(onPaidPlanChoose).toBeCalled(); -}); - -it('should upgrade using coupon', async () => { - const onPaidPlanChoose = jest.fn(); - const wrapper = shallow( - - ); - await waitAndUpdate(wrapper); - - wrapper - .dive() - .find('PlanSelect') - .prop('onChange')(Plan.Paid); - expect(wrapper.dive()).toMatchSnapshot(); - - wrapper - .dive() - .find('PaymentMethodSelect') - .prop('onChange')(PaymentMethod.Coupon); - expect(wrapper.dive()).toMatchSnapshot(); - - wrapper - .dive() - .find('Connect(withCurrentUser(CouponForm))') - .prop('onSubmit')(); + .find('Connect(withCurrentUser(BillingFormShim))') + .prop('onCommit')(); expect(onPaidPlanChoose).toBeCalled(); }); diff --git a/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/BillingFormShim-test.tsx.snap b/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/BillingFormShim-test.tsx.snap index 5ed8a8cf920..3ab9b1995c6 100644 --- a/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/BillingFormShim-test.tsx.snap +++ b/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/BillingFormShim-test.tsx.snap @@ -7,7 +7,6 @@ exports[`should render 1`] = ` "isLoggedIn": false, } } - onClose={[MockFunction]} onCommit={[MockFunction]} organizationKey="org" subscriptionPlans={Array []} diff --git a/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/CardForm-test.tsx.snap b/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/CardForm-test.tsx.snap deleted file mode 100644 index 6d8afdea20e..00000000000 --- a/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/CardForm-test.tsx.snap +++ /dev/null @@ -1,107 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`should render 1`] = ` -
- -
-`; - -exports[`should render 2`] = ` -
-
-
-
-

- billing.upgrade.billing_info -

-
-
-
-
-
-
-
-

- billing.upgrade.plan -

-
-

- billing.upgrade.card_info -

-
-
-
-
-
-
-
-
-
-
-
-
- -
-`; diff --git a/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/CouponForm-test.tsx.snap b/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/CouponForm-test.tsx.snap deleted file mode 100644 index b6a054b1c6b..00000000000 --- a/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/CouponForm-test.tsx.snap +++ /dev/null @@ -1,22 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`should render 1`] = ` -
- -
-`; diff --git a/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/PaymentMethodSelect-test.tsx.snap b/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/PaymentMethodSelect-test.tsx.snap deleted file mode 100644 index 101582f6012..00000000000 --- a/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/PaymentMethodSelect-test.tsx.snap +++ /dev/null @@ -1,79 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`should render and change 1`] = ` -
- -
- -
-
-`; - -exports[`should render and change 2`] = ` -
- -
- -
-
-`; diff --git a/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/PlanStep-test.tsx.snap b/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/PlanStep-test.tsx.snap index 099c34d7256..d727d30c24b 100644 --- a/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/PlanStep-test.tsx.snap +++ b/server/sonar-web/src/main/js/apps/create/organization/__tests__/__snapshots__/PlanStep-test.tsx.snap @@ -35,11 +35,12 @@ exports[`should preselect paid plan 2`] = ` className="boxed-group-inner" > - - - +
@@ -102,46 +103,7 @@ exports[`should render and use free plan 2`] = `
`; -exports[`should upgrade using card 1`] = ` -
-
- 2 -
-
-

- onboarding.create_organization.choose_plan -

-
-
-
- - - - - - -
-
-
-`; - -exports[`should upgrade using card 2`] = ` +exports[`should upgrade 1`] = `
@@ -169,102 +131,12 @@ exports[`should upgrade using card 2`] = ` plan="paid" startingPrice="10" /> - - - - - -
-
-
-`; - -exports[`should upgrade using coupon 1`] = ` -
-
- 2 -
-
-

- onboarding.create_organization.choose_plan -

-
-
-
- - - - - - -
-
-
-`; - -exports[`should upgrade using coupon 2`] = ` -
-
- 2 -
-
-

- onboarding.create_organization.choose_plan -

-
-
-
- - - - - -
diff --git a/server/sonar-web/src/main/js/apps/tutorials/styles.css b/server/sonar-web/src/main/js/apps/tutorials/styles.css index e7cc5a727f6..86f633a3a3b 100644 --- a/server/sonar-web/src/main/js/apps/tutorials/styles.css +++ b/server/sonar-web/src/main/js/apps/tutorials/styles.css @@ -32,6 +32,10 @@ line-height: var(--controlHeight); } +.onboarding-step hr { + margin-left: -54px; +} + .onboarding-step-number { position: absolute; top: 15px; diff --git a/server/sonar-web/src/main/js/components/controls/HelpTooltip.tsx b/server/sonar-web/src/main/js/components/controls/HelpTooltip.tsx index bc68b868f4d..0cba9b66e12 100644 --- a/server/sonar-web/src/main/js/components/controls/HelpTooltip.tsx +++ b/server/sonar-web/src/main/js/components/controls/HelpTooltip.tsx @@ -19,7 +19,7 @@ */ import * as React from 'react'; import * as classNames from 'classnames'; -import Tooltip from './Tooltip'; +import Tooltip, { Placement } from './Tooltip'; import HelpIcon from '../icons-components/HelpIcon'; import * as theme from '../../app/theme'; import './HelpTooltip.css'; @@ -29,6 +29,7 @@ interface Props { children?: React.ReactNode; onShow?: () => void; overlay: React.ReactNode; + placement?: Placement; tagName?: string; } @@ -38,7 +39,11 @@ export default function HelpTooltip(props: Props) { return React.createElement( tagName, { className: classNames('help-tooltip', props.className) }, - + {children} ); diff --git a/sonar-core/src/main/resources/org/sonar/l10n/core.properties b/sonar-core/src/main/resources/org/sonar/l10n/core.properties index 8efcf61cb77..c92d9182976 100644 --- a/sonar-core/src/main/resources/org/sonar/l10n/core.properties +++ b/sonar-core/src/main/resources/org/sonar/l10n/core.properties @@ -2736,7 +2736,6 @@ onboarding.create_organization.description=Description onboarding.create_organization.enter_org_details=Enter your organization details onboarding.create_organization.enter_payment_details=Enter payment details onboarding.create_organization.choose_plan=Choose a plan -onboarding.create_organization.choose_payment_method=Choose payment solution onboarding.create_organization.enter_your_coupon=Enter your coupon onboarding.create_organization.create_and_upgrade=Create Organization and Upgrade onboarding.create_organization.ready=All set! Your organization is now ready to go -- 2.39.5