fix: edit limit price

Emurgo · Oct 10, 2023 · 8514194 · 8514194
1 parent 2a59320
commit 8514194
Show file tree

Hide file tree

Showing 4 changed files with 54 additions and 38 deletions.
diff --git a/apps/wallet-mobile/src/features/Swap/useCases/StartSwapScreen/CreateOrder/EditLimitPrice.tsx b/apps/wallet-mobile/src/features/Swap/useCases/StartSwapScreen/CreateOrder/EditLimitPrice.tsx
@@ -1,7 +1,7 @@
 /* eslint-disable react/jsx-newline */
 import {useSwap} from '@yoroi/swap'
 import * as React from 'react'
-import {StyleSheet, Text, TextInput, View} from 'react-native'
+import {Pressable, StyleSheet, Text, TextInput, View} from 'react-native'
 
 import {useLanguage} from '../../../../../i18n'
 import {useSelectedWallet} from '../../../../../SelectedWallet'
@@ -19,6 +19,7 @@ export const EditLimitPrice = () => {
   const {numberLocale} = useLanguage()
   const [text, setText] = React.useState('')
   const wallet = useSelectedWallet()
+  const inputRef = React.useRef<TextInput>(null)
 
   const {orderData, limitPriceChanged} = useSwap()
   const sellTokenInfo = useTokenInfo({wallet, tokenId: orderData.amounts.sell.tokenId})
@@ -33,7 +34,8 @@ export const EditLimitPrice = () => {
 
   React.useEffect(() => {
     if (orderData.type === 'limit') {
-      setText(Quantities.format(orderData.limitPrice ?? Quantities.zero, denomination, PRECISION))
+      !inputRef?.current?.isFocused() &&
+        setText(Quantities.format(orderData.limitPrice ?? Quantities.zero, denomination, PRECISION))
     } else {
       setText(
         Quantities.format(orderData.selectedPoolCalculation?.prices.market ?? Quantities.zero, denomination, PRECISION),
@@ -54,7 +56,7 @@ export const EditLimitPrice = () => {
       <Text style={styles.label}>{disabled ? strings.marketPrice : strings.limitPrice}</Text>
 
       <View style={styles.content}>
-        <AmountInput onChange={onChange} value={text} editable={!disabled} />
+        <AmountInput onChange={onChange} value={text} editable={!disabled} inputRef={inputRef} />
 
         <View style={[styles.textWrapper, disabled && styles.disabled]}>
           <Text style={styles.text}>
@@ -70,21 +72,33 @@ type AmountInputProps = {
   value?: string
   onChange(value: string): void
   editable: boolean
+  inputRef?: React.RefObject<TextInput>
 }
-const AmountInput = ({onChange, value, editable}: AmountInputProps) => {
+const AmountInput = ({onChange, value, editable, inputRef}: AmountInputProps) => {
+  const amountInputRef = React.useRef<TextInput>(inputRef?.current ?? null)
+
+  const focusInput = () => {
+    if (amountInputRef?.current) {
+      amountInputRef.current.focus()
+    }
+  }
+
   return (
-    <TextInput
-      keyboardType="numeric"
-      autoComplete="off"
-      value={value}
-      placeholder="0"
-      onChangeText={onChange}
-      allowFontScaling
-      selectionColor={COLORS.TRANSPARENT_BLACK}
-      style={styles.amountInput}
-      underlineColorAndroid="transparent"
-      editable={editable}
-    />
+    <Pressable onPress={focusInput}>
+      <TextInput
+        keyboardType="numeric"
+        autoComplete="off"
+        value={value}
+        placeholder="0"
+        onChangeText={onChange}
+        allowFontScaling
+        selectionColor={COLORS.TRANSPARENT_BLACK}
+        style={styles.amountInput}
+        underlineColorAndroid="transparent"
+        editable={editable}
+        ref={inputRef}
+      />
+    </Pressable>
   )
 }
 

diff --git a/...c/features/Swap/useCases/StartSwapScreen/CreateOrder/ShowTokenActions/ClearQuantities.tsx b/...c/features/Swap/useCases/StartSwapScreen/CreateOrder/ShowTokenActions/ClearQuantities.tsx
@@ -1,6 +1,6 @@
 import {useSwap} from '@yoroi/swap'
 import React from 'react'
-import {StyleSheet, Text} from 'react-native'
+import {Keyboard, StyleSheet, Text} from 'react-native'
 import {TouchableOpacity} from 'react-native-gesture-handler'
 
 import {COLORS} from '../../../../../../theme'
@@ -13,6 +13,7 @@ export const ClearQuantities = () => {
   const {poolDefaulted} = useSwapTouched()
 
   const handleReset = () => {
+    Keyboard.dismiss()
     resetQuantities()
     poolDefaulted()
   }

diff --git a/...c/features/Swap/useCases/StartSwapScreen/CreateOrder/ShowTokenActions/TopTokenActions.tsx b/...c/features/Swap/useCases/StartSwapScreen/CreateOrder/ShowTokenActions/TopTokenActions.tsx
@@ -1,6 +1,6 @@
 import {useSwap, useSwapPoolsByPair} from '@yoroi/swap'
 import React from 'react'
-import {StyleSheet, View} from 'react-native'
+import {Keyboard, StyleSheet, View} from 'react-native'
 import {TouchableOpacity} from 'react-native-gesture-handler'
 
 import {Icon} from '../../../../../../components'
@@ -40,6 +40,7 @@ export const TopTokenActions = () => {
   }
 
   const handleRefresh = () => {
+    Keyboard.dismiss()
     refetch()
   }
 

diff --git a/apps/wallet-mobile/translations/messages/src/features/Swap/common/AmountCard/AmountCard.json b/apps/wallet-mobile/translations/messages/src/features/Swap/common/AmountCard/AmountCard.json
@@ -4,74 +4,74 @@
     "defaultMessage": "!!!Select token",
     "file": "src/features/Swap/common/AmountCard/AmountCard.tsx",
     "start": {
-      "line": 134,
+      "line": 135,
       "column": 15,
-      "index": 4170
+      "index": 4171
     },
     "end": {
-      "line": 137,
+      "line": 138,
       "column": 3,
-      "index": 4253
+      "index": 4254
     }
   },
   {
     "id": "swap.swapScreen.currentBalance",
     "defaultMessage": "!!!Current Balance",
     "file": "src/features/Swap/common/AmountCard/AmountCard.tsx",
     "start": {
-      "line": 138,
+      "line": 139,
       "column": 18,
-      "index": 4273
+      "index": 4274
     },
     "end": {
-      "line": 141,
+      "line": 142,
       "column": 3,
-      "index": 4362
+      "index": 4363
     }
   },
   {
     "id": "swap.swapScreen.notEnoughBalance",
     "defaultMessage": "!!!Not enough balance",
     "file": "src/features/Swap/common/AmountCard/AmountCard.tsx",
     "start": {
-      "line": 142,
+      "line": 143,
       "column": 20,
-      "index": 4384
+      "index": 4385
     },
     "end": {
-      "line": 145,
+      "line": 146,
       "column": 3,
-      "index": 4478
+      "index": 4479
     }
   },
   {
     "id": "swap.swapScreen.notEnoughSupply",
     "defaultMessage": "!!!Not enough supply in the pool",
     "file": "src/features/Swap/common/AmountCard/AmountCard.tsx",
     "start": {
-      "line": 146,
+      "line": 147,
       "column": 19,
-      "index": 4499
+      "index": 4500
     },
     "end": {
-      "line": 149,
+      "line": 150,
       "column": 3,
-      "index": 4603
+      "index": 4604
     }
   },
   {
     "id": "swap.swapScreen.noPool",
     "defaultMessage": "!!! This pair is not available in any liquidity pool",
     "file": "src/features/Swap/common/AmountCard/AmountCard.tsx",
     "start": {
-      "line": 150,
+      "line": 151,
       "column": 10,
-      "index": 4615
+      "index": 4616
     },
     "end": {
-      "line": 153,
+      "line": 154,
       "column": 3,
-      "index": 4730
+      "index": 4731
     }
   }
 ]