dApp: Deposit form UX updates (#890)

Closes: #891 There was an issue with unexpected validation triggers on field focus. To resolve it it was mandatory to disable on blur validation. Also disabled form field auto focus so it won't unnecessarily cover the UI.
thesis · Nov 22, 2024 · 51788f6 · 51788f6
2 parents 94b72a6 + 96f2e13
commit 51788f6
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 1 deletion.
diff --git a/dapp/src/components/shared/TokenAmountForm/TokenAmountFormBase.tsx b/dapp/src/components/shared/TokenAmountForm/TokenAmountFormBase.tsx
@@ -42,6 +42,7 @@ export default function TokenAmountFormBase({
         withMaxButton={withMaxButton}
         defaultAmount={defaultAmount}
         autoFocus
+        autoComplete="off"
       />
       {children}
     </Form>

diff --git a/dapp/src/components/shared/TokenAmountForm/index.tsx b/dapp/src/components/shared/TokenAmountForm/index.tsx
@@ -36,7 +36,7 @@ const TokenAmountForm = withFormik<TokenAmountFormProps, TokenAmountFormValues>(
     handleSubmit: (values, { props }) => {
       props.onSubmitForm(values)
     },
-    validateOnBlur: true,
+    validateOnBlur: false,
     validateOnChange: false,
   },
 )(TokenAmountFormBase)