Refactor context

Emurgo · Aug 10, 2022 · f65cadb · f65cadb
1 parent 509192b
commit f65cadb
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 27 deletions.
diff --git a/src/Send/AddressReaderQR/AddressReaderQR.tsx b/src/Send/AddressReaderQR/AddressReaderQR.tsx
@@ -7,7 +7,7 @@ import {useSendContext} from '../Context/SendContext'
 
 export const AddressReaderQR: React.FC = () => {
   const navigation = useNavigation()
-  const {setAmount, addReceiver} = useSendContext()
+  const {setAmount, setReceiver} = useSendContext()
 
   const handleOnRead = ({data}) => {
     const regex = /(cardano):([a-zA-Z1-9]\w+)\??/
@@ -17,15 +17,15 @@ export const AddressReaderQR: React.FC = () => {
         const index = data.indexOf('?')
         const params = getParams(data.substr(index))
         if ('amount' in params) {
-          addReceiver(address ?? '')
+          setReceiver(address ?? '')
           const amount = pastedFormatter(params?.amount ?? '')
           setAmount(amount)
         }
       } else {
-        addReceiver(address ?? '')
+        setReceiver(address ?? '')
       }
     } else {
-      addReceiver(data ?? '')
+      setReceiver(data ?? '')
     }
     navigation.goBack()
   }

diff --git a/src/Send/Context/SendContext.tsx b/src/Send/Context/SendContext.tsx
@@ -11,14 +11,12 @@ export const SendProvider: React.FC<SendContextProvider> = ({children, balance,
 
   const [selectedTokenIdentifier, setSelectedTokenIdentifier] = useState<TokenId>(defaultTokenId)
   const [sendAll, setSendAll] = useState(false)
-  const [receivers, setReceivers] = useState<Array<string>>([])
+  const [receiver, setReceiver] = useState('')
   const [amount, setAmount] = useState('')
 
-  const addReceiver = (receiver) => setReceivers([...receivers, receiver])
-
   const clear = () => {
     setSendAll(false)
-    setReceivers([])
+    setReceiver('')
     setAmount('')
   }
 
@@ -38,12 +36,11 @@ export const SendProvider: React.FC<SendContextProvider> = ({children, balance,
         setSelectedTokenIdentifier,
         sendAll,
         setSendAll,
-        receivers,
-        setReceivers,
+        receiver,
+        setReceiver,
         amount,
         setAmount,
         clear,
-        addReceiver,
       }}
     >
       {children}
@@ -62,12 +59,11 @@ type SendContext = {
   setSelectedTokenIdentifier: (tokenId: TokenId) => void
   sendAll: boolean
   setSendAll: (sendAll: boolean) => void
-  receivers: Array<string>
-  setReceivers: (receivers: Array<string>) => void
+  receiver: string
+  setReceiver: (receiver: string) => void
   amount: string
   setAmount: (amount: string) => void
   clear: () => void
-  addReceiver: (receiver: string) => void
 }
 
 type SendContextProvider = {

diff --git a/src/Send/SendScreen/SendScreen.tsx b/src/Send/SendScreen/SendScreen.tsx
@@ -54,7 +54,7 @@ export const SendScreen = () => {
   const netInfo = useNetInfo()
   const isOnline = netInfo.type !== 'none' && netInfo.type !== 'unknown'
 
-  const {selectedTokenIdentifier, sendAll, setSendAll, receivers, amount, addReceiver, setAmount} = useSendContext()
+  const {selectedTokenIdentifier, sendAll, setSendAll, receiver, setReceiver, amount, setAmount} = useSendContext()
 
   const defaultAssetAvailableAmount = balance[defaultAsset.identifier]
   const selectedAssetAvailableAmount = balance[selectedTokenIdentifier]
@@ -90,7 +90,7 @@ export const SendScreen = () => {
   React.useEffect(() => {
     if (CONFIG.DEBUG.PREFILL_FORMS) {
       if (!__DEV__) throw new Error('using debug data in non-dev env')
-      addReceiver(CONFIG.DEBUG.SEND_ADDRESS)
+      setReceiver(CONFIG.DEBUG.SEND_ADDRESS)
       setAmount(CONFIG.DEBUG.SEND_AMOUNT)
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -105,7 +105,7 @@ export const SendScreen = () => {
     const promise = recomputeAll({
       wallet,
       utxos,
-      addressInput: receivers[0],
+      addressInput: receiver,
       amount,
       sendAll,
       defaultAsset,
@@ -130,7 +130,7 @@ export const SendScreen = () => {
       setRecomputing(false)
     })
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [receivers, amount, selectedTokenIdentifier, sendAll])
+  }, [receiver, amount, selectedTokenIdentifier, sendAll])
 
   const onConfirm = () => {
     if (sendAll) {
@@ -194,19 +194,20 @@ export const SendScreen = () => {
         <Spacer height={16} />
 
         <TextInput
-          value={receivers[0]}
+          id="address"
+          value={receiver}
           multiline
           errorOnMount
-          onChangeText={addReceiver}
+          onChangeText={(receiver) => setReceiver(receiver)}
           label={strings.addressInputLabel}
           errorText={getAddressErrorText(intl, addressErrors)}
           autoComplete={false}
         />
 
         {!recomputing &&
-          isDomain(receivers[0]) &&
+          isDomain(receiver) &&
           !hasDomainErrors(addressErrors) &&
-          !receivers[0].includes(address) /* HACK */ && (
+          !receiver.includes(address) /* HACK */ && (
             <Text ellipsizeMode="middle" numberOfLines={1}>
               {`Resolves to: ${address}`}
             </Text>

diff --git a/src/TxHistory/TxHistoryNavigator.tsx b/src/TxHistory/TxHistoryNavigator.tsx
@@ -42,7 +42,7 @@ export const TxHistoryNavigator = () => {
   const hideModalInfo = () => setModalInfoState(false)
 
   return (
-    <>
+    <SendProvider balance={balance} wallet={wallet}>
       <Stack.Navigator screenOptions={defaultStackNavigationOptions} initialRouteName="history-list">
         <Stack.Screen
           name="history-list"
@@ -86,9 +86,7 @@ export const TxHistoryNavigator = () => {
         >
           {() => (
             <Boundary>
-              <SendProvider balance={balance} wallet={wallet}>
-                <SendScreen />
-              </SendProvider>
+              <SendScreen />
             </Boundary>
           )}
         </Stack.Screen>
@@ -114,7 +112,7 @@ export const TxHistoryNavigator = () => {
       <ModalInfo hideModalInfo={hideModalInfo} visible={modalInfoState}>
         <Text style={styles.receiveInfoText}>{strings.receiveInfoText}</Text>
       </ModalInfo>
-    </>
+    </SendProvider>
   )
 }
 

diff --git a/src/components/TextInput/TextInput.tsx b/src/components/TextInput/TextInput.tsx
@@ -24,6 +24,7 @@ type Props = TextInputProps &
     noErrors?: boolean
     dense?: boolean
     faded?: boolean
+    id?: string
   }
 
 const useDebounced = (callback, value, delay = 1000) => {