redux-saga/effects#Effect TypeScript Examples

The following examples show how to use redux-saga/effects#Effect. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: saga.ts    From celo-web-wallet with MIT License 6 votes vote down vote up 
/**
 * A convenience utility to create a saga and trigger action
 * Use to create simple sagas, for more complex ones use createMonitoredSaga.
 * Note: the wrapped saga this returns must be added to rootSaga.ts
 */
export function createSaga<SagaParams = void>(saga: (...args: any[]) => any, name: string) {
  const triggerAction = createAction<SagaParams>(`${name}/trigger`)

  const wrappedSaga = function* () {
    while (true) {
      try {
        const trigger: Effect = yield take(triggerAction.type)
        logger.debug(`${name} triggered`)
        yield call(saga, trigger.payload)
      } catch (error) {
        logger.error(`${name} error`, error)
      }
    }
  }

  return {
    wrappedSaga,
    trigger: triggerAction,
  }
}
Example #2
Source File: saga.ts    From celo-web-wallet with MIT License 4 votes vote down vote up 
/**
 * A convenience utility to create a wrapped saga that handles common concerns like
 * trigger watching, cancel watching, timeout, progress updates, and success/fail updates.
 * Use to create complex sagas that need more coordination with the UI.
 * Note: the wrapped saga and reducer this returns must be added to rootSaga.ts
 */
export function createMonitoredSaga<SagaParams = void>(
  saga: (params: SagaParams) => any,
  name: string,
  options?: MonitoredSagaOptions
) {
  const triggerAction = createAction<SagaParams>(`${name}/trigger`)
  const cancelAction = createAction<void>(`${name}/cancel`)
  const statusAction = createAction<SagaStatus>(`${name}/progress`)
  const errorAction = createAction<string>(`${name}/error`)
  const resetAction = createAction<void>(`${name}/reset`)

  const reducer = createReducer<SagaState>({ status: null, error: null }, (builder) =>
    builder
      .addCase(statusAction, (state, action) => {
        state.status = action.payload
        state.error = null
      })
      .addCase(errorAction, (state, action) => {
        state.status = SagaStatus.Failure
        state.error = action.payload
      })
      .addCase(resetAction, (state) => {
        state.status = null
        state.error = null
      })
  )

  const wrappedSaga = function* () {
    while (true) {
      try {
        const trigger: Effect = yield take(triggerAction.type)
        logger.debug(`${name} triggered`)
        yield put(statusAction(SagaStatus.Started))
        const { result, cancel, timeout } = yield race({
          // Note: Use fork here instead if parallelism is required for the saga
          result: call(saga, trigger.payload),
          cancel: take(cancelAction.type),
          timeout: delay(options?.timeoutDuration || DEFAULT_TIMEOUT),
        })

        if (cancel) {
          logger.debug(`${name} canceled`)
          yield put(errorAction('Action was cancelled.'))
          continue
        }

        if (timeout) {
          logger.warn(`${name} timed out`)
          yield put(errorAction('Action timed out.'))
          continue
        }

        if (result === false) {
          logger.warn(`${name} returned failure result`)
          yield put(errorAction('Action returned failure result.'))
          continue
        }

        yield put(statusAction(SagaStatus.Success))
        logger.debug(`${name} finished`)
      } catch (error: any) {
        logger.error(`${name} error`, error)
        yield put(errorAction(errorToString(error)))
      }
    }
  }

  return {
    name,
    wrappedSaga,
    reducer,
    actions: {
      trigger: triggerAction,
      cancel: cancelAction,
      progress: statusAction,
      error: errorAction,
      reset: resetAction,
    },
  }
}