aikoven / typescript-fsa-redux-saga

TypeScript FSA utilities for redux-saga
MIT License
61 stars 4 forks source link

Example with takeEvery and type params #13

Open satanworker opened 4 years ago

satanworker commented 4 years ago
export const getSubscriptions = actionCreator.async<string, GetSubscriptionsPayload>(
  "subscriptions/GET_SUBSCRIPTIONS", {
    skipStartedAction: true
  }
)

// saga

const getSubscriptionsSaga = bindAsyncAction(getSubscriptions)(
  function* (payload): SagaIterator {
    const { data }: AxiosResponse<ServicesResponseType> = yield call(get, `subscriptions/${payload}`)
    console.log(data)
    return data
  }
)

export default function* () {
  yield takeEvery(getSubscriptions.type, getSubscriptionsSaga)

it's pretty basic but I can't get it working with! is there an example of it?

satanworker commented 4 years ago

Please let me know if there is anything I can help with, will share live example in few, thank you for this amazing lib!

aikoven commented 4 years ago

So what's the problem exactly?

satanworker commented 3 years ago

I'm so sorry, I didn't reply! I'm using this library every day and it is really helpful. Thank you so much for that Unfortunately, I didn't get notifications from github and took me some time to realize there is an open issue by me

That's the issue I was describing

import { GoodCardType } from "src/templates/utils/types/goodType";
import actionCreatorFactory, { Action } from "typescript-fsa";

export type GoodsWidgetStateType = {
  readonly loading: boolean
  readonly goods: GoodCardType[]
}

// ACTIONS
const actionCreator = actionCreatorFactory()

type TriggetGetWidgetGoodsPayloadType = {}
// I'm using specific action to "trigger"
export const triggerGetWigetGoods = actionCreator<TriggetGetWidgetGoodsPayloadType>
  ("goodsWidget/TRIGGER_GET_GOODS")

// and another action to use in bindAsyncAction in saga files
export const getWidgetGoods = actionCreator.async<Action<TriggetGetWidgetGoodsPayloadType>, {}>
  ("goodsWidget/GET_GOODS")

here how it looks

import { takeLatest } from "redux-saga/effects";
import { triggerGetWigetGoods, getWidgetGoods } from './goodsWidgetType'
import { bindAsyncAction } from "typescript-fsa-redux-saga";
import { SagaIterator } from "redux-saga";

const getGoodsWidgetSaga = bindAsyncAction(getWidgetGoods)(function* ({ payload }): SagaIterator {

})

export default function* () {
 // triggerType is used to bind the saga 
  yield takeLatest(triggerGetWigetGoods.type, getGoodsWidgetSaga)
}

Initially, I was trying to use getWidgetGoods.type and I didn't know I should've used separate action to trigger the action, let me know if an interactive example would be helpful, it works quite nice with 2 actions though, payload type is properly typed in bindAsyncAction