chore: fix react-query updates

Emurgo · Nov 28, 2024 · c42231e · c42231e
1 parent ee3333f
commit c42231e
Show file tree

Hide file tree

Showing 4 changed files with 51 additions and 19 deletions.
diff --git a/apps/wallet/src/features/ReviewTx/common/hooks/useFormattedTx.tsx b/apps/wallet/src/features/ReviewTx/common/hooks/useFormattedTx.tsx
@@ -3,7 +3,7 @@ import {isNonNullable} from '@yoroi/common'
 import {infoExtractName} from '@yoroi/portfolio'
 import {Portfolio} from '@yoroi/types'
 import _ from 'lodash'
-import {useQuery} from 'react-query'
+import {useQuery} from '@tanstack/react-query'
 
 import {YoroiWallet} from '../../../../yoroi-wallets/cardano/types'
 import {deriveRewardAddressFromAddress} from '../../../../yoroi-wallets/cardano/utils'

diff --git a/apps/wallet/src/features/ReviewTx/common/hooks/useTxBody.tsx b/apps/wallet/src/features/ReviewTx/common/hooks/useTxBody.tsx
@@ -1,10 +1,16 @@
-import {useQuery} from 'react-query'
+import {useQuery} from '@tanstack/react-query'
 
 import {wrappedCsl} from '../../../../yoroi-wallets/cardano/wrappedCsl'
 import {YoroiUnsignedTx} from '../../../../yoroi-wallets/types/yoroi'
 import {TransactionBody} from '../types'
 
-export const useTxBody = ({cbor, unsignedTx}: {cbor?: string; unsignedTx?: YoroiUnsignedTx}): TransactionBody => {
+export const useTxBody = ({
+  cbor,
+  unsignedTx,
+}: {
+  cbor?: string
+  unsignedTx?: YoroiUnsignedTx
+}): TransactionBody => {
   const query = useQuery(
     ['useTxBody', cbor, unsignedTx],
     async () => {
@@ -22,7 +28,8 @@ export const useTxBody = ({cbor, unsignedTx}: {cbor?: string; unsignedTx?: Yoroi
     },
   )
 
-  if (query.data === undefined) throw new Error('useTxBody: cannot extract txBody')
+  if (query.data === undefined)
+    throw new Error('useTxBody: cannot extract txBody')
   return query.data
 }
 const getCborTxBody = async (cbor: string) => {

diff --git a/apps/wallet/src/features/ReviewTx/common/operations.tsx b/apps/wallet/src/features/ReviewTx/common/operations.tsx
@@ -2,7 +2,7 @@ import {useTheme} from '@yoroi/theme'
 import * as React from 'react'
 import {Linking, StyleSheet, Text, View} from 'react-native'
 import {TouchableOpacity} from 'react-native-gesture-handler'
-import {useQuery} from 'react-query'
+import {useQuery} from '@tanstack/react-query'
 
 import {Space} from '../../../components/Space/Space'
 import {wrappedCsl} from '../../../yoroi-wallets/cardano/wrappedCsl'
@@ -26,7 +26,10 @@ export const StakeRegistrationOperation = () => {
       <Space width="lg" />
 
       <Text style={styles.operationValue}>
-        {formatTokenWithText(asQuantity(wallet.protocolParams.keyDeposit), wallet.portfolioPrimaryTokenInfo)}
+        {formatTokenWithText(
+          asQuantity(wallet.protocolParams.keyDeposit),
+          wallet.portfolioPrimaryTokenInfo,
+        )}
       </Text>
     </View>
   )
@@ -49,7 +52,9 @@ export const StakeRewardsWithdrawalOperation = () => {
 
   return (
     <View style={styles.operation}>
-      <Text style={styles.operationLabel}>{strings.rewardsWithdrawalLabel}</Text>
+      <Text style={styles.operationLabel}>
+        {strings.rewardsWithdrawalLabel}
+      </Text>
 
       <Text style={styles.operationValue}>{strings.rewardsWithdrawalText}</Text>
     </View>
@@ -62,7 +67,8 @@ export const StakeDelegateOperation = ({poolId}: {poolId: string}) => {
   const poolInfo = usePoolInfo({poolId})
   const {networkManager} = useSelectedNetwork()
 
-  const poolInfoText = poolInfo != null ? `[${poolInfo.ticker}] ${poolInfo.name}` : poolId
+  const poolInfoText =
+    poolInfo != null ? `[${poolInfo.ticker}] ${poolInfo.name}` : poolId
 
   return (
     <View style={styles.operation}>
@@ -72,7 +78,9 @@ export const StakeDelegateOperation = ({poolId}: {poolId: string}) => {
 
       <TouchableOpacity
         activeOpacity={0.5}
-        onPress={() => Linking.openURL(networkManager.explorers.cardanoscan.pool(poolId))}
+        onPress={() =>
+          Linking.openURL(networkManager.explorers.cardanoscan.pool(poolId))
+        }
       >
         <Text style={styles.operationLink}>{poolInfoText}</Text>
       </TouchableOpacity>
@@ -133,16 +141,22 @@ export const useOperations = (certificates: FormattedTx['certificates']) => {
       case CertificateType.StakeDelegation: {
         const poolKeyHash = certificate.value.pool_keyhash ?? null
         if (poolKeyHash == null) return acc
-        return [...acc, <StakeDelegateOperation key={index} poolId={poolKeyHash} />]
+        return [
+          ...acc,
+          <StakeDelegateOperation key={index} poolId={poolKeyHash} />,
+        ]
       }
 
       case CertificateType.VoteDelegation: {
         const drep = certificate.value.drep
 
-        if (drep === 'AlwaysAbstain') return [...acc, <AbstainOperation key={index} />]
-        if (drep === 'AlwaysNoConfidence') return [...acc, <NoConfidenceOperation key={index} />]
+        if (drep === 'AlwaysAbstain')
+          return [...acc, <AbstainOperation key={index} />]
+        if (drep === 'AlwaysNoConfidence')
+          return [...acc, <NoConfidenceOperation key={index} />]
 
-        const drepId = ('KeyHash' in drep ? drep.KeyHash : drep.ScriptHash) ?? ''
+        const drepId =
+          ('KeyHash' in drep ? drep.KeyHash : drep.ScriptHash) ?? ''
         return [...acc, <VoteDelegationOperation key={index} drepID={drepId} />]
       }
 

diff --git a/apps/wallet/src/legacy/Staking/StakingCenter/StakingCenter.tsx b/apps/wallet/src/legacy/Staking/StakingCenter/StakingCenter.tsx
@@ -5,7 +5,7 @@ import {defineMessages, useIntl} from 'react-intl'
 import {StyleSheet, View} from 'react-native'
 import {SafeAreaView} from 'react-native-safe-area-context'
 import {WebView, WebViewMessageEvent} from 'react-native-webview'
-import {useQueryClient} from 'react-query'
+import {useQueryClient} from '@tanstack/react-query'
 
 import {PleaseWaitModal} from '../../../components/PleaseWaitModal'
 import {Spacer} from '../../../components/Spacer/Spacer'
@@ -41,7 +41,9 @@ export const StakingCenter = () => {
     }, [track]),
   )
 
-  const [selectedPoolId, setSelectedPoolId] = React.useState<string | null>(null)
+  const [selectedPoolId, setSelectedPoolId] = React.useState<string | null>(
+    null,
+  )
   const [isContentLoaded, setIsContentLoaded] = React.useState(false)
 
   const {isLoading} = useStakingTx(
@@ -53,7 +55,9 @@ export const StakingCenter = () => {
         if (selectedPoolId == null) return
 
         unsignedTxChanged(yoroiUnsignedTx)
-        navigateToTxReview({onSuccess: () => queryClient.resetQueries([wallet.id, 'stakingInfo'])})
+        navigateToTxReview({
+          onSuccess: () => queryClient.resetQueries([wallet.id, 'stakingInfo']),
+        })
       },
     },
   )
@@ -72,7 +76,9 @@ export const StakingCenter = () => {
 
   return (
     <SafeAreaView edges={['right', 'bottom', 'left']} style={styles.root}>
-      {shouldDisplayPoolIDInput && <PoolDetailScreen onPressDelegate={setSelectedPoolId} />}
+      {shouldDisplayPoolIDInput && (
+        <PoolDetailScreen onPressDelegate={setSelectedPoolId} />
+      )}
 
       {shouldDisplayPoolList && (
         <View style={styles.poolList}>
@@ -100,7 +106,11 @@ export const StakingCenter = () => {
         </View>
       )}
 
-      <PleaseWaitModal title="" spinnerText={intl.formatMessage(globalMessages.pleaseWait)} visible={isLoading} />
+      <PleaseWaitModal
+        title=""
+        spinnerText={intl.formatMessage(globalMessages.pleaseWait)}
+        visible={isLoading}
+      />
     </SafeAreaView>
   )
 }
@@ -127,7 +137,8 @@ const noPoolDataDialog = defineMessages({
   },
   message: {
     id: 'components.stakingcenter.noPoolDataDialog.message',
-    defaultMessage: '!!!The data from the stake pool(s) you selected is invalid. Please try again',
+    defaultMessage:
+      '!!!The data from the stake pool(s) you selected is invalid. Please try again',
   },
 })