removed cache implmeentation for delegation, now using zustand for tracking step progress state for the ledgerReivewTransaction screen, decoupled delegation logic from ledger completely

Author: B0Y3R-AVA

packages/core-mobile/app/contexts/DelegationContext.tsx

@@ -1,21 +1,28 @@
 import React, { createContext, ReactNode, useContext, useMemo } from 'react'
-import { type Step } from 'services/earn/computeDelegationSteps/types'
+import { type Step, Operation } from 'services/earn/computeDelegationSteps/types'
 import { useDelegation } from 'hooks/earn/useDelegation'
 
 export type ComputeSteps = (stakeAmount: bigint) => Promise<Step[]>
 
 type TransactionHash = string
 
+export type OnDelegationProgress = (
+  step: number,
+  operation: Operation | null
+) => void
+
 export type Delegate = ({
   steps,
   startDate,
   endDate,
-  nodeId
+  nodeId,
+  onProgress
 }: {
   steps: Step[]
   startDate: Date
   endDate: Date
   nodeId: string
+  onProgress?: OnDelegationProgress
 }) => Promise<TransactionHash>
 
 interface DelegationContextState {

packages/core-mobile/app/hooks/earn/useDelegation.ts

@@ -25,7 +25,6 @@ import Logger from 'utils/Logger'
 import { useActiveWallet } from 'common/hooks/useActiveWallet'
 import { selectActiveAccount } from 'store/account'
 import { getMinimumStakeDurationMs } from 'services/earn/utils'
-import { ledgerParamsCache } from 'new/features/ledger/services/ledgerParamsCache'
 import { useXPAddresses } from 'hooks/useXPAddresses/useXPAddresses'
 import {
   useAvalancheEvmProvider,
@@ -108,7 +107,7 @@ export const useDelegation = (): {
 
   const delegate: Delegate = useCallback(
     // eslint-disable-next-line @typescript-eslint/no-shadow
-    async ({ steps, startDate, endDate, nodeId }) => {
+    async ({ steps, startDate, endDate, nodeId, onProgress }) => {
       if (activeAccount === undefined) {
         throw new Error('No active account')
       }
@@ -128,17 +127,6 @@ export const useDelegation = (): {
 
       setSteps(steps)
 
-      // Get progress callback once before the loop (cache auto-clears after get)
-      let onProgress:
-        | ((step: number, operation: Operation | null) => void)
-        | undefined
-      try {
-        const params = ledgerParamsCache.ledgerReviewTransactionParams.get()
-        onProgress = params.stakingProgress?.onProgress
-      } catch {
-        // No ledger params cache available, skip progress callback
-      }
-
       let txHash
       let stepIndex = 0
 
@@ -229,6 +217,9 @@ export const useDelegation = (): {
         stepIndex++
       }
 
+      // Signal completion - stepIndex now equals steps.length
+      onProgress?.(stepIndex, null)
+
       if (!txHash) {
         throw new Error('No transaction hash found')
       }

packages/core-mobile/app/hooks/earn/useIssueDelegation.ts

@@ -1,4 +1,7 @@
-import { useDelegationContext } from 'contexts/DelegationContext'
+import {
+  useDelegationContext,
+  OnDelegationProgress
+} from 'contexts/DelegationContext'
 import { useCallback } from 'react'
 import { useUiSafeMutation } from 'hooks/useUiSafeMutation'
 import Logger from 'utils/Logger'
@@ -18,12 +21,14 @@ export const useIssueDelegation = ({
     nodeId,
     startDate,
     endDate,
-    recomputeSteps
+    recomputeSteps,
+    onProgress
   }: {
     nodeId: string
     startDate: Date
     endDate: Date
     recomputeSteps?: boolean
+    onProgress?: OnDelegationProgress
   }) => Promise<void>
   isPending: boolean
 } => {
@@ -34,28 +39,32 @@ export const useIssueDelegation = ({
       nodeId,
       startDate,
       endDate,
-      recomputeSteps = false
+      recomputeSteps = false,
+      onProgress
     }: {
       nodeId: string
       startDate: Date
       endDate: Date
       recomputeSteps?: boolean
+      onProgress?: OnDelegationProgress
     }) => {
       if (recomputeSteps) {
         const newSteps = await computeSteps(stakeAmount.toSubUnit())
         return delegate({
           steps: newSteps,
           startDate,
           endDate,
-          nodeId
+          nodeId,
+          onProgress
         })
       }
 
       return delegate({
         steps,
         startDate,
         endDate,
-        nodeId
+        nodeId,
+        onProgress
       })
     },
     [computeSteps, delegate, steps, stakeAmount]

packages/core-mobile/app/new/features/ledger/screens/LedgerReviewTransactionScreen.tsx

@@ -20,13 +20,8 @@ import { LedgerAppType } from 'services/ledger/types'
 import Logger from 'utils/Logger'
 import { useHeaderHeight } from '@react-navigation/elements'
 import { Operation } from 'services/earn/computeDelegationSteps/types'
-import {
-  LedgerReviewTransactionParams,
-  ledgerParamsCache
-} from '../services/ledgerParamsCache'
-import { useLedgerWalletMap } from '../store'
+import { useLedgerWalletMap, useLedgerParams } from '../store'
 import { getLedgerAppName } from '../utils'
-import { withLedgerParamsCache } from '../services/withLedgerParamsCache'
 
 type Phase = 'connection' | 'progress'
 
@@ -70,13 +65,17 @@ const getStepConfig = (operation: Operation | null): StepConfig => {
   }
 }
 
-const LedgerReviewTransactionScreen = ({
-  params: { network, onApprove, onReject, stakingProgress }
-}: {
-  params: LedgerReviewTransactionParams
-}): JSX.Element => {
+const LedgerReviewTransactionScreen = (): JSX.Element | null => {
   const walletId = useSelector(selectActiveWalletId)
   const { ledgerWalletMap } = useLedgerWalletMap()
+  const { reviewTransactionParams } = useLedgerParams()
+
+  // Extract params from store
+  const network = reviewTransactionParams?.network
+  const onApprove = reviewTransactionParams?.onApprove
+  const onReject = reviewTransactionParams?.onReject
+  const stakingProgress = reviewTransactionParams?.stakingProgress
+
   const [isConnected, setIsConnected] = useState(false)
   const [isAvalancheAppOpen, setIsAvalancheAppOpen] = useState(false)
   const [isCancelEnabled, setIsCancelEnabled] = useState(false)
@@ -161,33 +160,26 @@ const LedgerReviewTransactionScreen = ({
       deviceForWallet &&
       isConnected &&
       isAvalancheAppOpen &&
-      phase === 'connection'
+      phase === 'connection' &&
+      onApprove
     ) {
       if (stakingProgress) {
-        // Set up progress callback before starting the transaction
-        ledgerParamsCache.ledgerReviewTransactionParams.set({
-          network,
-          onApprove,
-          onReject,
-          stakingProgress: {
-            ...stakingProgress,
-            onProgress: (step: number, operation: Operation | null) => {
-              setCurrentStep(step)
-              setCurrentOperation(operation)
-
-              // Auto-complete when all steps are done
-              if (step >= stakingProgress.totalSteps) {
-                setTimeout(() => {
-                  stakingProgress.onComplete()
-                }, 500) // Brief delay to show final state
-              }
-            }
+        // Create progress callback that updates local state
+        const onProgress = (step: number, operation: Operation | null): void => {
+          setCurrentStep(step)
+          setCurrentOperation(operation)
+
+          // Auto-complete when all steps are done
+          if (step >= stakingProgress.totalSteps) {
+            setTimeout(() => {
+              stakingProgress.onComplete()
+            }, 500) // Brief delay to show final state
           }
-        })
+        }
         // Transition to progress phase
         setPhase('progress')
-        // Start the transaction process
-        onApprove()
+        // Start the transaction process with progress callback
+        onApprove(onProgress)
       } else {
         // No staking progress tracking, just approve and let the caller handle navigation
         onApprove()
@@ -199,9 +191,7 @@ const LedgerReviewTransactionScreen = ({
     isAvalancheAppOpen,
     phase,
     stakingProgress,
-    onApprove,
-    network,
-    onReject
+    onApprove
   ])
 
   useEffect(() => {
@@ -463,6 +453,11 @@ const LedgerReviewTransactionScreen = ({
     renderDeviceItem
   ])
 
+  // Return null if params not available (placed after all hooks to comply with rules of hooks)
+  if (!reviewTransactionParams || !onApprove || !onReject) {
+    return null
+  }
+
   return (
     <ScrollScreen
       isModal
@@ -478,6 +473,4 @@ const LedgerReviewTransactionScreen = ({
   )
 }
 
-export default withLedgerParamsCache('ledgerReviewTransactionParams')(
-  LedgerReviewTransactionScreen
-)
+export default LedgerReviewTransactionScreen

packages/core-mobile/app/new/features/ledger/services/ledgerParamsCache.ts

@@ -1,4 +1,6 @@
+import { Network } from '@avalabs/core-chains-sdk'
 import { ZustandStorageKeys } from 'resources/Constants'
+import { OnDelegationProgress } from 'contexts/DelegationContext'
 import { zustandMMKVStorage } from 'utils/mmkv/storages'
 import { create } from 'zustand'
 import { persist } from 'zustand/middleware'
@@ -16,6 +18,27 @@ interface LedgerWalletMapState {
   resetLedgerWalletMap: () => void
 }
 
+// Types for ledger review transaction params
+export type StakingProgressParams = {
+  totalSteps: number
+  onComplete: () => void
+  onCancel: () => void
+}
+
+export type LedgerReviewTransactionParams = {
+  network: Network
+  onApprove: (onProgress?: OnDelegationProgress) => Promise<void>
+  onReject: (message?: string) => void
+  stakingProgress?: StakingProgressParams
+}
+
+interface LedgerParamsState {
+  reviewTransactionParams: LedgerReviewTransactionParams | null
+  setReviewTransactionParams: (
+    params: LedgerReviewTransactionParams | null
+  ) => void
+}
+
 export const ledgerWalletMapStore = create<LedgerWalletMapState>()(
   persist(
     (set, get) => ({
@@ -50,3 +73,13 @@ export const ledgerWalletMapStore = create<LedgerWalletMapState>()(
 export const useLedgerWalletMap = (): LedgerWalletMapState => {
   return ledgerWalletMapStore()
 }
+
+// Ephemeral store for ledger params (no persistence needed)
+export const ledgerParamsStore = create<LedgerParamsState>(set => ({
+  reviewTransactionParams: null,
+  setReviewTransactionParams: params => set({ reviewTransactionParams: params })
+}))
+
+export const useLedgerParams = (): LedgerParamsState => {
+  return ledgerParamsStore()
+}

packages/core-mobile/app/new/features/ledger/services/withLedgerParamsCache.tsx

@@ -1,11 +1,9 @@
 import { router } from 'expo-router'
 import { ChainId, Network, NetworkVMType } from '@avalabs/core-chains-sdk'
 import { LedgerAppType, LedgerDerivationPathType } from 'services/ledger/types'
+import { OnDelegationProgress } from 'contexts/DelegationContext'
 import { z } from 'zod'
-import {
-  ledgerParamsCache,
-  StakingProgressParams
-} from '../services/ledgerParamsCache'
+import { ledgerParamsStore, StakingProgressParams } from '../store'
 
 export const showLedgerReviewTransaction = ({
   network,
@@ -14,11 +12,11 @@ export const showLedgerReviewTransaction = ({
   stakingProgress
 }: {
   network: Network
-  onApprove: () => Promise<void>
+  onApprove: (onProgress?: OnDelegationProgress) => Promise<void>
   onReject: (message?: string) => void
   stakingProgress?: StakingProgressParams
 }): void => {
-  ledgerParamsCache.ledgerReviewTransactionParams.set({
+  ledgerParamsStore.getState().setReviewTransactionParams({
     network,
     onApprove,
     onReject,