Revert "Allow for string values passed to Formik setter"

This reverts commit d3ff3e3.
thesis · Aug 13, 2024 · 29245a1 · 29245a1
1 parent bd10ec7
commit 29245a1
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 48 deletions.
diff --git a/dapp/src/components/shared/Form/FormTokenBalanceInput.tsx b/dapp/src/components/shared/Form/FormTokenBalanceInput.tsx
@@ -16,7 +16,7 @@ export function FormTokenBalanceInput({
   const [field, meta, helpers] = useField(name)
 
   const setAmount = useCallback(
-    (value?: bigint | string) => {
+    (value?: bigint) => {
       if (!meta.touched) logPromiseFailure(helpers.setTouched(true))
       logPromiseFailure(helpers.setValue(value))
     },

diff --git a/dapp/src/components/shared/TokenAmountForm/TokenAmountFormBase.tsx b/dapp/src/components/shared/TokenAmountForm/TokenAmountFormBase.tsx
@@ -6,7 +6,7 @@ import { Form, FormTokenBalanceInput } from "../Form"
 const TOKEN_AMOUNT_FIELD_NAME = "amount"
 
 export type TokenAmountFormValues = {
-  [TOKEN_AMOUNT_FIELD_NAME]?: bigint | string
+  [TOKEN_AMOUNT_FIELD_NAME]?: bigint
 }
 
 export const useTokenAmountField = () => {

diff --git a/dapp/src/components/shared/TokenAmountForm/index.tsx b/dapp/src/components/shared/TokenAmountForm/index.tsx
@@ -1,10 +1,5 @@
 import { FormikErrors, withFormik } from "formik"
-import {
-  getCurrencyByType,
-  getErrorsObj,
-  userAmountToBigInt,
-  validateTokenAmount,
-} from "#/utils"
+import { getErrorsObj, validateTokenAmount } from "#/utils"
 import { ActionFlowType, BaseFormProps } from "#/types"
 import TokenAmountFormBase, {
   TokenAmountFormBaseProps,
@@ -28,15 +23,9 @@ const TokenAmountForm = withFormik<TokenAmountFormProps, TokenAmountFormValues>(
     ) => {
       const errors: FormikErrors<TokenAmountFormValues> = {}
 
-      const { decimals } = getCurrencyByType(currency)
-      const bigIntAmount =
-        typeof amount === "string"
-          ? userAmountToBigInt(amount, decimals)
-          : amount
-
       errors.amount = validateTokenAmount(
         actionType,
-        bigIntAmount,
+        amount,
         tokenBalance,
         minTokenAmount,
         currency,

diff --git a/dapp/src/components/shared/TokenBalanceInput/index.tsx b/dapp/src/components/shared/TokenBalanceInput/index.tsx
@@ -1,4 +1,4 @@
-import React, { useMemo, useRef } from "react"
+import React, { useRef } from "react"
 import {
   Box,
   Button,
@@ -14,7 +14,6 @@ import {
 } from "@chakra-ui/react"
 import {
   bigIntToUserAmount,
-  fixedPointNumberToString,
   getCurrencyByType,
   getTokenAmountErrorKey,
   userAmountToBigInt,
@@ -102,13 +101,13 @@ function FiatCurrencyBalance({
 }
 
 export type TokenBalanceInputProps = {
-  amount?: bigint | string
+  amount?: bigint
   currency: CurrencyType
   tokenBalance: bigint
   placeholder?: string
   size?: "lg" | "md"
   fiatCurrency?: CurrencyType
-  setAmount: (value?: bigint | string) => void
+  setAmount: (value?: bigint) => void
   withMaxButton?: boolean
 } & InputProps &
   HelperErrorTextProps &
@@ -128,24 +127,11 @@ export default function TokenBalanceInput({
   withMaxButton = false,
   ...inputProps
 }: TokenBalanceInputProps) {
-  const valueRef = useRef<bigint | string | undefined>(amount)
+  const valueRef = useRef<bigint | undefined>(amount)
   const styles = useMultiStyleConfig("TokenBalanceInput", { size })
 
   const { decimals, desiredDecimals } = getCurrencyByType(currency)
 
-  const amountValue = useMemo(() => {
-    if (typeof amount === "string") {
-      return amount
-    }
-
-    return amount
-      ? bigIntToUserAmount(amount, decimals, desiredDecimals)
-      : undefined
-  }, [amount, decimals, desiredDecimals])
-
-  const bigIntAmount =
-    typeof amount === "string" ? userAmountToBigInt(amount, decimals) : amount
-
   const handleValueChange = (value: string) => {
     valueRef.current = value ? userAmountToBigInt(value, decimals) : undefined
   }
@@ -179,7 +165,11 @@ export default function TokenBalanceInput({
           isInvalid={hasError}
           placeholder={placeholder}
           {...inputProps}
-          value={amountValue}
+          value={
+            amount
+              ? bigIntToUserAmount(amount, decimals, desiredDecimals)
+              : undefined
+          }
           onValueChange={(values: NumberFormatInputValues) =>
             handleValueChange(values.value)
           }
@@ -192,12 +182,7 @@ export default function TokenBalanceInput({
 
         {withMaxButton && (
           <InputRightElement>
-            <Button
-              h="70%"
-              onClick={() =>
-                setAmount(fixedPointNumberToString(tokenBalance, decimals))
-              }
-            >
+            <Button h="70%" onClick={() => setAmount(tokenBalance)}>
               Max
             </Button>
           </InputRightElement>
@@ -211,7 +196,7 @@ export default function TokenBalanceInput({
       {!hasError && !helperText && !!fiatCurrency && (
         <FormHelperText>
           <FiatCurrencyBalance
-            amount={bigIntAmount ?? 0n}
+            amount={amount ?? 0n}
             currency={currency}
             fiatCurrency={fiatCurrency}
           />

diff --git a/dapp/src/utils/numbers.ts b/dapp/src/utils/numbers.ts
@@ -213,10 +213,3 @@ export const addLeadingZero = (num: number): string =>
 
 export const getPercentValue = (value: number, maxValue: number) =>
   (value * 100) / maxValue
-
-export const getBigIntDecimalsLength = (value: bigint, decimals: number) => {
-  const valueStr = fixedPointNumberToString(value, decimals)
-  const decimalIndex = valueStr.indexOf(".")
-
-  return decimalIndex === -1 ? 0 : valueStr.length - decimalIndex - 1
-}