Skip to content

Actions

Zach Plata edited this page Apr 24, 2018 · 1 revision

What are Actions

Actions are simply objects that contain a type and possible other key/values that hold data. It is the means by which to get data from the UI to the application state. When an action is dispatched by Redux, the action is seen by ALL reducers. The reducers may then decide whether or not to update the application state based upon the action type. For example, imagine the user is on the medication prescription view of the Sandbox, where the current hook the application handles is medication-prescribe. When the user clicks the Patient View tab, the UI dispatches an action such as the one below.

{
  type: 'SET_HOOK`,
  hook: 'patient-view',
}

This action is sent to all reducers, and the hookReducers function may be the only interested reducer in updating state (to set the hook of the application to patient-view and the view of the Sandbox to change to Patient View tab). Action types are defined strings located in the src/actions/action-types.js file.

Action Creators

Action creators help define a function template that can be called in the view to make creating actions easier with less boilerplate. Take a look at src/actions/hook-actions.js. The action creator here is setHook which takes in a hook parameter and returns a newly constructed action. In the view, when the Patient View tab is clicked, the view will tell the reducers to handle the hook action by the line dispatch(setHook('patient-view'));. This is the same thing as saying dispatch({ type: 'SET_HOOK, hook: 'patient-view' });`

How to use

If you want to store additional data in the application state, and there is not an action-creator that makes sense to transfer this data to the state, create an action. Otherwise, modify an existing action-creator to include the data you would like to transfer to the reducers to handle. To add an action, do the following steps:

  1. Add an action type in src/actions/action-types.js
  2. Create a file under src/actions with an action creator to generate the action. See other action files to get a better sense of how to create these.
  3. Update the appropriate reducer file(s) (or create a new one) that will handle the newly created action type
  4. Update the appropriate UI file(s) that will dispatch the newly created actions
  5. Add tests for your action under the tests/actions directory
Clone this wiki locally