Remove unused setProvider and add action for recoveryFlow to prevent …

…duplicate runs (#2094)

packages/common/src/store/ui/buy-audio/slice.ts

@@ -60,12 +60,6 @@ const slice = createSlice({
   name: 'ui/buy-audio',
   initialState,
   reducers: {
-    setProvider: (
-      state,
-      action: PayloadAction<{ provider: OnRampProvider }>
-    ) => {
-      state.provider = action.payload.provider
-    },
     calculateAudioPurchaseInfo: (
       state,
       _action: PayloadAction<CalculateAudioPurchaseInfoPayload>
@@ -141,12 +135,14 @@ const slice = createSlice({
     },
     buyAudioFlowFailed: (state) => {
       state.error = true
+    },
+    startRecoveryIfNecessary: () => {
+      // Triggers saga
     }
   }
 })
 
 export const {
-  setProvider,
   calculateAudioPurchaseInfo,
   calculateAudioPurchaseInfoSucceeded,
   calculateAudioPurchaseInfoFailed,
@@ -160,7 +156,8 @@ export const {
   swapStarted,
   swapCompleted,
   transferStarted,
-  transferCompleted
+  transferCompleted,
+  startRecoveryIfNecessary
 } = slice.actions
 
 export default slice.reducer

packages/web/src/store/application/ui/buy-audio/sagas.ts

@@ -37,7 +37,7 @@ import {
 import BN from 'bn.js'
 import dayjs from 'dayjs'
 import JSBI from 'jsbi'
-import { takeLatest } from 'redux-saga/effects'
+import { takeLatest, takeLeading } from 'redux-saga/effects'
 import { call, select, put, take, race, fork } from 'typed-redux-saga'
 
 import { make } from 'common/store/analytics/actions'
@@ -74,7 +74,8 @@ const {
   transferCompleted,
   clearFeesCache,
   calculateAudioPurchaseInfoFailed,
-  buyAudioFlowFailed
+  buyAudioFlowFailed,
+  startRecoveryIfNecessary
 } = buyAudioActions
 
 const { setVisibility } = modalsActions
@@ -1064,7 +1065,7 @@ function* recoverPurchaseIfNecessary() {
 
 function* doStartBuyAudioFlow(action: ReturnType<typeof startBuyAudioFlow>) {
   yield* put(setVisibility({ modal: 'BuyAudio', visible: true }))
-  yield* call(recoverPurchaseIfNecessary)
+  yield* put(startRecoveryIfNecessary())
 }
 
 function* watchCalculateAudioPurchaseInfo() {
@@ -1080,14 +1081,23 @@ function* watchStartBuyAudioFlow() {
 }
 
 function* watchRecovery() {
-  yield* call(recoverPurchaseIfNecessary)
+  // Use takeLeading since:
+  // 1) We don't want to run more than one recovery flow at a time (so not takeEvery)
+  // 2) We don't need to interrupt if already running (so not takeLatest)
+  // 3) We do want to be able to trigger more than one time per session in case of same-session failures (so not take)
+  yield takeLeading(startRecoveryIfNecessary, recoverPurchaseIfNecessary)
+}
+
+function* recoverOnPageLoad() {
+  yield* put(startRecoveryIfNecessary())
 }
 
 export default function sagas() {
   return [
     watchOnRampOpened,
     watchCalculateAudioPurchaseInfo,
     watchStartBuyAudioFlow,
-    watchRecovery
+    watchRecovery,
+    recoverOnPageLoad
   ]
 }