This package contains utilities that can help create Redux features.

Creates a reducer that requires action.reducerId to match specified reducerId.

Creates a reducer that applies the inner reducer to a state[action.recordId] instead of directly to state.

This reducer keeps a workspace state and a committed state. Changes can be made to workspace, which can then be committed.

This reducer stores entities by id. Entities can be added, removed and updated.

This reducer stores a single entity. It can be replaced and partially updated.

This reducer stores a list and provides actions for manipulating the items in the list.

This reducer uses entity-by-id-reducer to store information about current CRUD operation state. It contains flags such as loading, error, etc.

This reducer uses entity-by-id-reducer to store information about a change made to something. For example, if a user enters data into fields in a form, you can keep track of the changes made by the users to batch all updates.

This reducer contains a list of ids that can be toggled on or off. This can be used when having a list of checkboxes that can be toggled on or off.

This reducer keeps track of a sort order where the order is determined by a list of ids. This is useful when different lists sort the same entity, but does not have access to the same fields.

This reducer keeps track of sort order by key, such as column name.

Here is an example.

This makes it easy to have a state split into workspace and committed state.

This can be useful when editing a form, which uses workspace state. When user presses enter, it is committed.

A search query is built from committed state, and thus, the search is triggered when the commit occurs, instead of on every keystroke.

export const timeTableFilterReducer =
  createCommitReducer<TimeTableFilterState>("timeTableFilter",
  {
    workspace: INITIAL_STATE,
    committed: INITIAL_STATE
  });

• First argument is the id of the reducer. (You can have multiple)
• Second argument is initial state, which must be { workspace: X, committed: Y }.
• X can be the same as Y, but it is not required.

export const { setValues, commitValues, clearValues } =
  createCommitReducerActions<TimeTableFilterState>("timeTableFilter");

// In component
const dispatch = useDispatch();
dispatch(setValues({ email: "user@example.com" }));

• The first argument is the id of the reducer.

export const { getWorkspaceValues, getCommittedValues } = createCommitReducerSelectors<
  StoreState,
  TimeTableFilterState
>("timeTableFilter", state => state.timeTableFilter);

// In component
const filterValues = useSelector(getWorkspaceValues);

• First argument is the id of the reducer.
• Second argument is a selector which selects the reducers state from global store state.