chore: tx fee value and unit can be undefined

joinmarket-webui · Dec 15, 2023 · 876f575 · 876f575
1 parent f10b18f
commit 876f575
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 58 deletions.
diff --git a/src/components/settings/TxFeeInputField.tsx b/src/components/settings/TxFeeInputField.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react'
+import { useMemo } from 'react'
 import * as rb from 'react-bootstrap'
 import { useTranslation } from 'react-i18next'
 import { TFunction } from 'i18next'
@@ -18,29 +18,14 @@ const TX_FEES_SATSPERKILOVBYTE_MIN: SatsPerKiloVByte = 1_001 // actual min of `t
 // 350 sats/vbyte - no enforcement by JM - this should be a "sane" max value (taken default value of "absurd_fee_per_kb")
 const TX_FEES_SATSPERKILOVBYTE_MAX: SatsPerKiloVByte = 350_000
 
-const adjustTxFees = (val: TxFee) => {
-  if (val.unit === 'sats/kilo-vbyte') {
-    // There is one special case for value `tx_fees`:
-    // Users are allowed to specify the value in "sats/vbyte", but this might
-    // be interpreted by JM as "targeted blocks". This adaption makes sure
-    // that it is in fact closer to what the user actually expects, albeit it
-    // can be surprising that the value is slightly different as specified.
-    return {
-      ...val,
-      value: Math.max(val.value, TX_FEES_SATSPERKILOVBYTE_MIN),
-    }
-  }
-  return val
-}
-
 export const validateTxFee = (val: TxFee | undefined, t: TFunction): FormikErrors<TxFee> => {
   const errors = {} as FormikErrors<TxFee>
 
   if (val?.unit === 'sats/kilo-vbyte') {
     if (
       !isValidNumber(val.value) ||
-      val.value < TX_FEES_SATSPERKILOVBYTE_MIN ||
-      val.value > TX_FEES_SATSPERKILOVBYTE_MAX
+      val.value! < TX_FEES_SATSPERKILOVBYTE_MIN ||
+      val.value! > TX_FEES_SATSPERKILOVBYTE_MAX
     ) {
       errors.value = t('settings.fees.feedback_invalid_tx_fees_satspervbyte', {
         min: (TX_FEES_SATSPERKILOVBYTE_MIN / 1_000).toLocaleString(undefined, {
@@ -71,11 +56,7 @@ type TxFeeInputFieldProps = FieldProps<TxFee | undefined> & {
 export const TxFeeInputField = ({ field, form, label, className }: TxFeeInputFieldProps) => {
   const { t } = useTranslation()
 
-  const [unitDisplayValue, setUnitDisplayValue] = useState(field.value?.unit || TX_FEES_DEFAULT_UNIT)
-
-  useEffect(() => {
-    setUnitDisplayValue(field.value?.unit || TX_FEES_DEFAULT_UNIT)
-  }, [field.value])
+  const unitDisplayValue = useMemo(() => field.value?.unit || TX_FEES_DEFAULT_UNIT, [field.value?.unit])
 
   return (
     <>
@@ -97,28 +78,26 @@ export const TxFeeInputField = ({ field, form, label, className }: TxFeeInputFie
           disabled={form.isSubmitting}
           onChange={(tab) => {
             const unit = tab.value as TxFeeValueUnit
-            setUnitDisplayValue(unit)
 
-            if (field.value) {
-              if (unit === 'sats/kilo-vbyte') {
-                form.setFieldValue(
-                  field.name,
-                  adjustTxFees({
-                    value: Math.round(field.value.value * 1_000),
-                    unit,
-                  }),
-                  true,
-                )
-              } else {
-                form.setFieldValue(
-                  field.name,
-                  adjustTxFees({
-                    value: Math.round(field.value.value / 1_000),
-                    unit,
-                  }),
-                  true,
-                )
-              }
+            form.setFieldTouched(field.name, true)
+            if (unit === 'sats/kilo-vbyte') {
+              form.setFieldValue(
+                field.name,
+                {
+                  value: field.value?.value ? Math.round(field.value.value * 1_000) : field.value?.value,
+                  unit,
+                },
+                true,
+              )
+            } else {
+              form.setFieldValue(
+                field.name,
+                {
+                  value: field.value?.value ? Math.round(field.value.value / 1_000) : field.value?.value,
+                  unit,
+                },
+                true,
+              )
             }
           }}
         />
@@ -149,17 +128,17 @@ export const TxFeeInputField = ({ field, form, label, className }: TxFeeInputFie
               name={field.name}
               type="number"
               placeholder="1"
-              value={isValidNumber(field.value?.value) ? field.value!.value / 1_000 : ''}
+              value={isValidNumber(field.value?.value) ? field.value!.value! / 1_000 : ''}
               disabled={form.isSubmitting}
               onBlur={field.onBlur}
               onChange={(e) => {
                 const value = parseFloat(e.target.value)
                 form.setFieldValue(
                   field.name,
-                  adjustTxFees({
+                  {
                     value: Math.round(value * 1_000),
                     unit: 'sats/kilo-vbyte',
-                  }),
+                  },
                   true,
                 )
               }}
@@ -181,14 +160,7 @@ export const TxFeeInputField = ({ field, form, label, className }: TxFeeInputFie
               onBlur={field.onBlur}
               onChange={(e) => {
                 const value = parseInt(e.target.value, 10)
-                form.setFieldValue(
-                  field.name,
-                  adjustTxFees({
-                    value,
-                    unit: 'blocks',
-                  }),
-                  true,
-                )
+                form.setFieldValue(field.name, { value, unit: 'blocks' }, true)
               }}
               isValid={form.touched[field.name] && !form.errors[field.name]}
               isInvalid={form.touched[field.name] && !!form.errors[field.name]}

diff --git a/src/hooks/Fees.ts b/src/hooks/Fees.ts
@@ -6,8 +6,8 @@ import { isValidNumber } from '../utils'
 export type TxFeeValueUnit = 'blocks' | 'sats/kilo-vbyte'
 export type TxFeeValue = number
 export type TxFee = {
-  value: TxFeeValue
-  unit: TxFeeValueUnit
+  value?: TxFeeValue
+  unit?: TxFeeValueUnit
 }
 
 export const toTxFeeValueUnit = (val?: TxFeeValue): TxFeeValueUnit | undefined => {
@@ -50,7 +50,7 @@ export const useLoadFeeConfigValues = () => {
         tx_fees: isValidNumber(parsedTxFees)
           ? {
               value: parsedTxFees,
-              unit: toTxFeeValueUnit(parsedTxFees) || 'blocks',
+              unit: toTxFeeValueUnit(parsedTxFees),
             }
           : undefined,
         tx_fees_factor: isValidNumber(parsedTxFeesFactor) ? parsedTxFeesFactor : undefined,