How to sort data from redux?

Question

React

Good afternoon, there is data - "Houses" and "History of Houses".

In the container component (HousesListContainer), I use a selector to receive and form (combine) this data.
Then I pass them to the stupid component (HousesList) as props.
HousesList is a simple table sorted by columns.

The data for sorting (key and direction) does not need to be stored in the redux store .
I make a decision - to store the sorting data (key and direction) in the local state of the component (HousesList).

But here I am faced with such a problem, how can I process (sort) the data that came in props and send it to render?

So far, I know only 1 method - to save the data passed to props in a local state and work with this data already.

But this approach seems extremely crutch to me, because the original data is stored in the redux store, with the selector I get the data I need, compose it, pass it to the presentation component, where it will save this data to the local state and will already work with it.

I think you can somehow simplify everything and use a selector that will sort the data.

How to solve such problems correctly?

Answer 1

So what's the problem? Take an array of props and sort.

const HousesList = (props) => {
  const { items } = props;

  const [sorting, setSotring] = useState(/* состояние сортировки */);

  const sortedItems = useMemo(
    () => items.slice().sort(/* логика сортировки */),
    [items, sorting],
  );

  /* дальше работаете с sortedItems */
};