From 91ef2a164e16a3410c3ba4e2848ee6452b735bee Mon Sep 17 00:00:00 2001
From: h3rt <94856309+SecretSaturn@users.noreply.github.com>
Date: Sun, 22 Sep 2024 15:14:58 +0200
Subject: [PATCH] Percentage Picker & Minimum input improvements

---
 src/pages/ibc/components/IbcForm.tsx   | 12 ++++++------
 src/pages/ibc/components/ibcSchema.ts  | 17 ++++++++++++++---
 src/pages/send/components/SendForm.tsx | 12 ++++++------
 src/pages/send/sendSchema.ts           | 15 +++++++++++++--
 src/pages/wrap/components/WrapForm.tsx | 14 ++++++++------
 src/pages/wrap/wrapSchema.ts           | 15 +++++++++++++--
 6 files changed, 60 insertions(+), 25 deletions(-)

diff --git a/src/pages/ibc/components/IbcForm.tsx b/src/pages/ibc/components/IbcForm.tsx
index 981ccebd..4c446c49 100644
--- a/src/pages/ibc/components/IbcForm.tsx
+++ b/src/pages/ibc/components/IbcForm.tsx
@@ -119,12 +119,12 @@ export default function IbcForm() {
         (balance !== ('viewingKeyError' as GetBalanceError) || balance !== ('GenericFetchError' as GetBalanceError)) &&
         balance !== null
       ) {
-        formik.setFieldValue(
-          'amount',
-          Number((balance as BigNumber).dividedBy(`1e${formik.values.token.decimals}`).times(percentage / 100)).toFixed(
-            formik.values.token.decimals
-          )
-        )
+        const scaledAmount = (balance as BigNumber)
+          .times(percentage / 100)
+          .dividedBy(`1e${formik.values.token.decimals}`)
+          .decimalPlaces(formik.values.token.decimals, BigNumber.ROUND_DOWN)
+
+        formik.setFieldValue('amount', scaledAmount.toFixed(formik.values.token.decimals))
       }
     } else if (formik.values.ibcMode === 'deposit') {
       const IbcBalance = getIbcBalance(formik.values.chain, formik.values.token)
diff --git a/src/pages/ibc/components/ibcSchema.ts b/src/pages/ibc/components/ibcSchema.ts
index 8292f973..cea3544d 100644
--- a/src/pages/ibc/components/ibcSchema.ts
+++ b/src/pages/ibc/components/ibcSchema.ts
@@ -5,9 +5,20 @@ import { chains } from 'utils/config'
 export const ibcSchema = yup.object().shape({
   amount: yup
     .number()
-    .min(0.000001, 'Please enter a valid amount')
     .typeError('Please enter a valid amount')
-    .required('Please enter a valid amount'),
+    .required('Please enter a valid amount')
+    .test('min-amount', 'Please enter a valid amount', function (value) {
+      const { token } = this.parent
+      if (token && typeof token.decimals === 'number') {
+        const minAmount = Math.pow(10, -token.decimals)
+        if (value < minAmount) {
+          return this.createError({
+            message: `Please enter an amount of at least ${minAmount}`
+          })
+        }
+      }
+      return true
+    }),
   token: yup.mixed().required('Token is required'),
   chain: yup
     .mixed()
@@ -17,6 +28,6 @@ export const ibcSchema = yup.object().shape({
     ),
   ibcMode: yup
     .string()
-    .test('isIbcMode', 'Invalid IBC Mode', (value) => isIbcMode(value))
     .required('Please pick an IBC Mode')
+    .test('isIbcMode', 'Invalid IBC Mode', (value) => isIbcMode(value))
 })
diff --git a/src/pages/send/components/SendForm.tsx b/src/pages/send/components/SendForm.tsx
index 6faa0a06..98da96a9 100644
--- a/src/pages/send/components/SendForm.tsx
+++ b/src/pages/send/components/SendForm.tsx
@@ -126,12 +126,12 @@ export default function SendForm() {
       (balance !== ('viewingKeyError' as GetBalanceError) || balance !== ('GenericFetchError' as GetBalanceError)) &&
       balance !== null
     ) {
-      formik.setFieldValue(
-        'amount',
-        Number((balance as BigNumber).dividedBy(`1e${formik.values.token.decimals}`).times(percentage / 100)).toFixed(
-          formik.values.token.decimals
-        )
-      )
+      const scaledAmount = (balance as BigNumber)
+        .times(percentage / 100)
+        .dividedBy(`1e${formik.values.token.decimals}`)
+        .decimalPlaces(formik.values.token.decimals, BigNumber.ROUND_DOWN)
+
+      formik.setFieldValue('amount', scaledAmount.toFixed(formik.values.token.decimals))
     }
     formik.setFieldTouched('amount', true)
   }
diff --git a/src/pages/send/sendSchema.ts b/src/pages/send/sendSchema.ts
index b2e1490d..df76c690 100644
--- a/src/pages/send/sendSchema.ts
+++ b/src/pages/send/sendSchema.ts
@@ -4,9 +4,20 @@ import { validateAddress } from 'secretjs'
 export const sendSchema = yup.object().shape({
   amount: yup
     .number()
-    .min(0.000001, 'Please enter a valid amount')
     .typeError('Please enter a valid amount')
-    .required('Please enter a valid amount'),
+    .required('Please enter a valid amount')
+    .test('min-amount', 'Please enter a valid amount', function (value) {
+      const { token } = this.parent
+      if (token && typeof token.decimals === 'number') {
+        const minAmount = Math.pow(10, -token.decimals)
+        if (value < minAmount) {
+          return this.createError({
+            message: `Please enter an amount of at least ${minAmount}`
+          })
+        }
+      }
+      return true
+    }),
   token: yup.mixed().required('Token is required'),
   recipient: yup
     .string()
diff --git a/src/pages/wrap/components/WrapForm.tsx b/src/pages/wrap/components/WrapForm.tsx
index cc04350a..8c85ae80 100644
--- a/src/pages/wrap/components/WrapForm.tsx
+++ b/src/pages/wrap/components/WrapForm.tsx
@@ -145,17 +145,19 @@ export default function WrapForm() {
 
   function setAmountByPercentage(percentage: number) {
     const balance = getBalance(formik.values.token, formik.values.wrappingMode === 'unwrap')
+
     if (
       (balance !== ('viewingKeyError' as GetBalanceError) || balance !== ('GenericFetchError' as GetBalanceError)) &&
       balance !== null
     ) {
-      formik.setFieldValue(
-        'amount',
-        Number((balance as BigNumber).dividedBy(`1e${formik.values.token.decimals}`).times(percentage / 100)).toFixed(
-          formik.values.token.decimals
-        )
-      )
+      const scaledAmount = (balance as BigNumber)
+        .times(percentage / 100)
+        .dividedBy(`1e${formik.values.token.decimals}`)
+        .decimalPlaces(formik.values.token.decimals, BigNumber.ROUND_DOWN)
+
+      formik.setFieldValue('amount', scaledAmount.toFixed(formik.values.token.decimals))
     }
+
     formik.setFieldTouched('amount', true)
   }
 
diff --git a/src/pages/wrap/wrapSchema.ts b/src/pages/wrap/wrapSchema.ts
index 35a4ab9f..f71ebd97 100644
--- a/src/pages/wrap/wrapSchema.ts
+++ b/src/pages/wrap/wrapSchema.ts
@@ -5,9 +5,20 @@ import { tokens } from 'utils/config'
 export const wrapSchema = yup.object().shape({
   amount: yup
     .number()
-    .min(0.000001, 'Please enter a valid amount')
     .typeError('Please enter a valid amount')
-    .required('Please enter a valid amount'),
+    .required('Please enter a valid amount')
+    .test('min-amount', 'Please enter a valid amount', function (value) {
+      const { token } = this.parent
+      if (token && typeof token.decimals === 'number') {
+        const minAmount = Math.pow(10, -token.decimals)
+        if (value < minAmount) {
+          return this.createError({
+            message: `Please enter an amount of at least ${minAmount}`
+          })
+        }
+      }
+      return true
+    }),
   token: yup.mixed().required('Token is required'),
   wrappingMode: yup
     .string()