diff --git a/client/components/registration/registration.js b/client/components/registration/registration.js index 95bd81a3..cd26d3a1 100644 --- a/client/components/registration/registration.js +++ b/client/components/registration/registration.js @@ -91,6 +91,7 @@ export default class Registration extends React.Component { logError(error, "Error while fetching plans"); }); } + this.autoSelectFirstPlan(); } async componentDidUpdate(prevProps) { @@ -333,10 +334,12 @@ export default class Registration extends React.Component { }; getPlanSelection = () => { + const {registration} = this.props; const {plans, selectedPlan} = this.state; + const {auto_select_first_plan} = registration; let index = 0; return ( -
+

{t`PLAN_SETTING_TXT`}.

{plans.map((plan) => { const currentIndex = String(index); @@ -366,6 +369,13 @@ export default class Registration extends React.Component { ); }; + autoSelectFirstPlan = () => { + const {registration} = this.props; + if (registration.auto_select_first_plan) { + this.changePlan({target: {value: 0}}); + } + }; + isPlanIdentityVerifier = () => { // If a payment is required, the plan is valid for identity verification const {selectedPlan, plans} = this.state; @@ -960,6 +970,7 @@ Registration.propTypes = { }), additional_info_text: PropTypes.bool, links: PropTypes.object, + auto_select_first_plan: PropTypes.bool, }).isRequired, language: PropTypes.string.isRequired, orgSlug: PropTypes.string.isRequired, diff --git a/client/components/registration/subscriptions.test.js b/client/components/registration/subscriptions.test.js index e3b7b928..9bd55872 100644 --- a/client/components/registration/subscriptions.test.js +++ b/client/components/registration/subscriptions.test.js @@ -5,6 +5,7 @@ import {shallow} from "enzyme"; import React from "react"; import PropTypes from "prop-types"; import {toast} from "react-toastify"; +import {cloneDeep} from "lodash"; import {loadingContextValue} from "../../utils/loading-context"; import tick from "../../utils/tick"; import getConfig from "../../utils/get-config"; @@ -125,6 +126,29 @@ describe("test subscriptions", () => { expect(wrapper.find("input[name='plan_selection']").length).toBe(0); }); + it("should auto select first plan when auto_select_first_plan is true", () => { + axios.mockImplementationOnce(() => + Promise.resolve({ + status: 201, + statusText: "ok", + data: plans, + }), + ); + const customProps = cloneDeep(createTestProps()); + customProps.settings.mobile_phone_verification = true; + customProps.registration.auto_select_first_plan = true; + wrapper = initShallow(customProps); + wrapper.instance().setState({plans, plansFetched: true}); + + expect(wrapper.find(".plans").exists()).toBe(true); + expect(wrapper.find(".plans").hasClass("hidden")).toBe(true); + expect(wrapper.state("selectedPlan")).toEqual(0); + + expect(wrapper.find(".row.register").exists()).toBe(true); + expect(wrapper.find(".row.phone-number").exists()).toBe(true); + expect(wrapper.find(".row.email").exists()).toBe(true); + }); + it("should plan selection when multiple plans are present", () => { axios.mockImplementationOnce(() => Promise.resolve({ diff --git a/organizations/default/default.yml b/organizations/default/default.yml index 07f55b89..e7f9c46a 100644 --- a/organizations/default/default.yml +++ b/organizations/default/default.yml @@ -78,6 +78,7 @@ client: en: "Copyright" registration_form: + auto_select_first_plan: false input_fields: phone_number: {} username: