feat(pool-transition) Update pool transition api and staking (#3285)

apps/wallet-mobile/package.json

@@ -99,7 +99,7 @@
     "@emurgo/csl-mobile-bridge": "6.0.0-alpha.9",
     "@emurgo/react-native-blockies-svg": "^0.0.2",
     "@emurgo/react-native-hid": "^5.15.6",
-    "@emurgo/yoroi-lib": "0.15.4-alpha.6",
+    "@emurgo/yoroi-lib": "0.15.5-alpha.7",
     "@formatjs/intl-datetimeformat": "^6.7.0",
     "@formatjs/intl-getcanonicallocales": "^2.1.0",
     "@formatjs/intl-locale": "^3.2.1",

apps/wallet-mobile/src/Staking/PoolTransition/PoolTransitionModal.stories.tsx

@@ -1,27 +1,38 @@
-import {PoolInfo} from '@emurgo/yoroi-lib'
+import {PoolTransition} from '@emurgo/yoroi-lib'
 import {action} from '@storybook/addon-actions'
 import {storiesOf} from '@storybook/react-native'
 import * as React from 'react'
 import {View} from 'react-native'
 
 import {PoolTransitionModal} from './PoolTransitionModal'
 
-const mock = {
+const mock: PoolTransition = {
   current: {
+    id: '',
+    hash: '',
+    saturation: '',
+    taxFix: '',
+    stake: '',
+    share: '',
     pic: 'https://img.cexplorer.io/a/5/5/f/2/pool12eht6dqxpzqj87xuextrpufz2gxmt4reuesuw26r2utzw0kw906.png',
     ticker: 'EMRG',
     name: 'emurgo old',
     roa: '0',
-    taxRate: '0.05',
-  } as unknown as PoolInfo,
+    taxRatio: '0.05',
+  },
   suggested: {
+    hash: '',
+    saturation: '',
+    taxFix: '',
+    stake: '',
+    share: '',
     pic: 'https://img.cexplorer.io/e/c/2/3/1/pool1dkww2vlysa8lsnuf5rca979zdsyr3zvt59hu7e420yxfunkka2z.png',
     id: 'df1750df9b2df285fcfb50f4740657a18ee3af42727d410c37b86207',
     name: 'emurgo new',
     roa: '5.1',
     ticker: 'EMRG',
-    taxRate: '0.02',
-  } as unknown as PoolInfo,
+    taxRatio: '0.02',
+  },
   deadlineMilliseconds: Date.now() + 2999777000,
 }
 

apps/wallet-mobile/src/Staking/PoolTransition/usePoolTransition.tsx

@@ -6,6 +6,11 @@ import * as React from 'react'
 import {defineMessages, useIntl} from 'react-intl'
 import {useQuery} from 'react-query'
 
+import {features} from '../../../features'
+import {useSelectedWallet} from '../../../features/WalletManager/context/SelectedWalletContext'
+import {getCardanoNetworkConfigById} from '../../../yoroi-wallets/cardano/networks'
+import {YoroiWallet} from '../../../yoroi-wallets/cardano/types'
+import {asQuantity, Quantities} from '../../../yoroi-wallets/utils'
 import {useStakingInfo} from '../../Dashboard/StakePoolInfos'
 import {features} from '../../features'
 import {useSelectedWallet} from '../../features/WalletManager/Context'
@@ -26,12 +31,14 @@ const createDelegationTx = async (wallet: YoroiWallet, poolId: string) => {
   return wallet.createDelegationTx(poolId, new BigNumber(amountToDelegate))
 }
 
-const poolInfoApi = new PoolInfoApi()
-
 export const usePoolTransition = () => {
   const navigation = useNavigation()
   const wallet = useSelectedWallet()
   const {stakingInfo, isLoading} = useStakingInfo(wallet)
+  const poolInfoApi = React.useMemo(
+    () => new PoolInfoApi(getCardanoNetworkConfigById(wallet.networkId).BACKEND.API_ROOT),
+    [wallet.networkId],
+  )
 
   const isStaked = stakingInfo?.status === 'staked'
   const currentPoolId = isStaked ? stakingInfo?.poolId : ''

apps/wallet-mobile/src/Staking/StakingCenter/StakingCenter.tsx

@@ -5,7 +5,18 @@ import {defineMessages, useIntl} from 'react-intl'
 import {View} from 'react-native'
 import {WebView, WebViewMessageEvent} from 'react-native-webview'
 
-import {PleaseWaitModal, Spacer} from '../../components'
+import {PleaseWaitModal, Spacer} from '../../../components'
+import {features} from '../../../features'
+import {useSelectedWallet} from '../../../features/WalletManager/context/SelectedWalletContext'
+import {showErrorDialog} from '../../../kernel/dialogs'
+import {isNightly} from '../../../kernel/env'
+import {useLanguage} from '../../../kernel/i18n'
+import globalMessages from '../../../kernel/i18n/global-messages'
+import {useMetrics} from '../../../kernel/metrics/metricsManager'
+import {StakingCenterRouteNavigation} from '../../../kernel/navigation'
+import {NETWORKS} from '../../../yoroi-wallets/cardano/networks'
+import {NotEnoughMoneyToSendError} from '../../../yoroi-wallets/cardano/types'
+import {usePlate} from '../../../yoroi-wallets/hooks'
 import {useStakingTx} from '../../Dashboard/StakePoolInfos'
 import {showErrorDialog} from '../../dialogs'
 import {features} from '../../features'
@@ -27,7 +38,7 @@ export const StakingCenter = () => {
   const {languageCode} = useLanguage()
   const wallet = useSelectedWallet()
   const {track} = useMetrics()
-
+  const plate = usePlate({networkId: wallet.networkId, publicKeyHex: wallet.publicKeyHex})
   useFocusEffect(
     React.useCallback(() => {
       track.stakingCenterPageViewed()
@@ -84,7 +95,7 @@ export const StakingCenter = () => {
           <WebView
             originWhitelist={['*']}
             androidLayerType="software"
-            source={{uri: prepareStakingURL(languageCode)}}
+            source={{uri: prepareStakingURL(languageCode, plate.accountPlate.TextPart)}}
             onMessage={(event) => handleOnMessage(event)}
           />
         </View>
@@ -110,12 +121,14 @@ const noPoolDataDialog = defineMessages({
  * Prepares WebView's target staking URI
  * @param {*} poolList : Array of delegated pool hash
  */
-const prepareStakingURL = (locale: string): string => {
+const prepareStakingURL = (locale: string, plate: string): string => {
   // source=mobile is constant and already included
   let finalURL = NETWORKS.HASKELL_SHELLEY.POOL_EXPLORER
 
   const lang = locale.slice(0, 2)
   finalURL += `&lang=${lang}`
 
+  finalURL += `&bias=${plate}`
+
   return finalURL
 }