Need Help with react redux saga app (Mentor)

Need Help with react redux saga app (Mentor)
0

#1

I’m building an app, I’m not able to judge what states, actions should be available for different scenarios. I’m kinda confused with little complexity.
I’ve one of action file like below

    const actions = {
      DEALS_LIST_FETCH_REQUEST: 'DEALS_LIST_FETCH_REQUEST',
      DEALS_LIST_FETCH_SUCCEED: 'DEALS_LIST_FETCH_SUCCEED',
      DEALS_LIST_FETCH_FAILED: 'DEALS_LIST_FETCH_FAILED',

      DEAL_FETCH_REQUEST: 'DEAL_FETCH_REQUEST',
      DEAL_FETCH_SUCCEED: 'DEAL_FETCH_SUCCEED',
      DEAL_FETCH_FAILED: 'DEAL_FETCH_FAILED',

      DEAL_ADD_REQUEST: 'DEAL_ADD_REQUEST',
      DEAL_ADD_SUCCEED: 'DEAL_ADD_SUCCEED',
      DEAL_ADD_FAILED: 'DEAL_ADD_FAILED',
      DEAL_ADD_RESET: 'DEAL_ADD_RESET',

      DEAL_UPDATE_REQUEST: 'DEAL_UPDATE_REQUEST',
      DEAL_UPDATE_SUCCEED: 'DEAL_UPDATE_SUCCEED',
      DEAL_UPDATE_FAILED: 'DEAL_UPDATE_FAILED',

      DEAL_REMOVE_REQUEST: 'DEAL_REMOVE_REQUEST',
      DEAL_REMOVE_SUCCEED: 'DEAL_REMOVE_SUCCEED',
      DEAL_REMOVE_FAILED: 'DEAL_REMOVE_FAILED',

      fetchDeals: (payload) => {
        return {
          type: actions.DEALS_LIST_FETCH_REQUEST,
          payload
        }
      },
      fetchDeal: (payload) => {
        return {
          type: actions.DEAL_FETCH_REQUEST,
          payload
        }
      },

      ...
      ...

    }

one of saga function is like below

export function* fetchDeals() {
  yield takeEvery(actions.DEALS_LIST_FETCH_REQUEST, function* ({ payload }) {
    try {
      const { msg, data } = yield call(Api.fetchDeals, payload);
      yield put({ type: actions.DEALS_LIST_FETCH_SUCCEED, payload: data, msg });
    } catch (e) {
      yield put({ type: actions.DEALS_LIST_FETCH_FAILED, error: e.msg });
    }
  });
}

and reducer be like

    const initState = {
      dealList: { deals: [], error: null, loading: false },
      newDeal: { deal: null, error: null, loading: false },
      activeDeal: { deal: null, error: null, loading: false },
      deletedDeal: { deal: null, error: null, loading: false },
    };

    export default function dealReducer(state = initState, action) {
      switch (action.type) {
        case actions.DEALS_LIST_FETCH_SUCCEED:
          return {
            ...state,
            dealList: {
              deals: action.payload && action.payload.deals,
              msg: action.msg,
              error: null,
              loading: false
            },
          };
        case actions.DEAL_FETCH_SUCCEED:
          return {
            ...state,
            activeDeal: {
              deal: action.payload && action.payload.deal,
              msg: action.msg,
              error: null,
              loading: false
            },
          };
        default:
          return state;
      }
    }

I’m not satisfied with above code, if this is how it should be implemented.
loading state isn’t working as where to make it true (REQUEST action is taken care by sagas)

similarly I need update one deal from multiple form, like changing its date from a table… or select category from some other page, or other update from a modal form. How these state should be interrelated.

May be my question is too broad or unclear, please let me know or ask questions, I’ll update my question accordingly.

If one can see me code (live share), would be much beneficial.

Thanks a lot in advance