Miss any of our Open RFC calls?Watch the recordings here! »

@alexseitsinger/redux-action-types

3.2.0 • Public • Published

Redux Action Types

Helpers for redux

Installation

yarn add @alexseitsinger/redux-action-types

Exports

createActionTypes

Usage
import { createActionTypes } from "@alexseitsinger/redux-action-types"
 
export default createActionTypes({
  prefix: "dates",
  names: ["dates-for-week", ["dates-for-week", ["success", "failure"]],
})
 
// returns
{
  "DATES_FOR_WEEK": "@@dates/DATES_FOR_WEEK",
  "SUCCESS": "@@dates/DATES_FOR_WEEK_SUCCESS",
  "FAILURE": "@@dates/DATES_FOR_WEEK_FAILURE",
}

createActionTypeSections

Usage
// home/constants/sections/dates.ts
 
export default [
  "dates-for-week",
  ["dates-for-week", [
    "success",
    "failure",
  ]],
]
 
// home/constants/index.ts
import { createActionTypeSections } from "@alexseitsinger/redux-action-types"
 
import datesConstants from "./sections/dates"
 
export default createActionTypeSections({
  prefix: "home-page",
  sections: {
    dates: datesActionNames,
  },
})
 
// returns...
 
{
  home{
    dates{
      DATES_FOR_WEEK"@@home-page/dates/DATES_FOR_WEEK",
      DATES_FOR_WEEK_SUCCESS"@@home-page/dates/dates-for-week/SUCCESS",
      DATES_FOR_WEEK_FAILURE"@@home-page/dates/dates-for-week/FAILURE",
    },
  },
}

createFlatReducer

Usage
// home/reducer/index.ts
import { createFlatReducer } from "@alexseitsinger/redux-action-types"
import actionTypes from "../constants"
import defaultState from "./defaultState.json"
 
export default createFlatReducer({
  defaultState,
  actionTypes,
  reducer: (action, state, setState) => {
    switch (action.type) {
      case actionTypes.ADD: {
        return setSectionState({
          items: [state.items, action.obj],
        })
      }
    }
    return state
  }
})

createSectionReducer

Usage
// home/reducer/sections/dates.ts
import { AnyAction } from "redux"
 
import { AnyActionType } from "src/types/actions"
import { PageReducerState, DatesSectionState } from "../../"
 
type ReducerReturnType = DatesSectionState | PageReducerState
 
export default (
  actionAnyAction,
  sectionAnyActionType,
  sectionStateDatesSectionState,
  setSectionState: (o: Partial<DatesSectionState>) => DatesSectionState,
  parentStatePageReducerState,
  setParentState: (o: Partial<PageReducerState>) => PageReducerState,
)ReducerReturnType => {
  switch (action.type) {
    case section.DATES_FOR_WEEK: {
      return setSectionState({
        datesForWeek: action.data,
      })
    }
  }
}
 
// home/reducer/index.js
import { createSectionReducer } from "@alexseitsinger/redux-action-types"
 
import defaultState from "./defaultState.json"
import actionTypeSections from "./constants"
import datesReducer from "./sections/dates"
 
export default createSectionReducer({
  defaultState,
  sections: actionTypeSections,
  reducers: {
    dates: datesReducer,
  },
})

createMapDispatch

Usage
// home/actions/dates.ts
import actionTypeSections from "../../constants"
 
const section = actionTypeSections.dates
 
export const setDatesForWeek = (data: DatesForWeekData): DatesForWeekAction => ({
  type: section.DATES_FOR_WEEK,
  data,
})
 
const getDatesForWeekSuccess = (): DatesForWeekSuccessAction => ({
  type: section.DATES_FOR_WEEK_SUCCESS,
})
 
const getDatesForWeekFailure = (): DatesForWeekFailureAction => ({
  type: section.DATES_FOR_WEEK_FAILURE,
})
 
export const getDatesForWeek = (): ThunkAction => (dispatch: ThunkDispatch): void => {
  // Make some asyncronous API call, then...
  dispatch(getDatesForWeekSuccess())
  dispatch(setDatesForWeek(data))
  // Or...
  dispatch(getDatesForWeekFailure())
}
 
// home/mapDispatchToProps.ts
import { createMapDispatch } from "@alexseitsinger/redux-action-types"
 
import * as datesActions from "./actions/dates"
 
export default createMapDispatch({
  methods: {
    home: {
      dates: datesActions,
    },
  },
  mapDispatch: (dispatch: Dispatch) => ({
    goBack: (): void => {
      dispatch(push("/"))
    },
  }),
})
 
// returns (in component props)...
 
{
  methods{
    home{
      dates{
        getDatesForWeek, setDatesForWeek,
      },
    },
    goBack,
  },
}

Install

npm i @alexseitsinger/redux-action-types

DownloadsWeekly Downloads

1

Version

3.2.0

License

BSD-2-Clause

Unpacked Size

301 kB

Total Files

21

Last publish

Collaborators

  • avatar