Selectors

Selectors

The client application uses selectors whenever any data in the redux store is needed in a React component.

If you are not familiar with redux and specifically how to use its mapStateToProps function it would be helpful to understand that before attempting to use selectors.

Selectors are basically just a wrapper used when querying data in the redux store. Internally they make use of the recompose library. They are defined in the createSelectors methods of the reducer definition files if you are interested in their internal workings.

To use selectors first import it from the client/store/selectors.js file.

import selectors from '../store/selectors'

Note: you may need to include more ../ if the file is located deeper in the file tree

Then add the redux mapStateToProps function to the file where you define your React component (but don't add the function inside the react component itself). Have that function return an object where the keys are descriptors of your choice and the values are the selectors you want to use.

const mapStateToProps = state => {
  return {
    customers: selectors.customer.getAll
    foodItems: selectors.food.item.getAll
    currentUser: selectors.user.getUser
  }
}

In your React component you can access the data through the props object using the keys you defined in the mapStateToProps return object.

class MyComponent extends React.Component {
  render = () =>
   <div>
      <div>{this.props.customers[0]}</div>
      <div>{this.props.foodItems[0]}</div>
      <div>{this.props.currentUser}</div>
    </div>
}

In the export statement for your React component don't forget to wrap the component with the redux connect method with mapStateToProps as a parameter.

export default connect(mapStateToProps)(MyComponent)

Following is a list of selectors that are defined as of 8/24/2017

selectors.app.dialog.getDialog selectors.app.dialog.isVisible

selectors.customer.getAll selectors.customer.getOne selectors.customer.getScheduled selectors.customer.loading selectors.customer.loadError selectors.customer.saving selectors.customer.saveError

selectors.delivery.location.getAddressCoordinates selectors.delivery.location.getUserCoordinates selectors.delivery.location.loadingAddressLocation selectors.delivery.location.loadingAddressLocationError selectors.delivery.location.loadingUserLocation selectors.delivery.location.loadingUserLocationError

selectors.delivery.assignment.getFilter selectors.delivery.assignment.getDriverId selectors.delivery.assignment.getSelectedCustomerIds selectors.delivery.assignment.getFilteredCustomers selectors.delivery.assignment.isCustomerSelected selectors.delivery.assignment.isFetching selectors.delivery.assignment.hasError

selectors.delivery.route.isFetching selectors.delivery.route.hasError selectors.delivery.route.getRoute selectors.delivery.route.getWaypoints selectors.delivery.route.getOrigin selectors.delivery.route.getDestination selectors.delivery.route.getAllWaypoints

selectors.donation.getAll selectors.donation.getOne(id) selectors.donation.saving selectors.donation.saveError

selectors.donor.getAll selectors.donor.getOne(id) selectors.donor.loading selectors.donor.loadError selectors.donor.saving selectors.donor.saveError

selectors.food.item.getAll selectors.food.item.getOne(id) selectors.food.item.getScheduled selectors.food.item.saving selectors.food.item.saveError

selectors.food.category.getAll selectors.food.category.getOne(id) selectors.food.category.loading selectors.food.category.loadError selectors.food.category.saving selectors.food.category.saveError

selectors.food.packages.packages selectors.food.packages.loading selectors.food.packages.loadError selectors.food.packages.saving selectors.food.packages.saveError

selectors.media.getMedia selectors.media.loading selectors.media.loadError selectors.media.saving selectors.media.saveError

selectors.page.getAll(type) selectors.page.getOne(identifier) selectors.page.loading selectors.page.loadError selectors.page.saving selectors.page.saveError

selectors.questionnaire.getAll selectors.questionnaire.getOne(identifier) selectors.questionnaire.getLinkableFields(identifier) selectors.questionnaire.loading selectors.questionnaire.loadError selectors.questionnaire.saving selectors.questionnaire.saveError

selectors.qEditor.getSectionIds selectors.qEditor.getSectionById(id) selectors.qEditor.getFieldIds(sectionId) selectors.qEditor.getFieldById(id) selectors.qEditor.getEditingQuestionnaire selectors.qEditor.getEditingSection selectors.qEditor.getEditingField selectors.qEditor.getSelectedSection selectors.qEditor.getCompleteQuestionnaire selectors.qEditor.isDirty

selectors.settings.getSettings selectors.settings.fetching selectors.settings.error selectors.settings.success

selectors.user.getUser selectors.user.fetching selectors.user.error selectors.user.success

selectors.volunteer.getAll selectors.volunteer.getAllDrivers selectors.volunteer.getOne(id) selectors.volunteer.loading selectors.volunteer.loadError selectors.volunteer.saving selectors.volunteer.saveError