Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Where should I handle sorting in Redux App?

I have an action / reducer / components. In one of my components (component dump) I have a Select. I get information on what type of filter my store. Where can I handle it in action, or reducer?

like image 419
ZPPP Avatar asked Dec 26 '15 21:12

ZPPP


People also ask

Should I keep all component's state in Redux store?

Some users prefer to keep every single piece of data in Redux, to maintain a fully serializable and controlled version of their application at all times. Others prefer to keep non-critical or UI state, such as “is this dropdown currently open”, inside a component's internal state. Using local component state is fine.

What state should I store in Redux?

For the most part if you have a react-redux app I would avoid local state entirely unless you can trying to solve a very component specific problem. For example I would use local state if my component does something on a setInterval and so it is keeping its own timer.

What is the recommended files and folder structure for Redux applications?

We specifically recommend organizing your logic into "feature folders", with all the Redux logic for a given feature in a single "slice/ducks" file".

How many stores should a Redux application have?

A store is an immutable object tree in Redux. A store is a state container which holds the application's state. Redux can have only a single store in your application.


1 Answers

IMO, the right place to sort data is not directly in the reducers but in the selectors.

From redux docs:

Computing Derived Data

Reselect is a simple library for creating memoized, composable selector functions. Reselect selectors can be used to efficiently compute derived data from the Redux store.

I'm currently using selectors to filter and sort data.

  1. No data repetition in the state. You don't have to store a copy of the item sorted by one specific way.
  2. The same data can be used in different components, each one using a different selector function to sort for example.
  3. You can combine selector applying many data computations using selector that you already have in the application.
  4. If you do right, your selectors will be pure functions, then you can easily test them.
  5. Use the same selector in many components.
like image 176
Horacio Alexandre Fernandes Avatar answered Sep 17 '22 13:09

Horacio Alexandre Fernandes