feat(redux-saga): typings for request

Author: paibamboo

src/app/containers/Stars.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import {IStars, IStarsAction} from "../models/starsModel";
-import {STARS_REQUEST} from "../redux/modules/starsModule";
+import {actionType} from "../redux/modules/starsModule";
 const {connect} = require("react-redux");
 
 interface IProps {
@@ -11,7 +11,7 @@ interface IProps {
 @connect(
   (state) => ({stars: state.stars}),
   (dispatch) => ({
-    getStars: () => dispatch({type: STARS_REQUEST})
+    getStars: () => dispatch({type: actionType.REQUEST})
   })
 )
 class Stars extends React.Component<IProps, {}> {

src/app/helpers/promiseReducer.ts

@@ -1,18 +1,24 @@
 import IBaseAction from "../models/IBaseAction";
 
-export default function promiseReducer<TState, TAction>(baseAction: string, state: TState, action: IBaseAction & TAction): TState {
+export interface IRequestType {
+  REQUEST: string;
+  SUCCESS: string;
+  FAILURE: string;
+}
+
+export default function promiseReducer<TState, TAction>(actionType: IRequestType, state: TState, action: IBaseAction & TAction): TState {
   switch (action.type) {
-    case baseAction + "_REQUEST":
+    case actionType.REQUEST:
       return Object.assign({}, state, {
         payload: null
       });
 
-    case baseAction + "_SUCCESS":
+    case actionType.SUCCESS:
       return Object.assign({}, state, {
         payload: action.payload
       });
 
-    case baseAction + "_FAILURE":
+    case actionType.FAILURE:
       return Object.assign({}, state, {
         error: true,
         message: action.message

src/app/redux/modules/starsModule.test.ts

@@ -1,9 +1,9 @@
-import {STARS_FAILURE, STARS_REQUEST, STARS_SUCCESS, starsReducer} from "./starsModule";
+import {actionType, starsReducer} from "./starsModule";
 
 describe("Stars Reducer", () => {
 
   it("handles action of type STARS_REQUEST", () => {
-    const action = { type: STARS_REQUEST };
+    const action = { type: actionType.REQUEST };
     const stateBefore = {};
     const stateAfter = { payload: null };
     expect(starsReducer(stateBefore, action)).toEqual(stateAfter);
@@ -14,7 +14,7 @@ describe("Stars Reducer", () => {
       payload: {
         stargazers_count: 99
       },
-      type: STARS_SUCCESS
+      type: actionType.SUCCESS
     };
     const stateBefore = {};
     const stateAfter = {
@@ -26,7 +26,7 @@ describe("Stars Reducer", () => {
   });
 
   it("handles action of type STARS_FAILURE", () => {
-    const action = { type: STARS_FAILURE };
+    const action = { type: actionType.FAILURE };
     const stateBefore = {};
     const stateAfter = { error: true};
     expect(starsReducer(stateBefore, action)).toEqual(stateAfter);

src/app/redux/modules/starsModule.ts

@@ -1,10 +1,11 @@
 import {IStars, IStarsAction} from "models/starsModel";
-import promiseReducer from "../../helpers/promiseReducer";
+import promiseReducer, {IRequestType} from "../../helpers/promiseReducer";
 
-/** Action Types */
-export const STARS_REQUEST: string = "stars/STARS_REQUEST";
-export const STARS_SUCCESS: string = "stars/STARS_SUCCESS";
-export const STARS_FAILURE: string = "stars/STARS_FAILURE";
+export const actionType: IRequestType = {
+  FAILURE: "STARS_FAILURE",
+  REQUEST: "STARS_REQUEST",
+  SUCCESS: "STARS_SUCCESS"
+};
 
 /** Initial State */
 const initialState: IStars = {
@@ -13,5 +14,5 @@ const initialState: IStars = {
 
 /** Reducer */
 export function starsReducer(state: IStars = initialState, action: IStarsAction): IStars {
-  return promiseReducer<IStars, IStarsAction>("stars/STARS", state, action);
+  return promiseReducer<IStars, IStarsAction>(actionType, state, action);
 }

src/app/sagas/starsSaga.test.ts

@@ -1,5 +1,5 @@
 import {call, takeLatest} from "redux-saga/effects";
-import {STARS_FAILURE, STARS_REQUEST, STARS_SUCCESS} from "../redux/modules/starsModule";
+import {actionType} from "../redux/modules/starsModule";
 import makeRequest from "./makeRequest";
 import {fetchStars, watchStarsLoad} from "./starsSaga";
 import TestApi from "./TestApi";
@@ -10,7 +10,7 @@ describe("starsSaga", () => {
 
     it("must call makeRequest of api.getStars", () => {
       const api = new TestApi();
-      expect(gen.next().value).toEqual(call(makeRequest, api.getStars, STARS_SUCCESS, STARS_FAILURE));
+      expect(gen.next().value).toEqual(call(makeRequest, api.getStars, actionType.SUCCESS, actionType.FAILURE));
     });
 
     it("must be done", () => {
@@ -22,7 +22,7 @@ describe("starsSaga", () => {
     const gen = watchStarsLoad();
 
     it("must call takeLatest of STARS_REQUEST", () => {
-      expect(gen.next().value).toEqual(takeLatest(STARS_REQUEST, fetchStars));
+      expect(gen.next().value).toEqual(takeLatest(actionType.REQUEST, fetchStars));
     });
 
     it("must be done", () => {

src/app/sagas/starsSaga.ts

@@ -1,13 +1,13 @@
 import {call, takeLatest} from "redux-saga/effects";
-import {STARS_FAILURE, STARS_REQUEST, STARS_SUCCESS} from "../redux/modules/starsModule";
+import {actionType} from "../redux/modules/starsModule";
 import makeRequest from "./makeRequest";
 import TestApi from "./TestApi";
 
 export function* fetchStars(): any {
   const api = new TestApi();
-  yield call(makeRequest, api.getStars, STARS_SUCCESS, STARS_FAILURE);
+  yield call(makeRequest, api.getStars, actionType.SUCCESS, actionType.FAILURE);
 }
 
 export function* watchStarsLoad(): any {
-  yield takeLatest(STARS_REQUEST, fetchStars);
+  yield takeLatest(actionType.REQUEST, fetchStars);
 }