@@ -17,12 +17,15 @@ import upgradePlan from "../../utils/upgrade-plan";
1717import updateRegistrationMethod from "../../utils/update-registration-method" ;
1818import Contact from "../contact-box" ;
1919
20- const handleFlowError = ( error ) => {
20+ const handleFlowError = ( error , setErrorsState ) => {
2121 const errorText = error . response
2222 ? getErrorText ( error , t `ERR_OCCUR` )
2323 : t `ERR_OCCUR` ;
2424 logError ( error , errorText ) ;
2525 toast . error ( errorText ) ;
26+ if ( setErrorsState ) {
27+ setErrorsState ( { nonfield : [ errorText ] } ) ;
28+ }
2629} ;
2730
2831export default class CompleteSignup extends React . Component {
@@ -35,6 +38,8 @@ export default class CompleteSignup extends React.Component {
3538 plansFetched : false ,
3639 plansError : null ,
3740 selectedPlan : null ,
41+ message : null ,
42+ submitting : false ,
3843 } ;
3944 }
4045
@@ -74,7 +79,7 @@ export default class CompleteSignup extends React.Component {
7479
7580 if ( ! plans || plans . length === 0 ) {
7681 // Empty plans array (200 OK) means org has disabled registration
77- message = t `Registration is currently disabled for this organization ` ;
82+ message = t `ORG_REGISTRATION_DISABLED ` ;
7883 }
7984 this . setStateSafe ( { plans, plansFetched : true , plansError, message} ) ;
8085 setLoading ( false ) ;
@@ -89,10 +94,10 @@ export default class CompleteSignup extends React.Component {
8994 this . setStateSafe ( {
9095 plans : [ ] ,
9196 plansFetched : true ,
92- plansError : t `Failed to load plans ` ,
97+ plansError : t `PLANS_FETCH_ERR ` ,
9398 } ) ;
9499 setLoading ( false ) ;
95- toast . error ( t `Failed to load plans ` ) ;
100+ toast . error ( t `PLANS_FETCH_ERR ` ) ;
96101 } ;
97102
98103 finalOperations = ( nextUserData , route ) => {
@@ -141,7 +146,7 @@ export default class CompleteSignup extends React.Component {
141146 this . finalOperations ( nextUserData , `/${ orgSlug } /status` ) ;
142147 } catch ( error ) {
143148 if ( this . isComponentMounted ) {
144- handleFlowError ( error ) ;
149+ handleFlowError ( error , ( errors ) => this . setStateSafe ( { errors } ) ) ;
145150 setLoading ( false ) ;
146151 }
147152 }
@@ -169,20 +174,20 @@ export default class CompleteSignup extends React.Component {
169174 const { setLoading} = this . context ;
170175 const { orgSlug, userData, setUserData, navigate, settings, language} =
171176 this . props ;
172- const { plans} = this . state ;
177+ const { plans, submitting } = this . state ;
173178 const selectedPlan = plans [ planIndex ] ;
174- if ( ! selectedPlan ) {
179+ if ( ! selectedPlan || submitting ) {
175180 return ;
176181 }
177182
178183 const requiresPayment = selectedPlan . requires_payment === true ;
179- this . setStateSafe ( { errors : { } } ) ;
184+ this . setStateSafe ( { errors : { } , submitting : true } ) ;
180185 setLoading ( true ) ;
181186
182187 try {
183188 // Upgrade to selected plan
184189 let paymentUrl = null ;
185- if ( selectedPlan && selectedPlan . id ) {
190+ if ( selectedPlan . id ) {
186191 const response = await upgradePlan (
187192 orgSlug ,
188193 selectedPlan . id ,
@@ -243,7 +248,9 @@ export default class CompleteSignup extends React.Component {
243248 this . finalOperations ( nextUserData , `/${ orgSlug } /status` ) ;
244249 } catch ( error ) {
245250 if ( this . isComponentMounted ) {
246- handleFlowError ( error ) ;
251+ handleFlowError ( error , ( errors ) =>
252+ this . setStateSafe ( { errors, submitting : false } ) ,
253+ ) ;
247254 setLoading ( false ) ;
248255 }
249256 }
@@ -264,7 +271,7 @@ export default class CompleteSignup extends React.Component {
264271 const { orgSlug, language} = this . props ;
265272 const { setLoading} = this . context ;
266273 setLoading ( true ) ;
267- this . setStateSafe ( { plansError : null , message : null } , ( ) => {
274+ this . setStateSafe ( { errors : { } , plansError : null , message : null } , ( ) => {
268275 getPlans (
269276 orgSlug ,
270277 language ,
@@ -285,7 +292,7 @@ export default class CompleteSignup extends React.Component {
285292 < div className = "inner" >
286293 < h2 className = "row" > { t `REGISTRATION_TITLE` } </ h2 >
287294 < div className = "row" >
288- { t `Please complete your registration to $ {orgName } .` }
295+ { t `REGISTRATION_COMPLETE_PROMPT` } { orgName } .
289296 </ div >
290297 { getError ( errors ) }
291298 { /* HTTP error state - show error with retry button */ }
@@ -297,7 +304,7 @@ export default class CompleteSignup extends React.Component {
297304 className = "btn btn-primary"
298305 onClick = { this . handlePlansRetry }
299306 >
300- { t `Retry ` }
307+ { t `RETRY ` }
301308 </ button >
302309 </ div >
303310 ) }
0 commit comments