Improve textinput performance in login and account creation (#4673)

* Change login form to use uncontrolled inputs

* Debounce state updates in account creation to reduce flicker

* Refactor state-control of account creation forms to fix perf without relying on debounces

* Remove canNext and enforce is13

* Re-add live validation to signup form (#4720)

* Update validation in real time

* Disable on invalid

* Clear server error on typing

* Remove unnecessary clearing of error

---------

Co-authored-by: Dan Abramov <dan.abramov@gmail.com>

1 files changed, 16 insertions, 0 deletions

diff --git a/src/screens/Signup/StepCaptcha/index.tsx b/src/screens/Signup/StepCaptcha/index.tsx
index b2a91a641..bf3576490 100644
--- a/src/screens/Signup/StepCaptcha/index.tsx
+++ b/src/screens/Signup/StepCaptcha/index.tsx
@@ -12,6 +12,7 @@ import {useSignupContext, useSubmitSignup} from '#/screens/Signup/state'
 import {CaptchaWebView} from '#/screens/Signup/StepCaptcha/CaptchaWebView'
 import {atoms as a, useTheme} from '#/alf'
 import {FormError} from '#/components/forms/FormError'
+import {BackNextButtons} from '../BackNextButtons'
 
 const CAPTCHA_PATH = '/gate/signup'
 
@@ -61,6 +62,16 @@ export function StepCaptcha() {
     [_, dispatch, state.handle],
   )
 
+  const onBackPress = React.useCallback(() => {
+    logger.error('Signup Flow Error', {
+      errorMessage:
+        'User went back from captcha step. Possibly encountered an error.',
+      registrationHandle: state.handle,
+    })
+
+    dispatch({type: 'prev'})
+  }, [dispatch, state.handle])
+
   return (
     <ScreenTransition>
       <View style={[a.gap_lg]}>
@@ -86,6 +97,11 @@ export function StepCaptcha() {
         </View>
         <FormError error={state.error} />
       </View>
+      <BackNextButtons
+        hideNext
+        isLoading={state.isLoading}
+        onBackPress={onBackPress}
+      />
     </ScreenTransition>
   )
 }