react native crypto update (#1324)

ios/Podfile.lock

@@ -55,7 +55,7 @@ PODS:
     - ReactCommon/turbomodule/core (= 0.66.4)
   - fmt (6.2.1)
   - glog (0.3.5)
-  - helium-react-native-sdk (0.2.1):
+  - helium-react-native-sdk (0.3.0):
     - React-Core
   - lottie-ios (3.1.8)
   - lottie-react-native (4.0.2):
@@ -704,7 +704,7 @@ SPEC CHECKSUMS:
   FBReactNativeSpec: fe08c1cd7e2e205718d77ad14b34957cce949b58
   fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
   glog: 5337263514dd6f09803962437687240c5dc39aa4
-  helium-react-native-sdk: a5d944abc798ec30baace942cf1e9298c82ba782
+  helium-react-native-sdk: 1850589e66df3224f30cc2c39b72fd31de8fe168
   lottie-ios: 48fac6be217c76937e36e340e2d09cf7b10b7f5f
   lottie-react-native: 4dff8fe8d10ddef9e7880e770080f4a56121397e
   Mapbox-iOS-SDK: a5915700ec84bc1a7f8b3e746d474789e35b7956

package.json

@@ -39,12 +39,13 @@
   "dependencies": {
     "@expo/react-native-action-sheet": "^3.12.0",
     "@gorhom/bottom-sheet": "^4.1.5",
-    "@helium/crypto-react-native": "^3.50.0",
-    "@helium/currency": "^3.52.0",
-    "@helium/http": "^4.3.1",
-    "@helium/onboarding": "^3.59.0",
-    "@helium/proto-ble": "^3.37.0",
-    "@helium/react-native-sdk": "^0.2.1",
+    "@helium/address": "^4.3.1",
+    "@helium/crypto-react-native": "^4.3.1",
+    "@helium/currency": "^4.2.0",
+    "@helium/http": "^4.4.0",
+    "@helium/onboarding": "^4.0.0",
+    "@helium/proto-ble": "^4.0.0",
+    "@helium/react-native-sdk": "^0.3.0",
     "@helium/transactions": "^4.3.1",
     "@react-native-community/art": "^1.2.0",
     "@react-native-community/async-storage": "^1.12.1",

src/features/moreTab/more/DeployModeModal.tsx

@@ -1,10 +1,10 @@
 import React, { useCallback, useState, useEffect } from 'react'
 import { BoxProps } from '@shopify/restyle'
-import { Address } from '@helium/crypto-react-native'
 import { KeyboardAvoidingView, StyleSheet } from 'react-native'
 import { useTranslation } from 'react-i18next'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import DeployModeIcon from '@assets/images/deployModeIcon.svg'
+import Address from '@helium/address'
 import { Theme } from '../../../theme/theme'
 import appSlice from '../../../store/user/appSlice'
 import { useAppDispatch } from '../../../store/store'

src/features/onboarding/accountImportComplete/AccountImportCompleteScreen.tsx

@@ -26,7 +26,7 @@ const AccountImportCompleteScreen = () => {
 
     const genKeypair = async () => {
       try {
-        await createKeypair(words)
+        await createKeypair({ mnemonic: words })
         timer = setTimeout(() => {
           navigation.push('AccountCreatePinScreen', { fromImport: true })
         }, 2000)

src/features/onboarding/accountPassphraseGeneration/AccountPassphraseGenerationScreen.tsx

@@ -1,22 +1,31 @@
 import React, { useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
-import { useNavigation } from '@react-navigation/native'
+import { RouteProp, useNavigation, useRoute } from '@react-navigation/native'
 import SafeAreaBox from '../../../components/SafeAreaBox'
 import Text from '../../../components/Text'
-import { OnboardingNavigationProp } from '../onboardingTypes'
+import {
+  OnboardingNavigationProp,
+  OnboardingStackParamList,
+} from '../onboardingTypes'
 import { createKeypair } from '../../../utils/secureAccount'
 import RingLoader from '../../../components/Loaders/RingLoader'
 
 const DURATION = 4000
 const IMAGE_SIZE = 212
 
+type Route = RouteProp<OnboardingStackParamList, 'AccountPassphraseGeneration'>
+
 const AccountPassphraseGenerationScreen = () => {
   const { t } = useTranslation()
   const navigation = useNavigation<OnboardingNavigationProp>()
+  const { params } = useRoute<Route>()
 
   useEffect(() => {
     const genKeypair = async () => {
-      await createKeypair()
+      await createKeypair({
+        netType: params.netType,
+        wordCount: params.wordCount,
+      })
     }
 
     const timer = setTimeout(
@@ -28,7 +37,7 @@ const AccountPassphraseGenerationScreen = () => {
     return () => {
       clearTimeout(timer)
     }
-  }, [navigation])
+  }, [navigation, params.netType, params.wordCount])
 
   return (
     <SafeAreaBox

src/features/onboarding/accountPassphraseWarning/AccountPassphraseWarningScreen.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import { useTranslation } from 'react-i18next'
 import { useNavigation } from '@react-navigation/native'
+import { NetTypes } from '@helium/address'
 import Text from '../../../components/Text'
 import Box from '../../../components/Box'
 import TextTransform from '../../../components/TextTransform'
@@ -43,7 +44,12 @@ const AccountPassphraseWarningScreen = () => {
         variant="primary"
         width="100%"
         marginBottom="l"
-        onPress={() => navigation.push('AccountPassphraseGeneration')}
+        onPress={() =>
+          navigation.push('AccountPassphraseGeneration', {
+            netType: NetTypes.MAINNET,
+            wordCount: 12,
+          })
+        }
         title={t('account_setup.warning.generate')}
       />
     </BackScreen>

src/features/onboarding/onboardingTypes.ts

@@ -1,9 +1,13 @@
 import { StackNavigationProp } from '@react-navigation/stack'
+import { NetTypes } from '@helium/address'
 
 export type OnboardingStackParamList = {
   Welcome: undefined
   AccountPassphraseWarning: undefined
-  AccountPassphraseGeneration: undefined
+  AccountPassphraseGeneration: {
+    netType: NetTypes.NetType
+    wordCount: 12 | 24
+  }
   AccountCreatePassphraseScreen: undefined
   AccountEnterPassphraseScreen: undefined
   AccountCreatePinScreen:

src/features/wallet/root/BalanceCard/CurrencyBadge.tsx

@@ -11,29 +11,27 @@ type Props = {
   amount?: number
 }
 
-const CurrencyBadge = ({ variant, amount }: Props) => (
-  <Box
-    flexDirection="row"
-    backgroundColor="purple300"
-    borderRadius="round"
-    alignItems="center"
-    justifyContent="center"
-    paddingHorizontal="s"
-    height={30}
-    marginRight="m"
-  >
-    {variant === 'dc' && <DC height={16} />}
-    {variant === 'hst' && <HST width={16} />}
-    {variant === 'stake' && <STAKE width={16} color="#A667F6" />}
-    <Text
-      color="white"
-      marginLeft="xs"
-      fontSize={14}
-      visible={amount !== undefined}
+const CurrencyBadge = ({ variant, amount }: Props) => {
+  if (amount === undefined) return null
+  return (
+    <Box
+      flexDirection="row"
+      backgroundColor="purple300"
+      borderRadius="round"
+      alignItems="center"
+      justifyContent="center"
+      paddingHorizontal="s"
+      height={30}
+      marginRight="m"
     >
-      {amount?.toLocaleString(locale)}
-    </Text>
-  </Box>
-)
+      {variant === 'dc' && <DC height={16} />}
+      {variant === 'hst' && <HST width={16} />}
+      {variant === 'stake' && <STAKE width={16} color="#A667F6" />}
+      <Text color="white" marginLeft="xs" fontSize={14}>
+        {amount?.toLocaleString(locale)}
+      </Text>
+    </Box>
+  )
+}
 
 export default CurrencyBadge

src/features/wallet/send/SendDetailsForm.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useEffect, useState } from 'react'
 import { ActivityIndicator, Alert } from 'react-native'
 import { useTranslation } from 'react-i18next'
-import { Address } from '@helium/crypto-react-native'
+import Address from '@helium/address'
 import { Account } from '@helium/http'
 import Balance, { NetworkTokens } from '@helium/currency'
 import { useAsync } from 'react-async-hook'

src/features/wallet/send/SendView.tsx

@@ -7,7 +7,7 @@ import Balance, {
   DataCredits,
   NetworkTokens,
 } from '@helium/currency'
-import { Address } from '@helium/crypto-react-native'
+import Address from '@helium/address'
 import { useAsync } from 'react-async-hook'
 import { useSelector } from 'react-redux'
 import { TransferHotspotV1 } from '@helium/transactions'

src/providers/AppLinkProvider.tsx

@@ -10,7 +10,7 @@ import React, {
 import { Linking } from 'react-native'
 import queryString from 'query-string'
 import { useSelector } from 'react-redux'
-import { Address } from '@helium/crypto-react-native'
+import Address from '@helium/address'
 import { BarCodeScanningResult } from 'expo-camera'
 import useMount from '../utils/useMount'
 import { getAddress } from '../utils/secureAccount'

src/utils/accountUtils.ts

@@ -0,0 +1,42 @@
+import Address, { NetTypes as NetType } from '@helium/address'
+import { CurrencyType } from '@helium/currency'
+
+export const accountCurrencyType = (address?: string) => {
+  if (!address) return CurrencyType.default
+  return accountNetType(address) === NetType.TESTNET
+    ? CurrencyType.testNetworkToken
+    : CurrencyType.default
+}
+
+export const networkCurrencyType = (netType?: NetType.NetType) => {
+  return netType === NetType.TESTNET
+    ? CurrencyType.testNetworkToken
+    : CurrencyType.default
+}
+
+export const accountNetType = (address?: string) => {
+  if (!address) return NetType.MAINNET
+  return Address.fromB58(address)?.netType
+}
+
+export const getNetTypeString = (netType?: NetType.NetType) => {
+  if (!netType) return 'mainnet'
+
+  switch (netType) {
+    default:
+    case NetType.MAINNET: {
+      return 'mainnet'
+    }
+    case NetType.TESTNET: {
+      return 'testnet'
+    }
+  }
+}
+
+export const isMainnet = (address: string) => {
+  return accountNetType(address) === NetType.MAINNET
+}
+
+export const isTestnet = (address: string) => {
+  return accountNetType(address) === NetType.TESTNET
+}

src/utils/appDataClient.ts

@@ -8,9 +8,9 @@ import Client, {
 } from '@helium/http'
 import { Transaction } from '@helium/transactions'
 import { Platform } from 'react-native'
-import Config from 'react-native-config'
 import { getVersion } from 'react-native-device-info'
 import { subDays } from 'date-fns'
+import Config from 'react-native-config'
 import {
   HotspotActivityFilters,
   HotspotActivityType,

src/utils/fees.ts

@@ -1,4 +1,4 @@
-import { Address } from '@helium/crypto-react-native'
+import Address from '@helium/address'
 import {
   AddGatewayV1,
   AssertLocationV2,

src/utils/secureAccount.ts

@@ -1,8 +1,9 @@
-import { Address, Keypair, Mnemonic } from '@helium/crypto-react-native'
+import { Keypair, Mnemonic } from '@helium/crypto-react-native'
 import { WalletLink } from '@helium/react-native-sdk'
 import * as SecureStore from 'expo-secure-store'
 import OneSignal from 'react-native-onesignal'
 import Sodium from 'react-native-sodium'
+import Address, { NetTypes } from '@helium/address'
 import * as Logger from './logger'
 
 type AccountStoreKey = BooleanKey | StringKey
@@ -50,24 +51,34 @@ export async function getSecureItem(key: AccountStoreKey) {
 export const deleteSecureItem = async (key: AccountStoreKey) =>
   SecureStore.deleteItemAsync(key)
 
-export const createKeypair = async (
-  givenMnemonic: Mnemonic | Array<string> | null = null,
-) => {
-  let mnemonic: Mnemonic
-  if (!givenMnemonic) {
-    mnemonic = await Mnemonic.create()
-  } else if ('words' in givenMnemonic) {
-    mnemonic = givenMnemonic
+type KeypairParams = {
+  mnemonic?: Mnemonic | Array<string>
+  netType?: NetTypes.NetType
+  wordCount?: 12 | 24
+}
+export const createKeypair = async ({
+  mnemonic,
+  netType,
+  wordCount,
+}: KeypairParams) => {
+  let newMnemonic: Mnemonic
+  if (!mnemonic) {
+    newMnemonic = await Mnemonic.create(wordCount)
+  } else if ('words' in mnemonic) {
+    newMnemonic = mnemonic
   } else {
-    mnemonic = new Mnemonic(givenMnemonic)
+    newMnemonic = new Mnemonic(mnemonic)
   }
-  const { keypair: keypairRaw, address } = await Keypair.fromMnemonic(mnemonic)
+  const { keypair: keypairRaw, address } = await Keypair.fromMnemonic(
+    newMnemonic,
+    netType,
+  )
 
   OneSignal.sendTags({ address: address.b58 })
   Logger.setUser(address.b58)
 
   await Promise.all([
-    setSecureItem('mnemonic', JSON.stringify(mnemonic.words)),
+    setSecureItem('mnemonic', JSON.stringify(newMnemonic.words)),
     setSecureItem('keypair', JSON.stringify(keypairRaw)),
     setSecureItem('address', address.b58),
   ])

src/utils/transactions.ts

@@ -1,4 +1,4 @@
-import { Address } from '@helium/crypto-react-native'
+import Address from '@helium/address'
 import {
   AddGatewayV1,
   AssertLocationV2,

src/utils/useAccountSettings.ts

@@ -8,8 +8,9 @@ import accountSlice, {
 import { RootState } from '../store/rootReducer'
 import { useAppDispatch } from '../store/store'
 import { fetchFeatures } from '../store/features/featuresSlice'
-import { getWalletApiToken } from './secureAccount'
+import { getAddress, getWalletApiToken } from './secureAccount'
 import { updateClient } from './appDataClient'
+import { getNetTypeString } from './accountUtils'
 
 const settingsToTransfer = [
   'isFleetModeEnabled',
@@ -60,7 +61,13 @@ export default () => {
   // enable proxy after wallet api token is loaded
   useAsync(async () => {
     const token = await getWalletApiToken()
-    updateClient({ proxyEnabled: true, retryCount: 1, token })
+    const address = await getAddress()
+    updateClient({
+      proxyEnabled: true,
+      retryCount: 1,
+      token,
+      networkName: getNetTypeString(address?.netType),
+    })
   }, [accountBackedUp])
 
   useAsync(async () => {

src/utils/walletClient.ts

@@ -10,7 +10,7 @@ const breadcrumbOpts = { type: 'HTTP Request', category: 'walletClient' }
 const userAgent = `helium-hotspot-app-${getVersion()}-${
   Platform.OS
 }-wallet-client`
-const network = 'helium'
+const network = 'mainnet'
 
 const makeRequest = async (
   url: string,