Например есть такой путь
state.loyalty.calculation.purchase.bonuses.applied

Надо запросить оттуда данные в 10 компонентах, везде будешь писать так?
useSelector(state => state.loyalty.calculation.purchase.bonuses.applied)

Или может создать 1 раз функцию и писать нормально?
useSelector(loyaltySelectors.appliedBonuses)

Не может быть опечаток / не надо лазать по другим компонентам чтобы скопировать
При изменении структуры стора надо поменять путь всего в 1 месте
И из этого еще куча плюсов вытекает

спасибо, но мне кажется не стоит меня так нагружать. в доках react-redux показывают примеры
const {totalCapital, availableFunds, investments} = useSelector(state => state.common);
правда, без {...}

Ну, будешь писать точно как у них в примере этом, потом нарвешься на кучу проблем, предупреждение

Ну, будешь писать точно как у них в примере этом, потом нарвешься на кучу проблем, предупреждение

но я так понял, дело не в производительности, а в именовании переменных? хотя кто то выше написал что я выгружаю все хранилище этим селектором

но я так понял, дело не в производительности, а в именовании переменных? хотя кто то выше написал что я выгружаю все хранилище этим селектором

Есть главный функциональный компонент, в котором я получил данные из стейта с помощью useSelector
В нем же есть дочерние компоненты:

1- Отрисовывает колонки

 {card  && card.map((item, index) => <Column key={index} column={item} />)}

2- форма, которая эти колонки добавляет(Диспатч я прокинул в форму, он нормально отрабатывает в redux dev tools изменения в стейт добавляются)

 <FormAddColumn addColumn={onClickAddColumn} />
  const onClickAddColumn = useCallback(
    (column) => {
      dispatch(addColumn(column));
    },
    [dispatch]
  );

Подтолкните в какую нибудь сторону, чтобы ререндирился главный компонент

И еще по тому же принципу нельзя делать такие селекторы

const appliedBonuses = state => state.loyalty.calculation.purchase.bonuses.applied
const collectedBonuses = state => state.loyalty.calculation.purchase.bonuses.collected

Так как если например если loyalty заменится на bonusProgram, надо будет менять в куче мест
Поэтому все выносится в функции, и селектор знает только об одной/нескольких таких функциях

const loyalty = state => everything(state).loyalty
const loyaltyCalculation => state => loyalty(state).calculation
const purchaseCalculation => state => loyaltyCalculation(state).purchase
const calculatedBonuses = state => calculatedBonuses(state).bonuses

есть где то статья? я бы переписал

есть где то статья? я бы переписал

И еще по тому же принципу нельзя делать такие селекторы

const appliedBonuses = state => state.loyalty.calculation.purchase.bonuses.applied
const collectedBonuses = state => state.loyalty.calculation.purchase.bonuses.collected

Так как если например если loyalty заменится на bonusProgram, надо будет менять в куче мест
Поэтому все выносится в функции, и селектор знает только об одной/нескольких таких функциях

const loyalty = state => everything(state).loyalty
const loyaltyCalculation => state => loyalty(state).calculation
const purchaseCalculation => state => loyaltyCalculation(state).purchase
const calculatedBonuses = state => calculatedBonuses(state).bonuses

подскажи, плиз ,если у меня вот такие селекторы, как их правильно переписать?

import { useTypedSelector } from "src/useTypedSelector";

export const usersSelector = () =>
  useTypedSelector((state) => state.users.items);

export const errorSelector = () =>
  useTypedSelector((state) => state.users.error);

вынести отдельный селектор для юзеров, и от него уже брать селекторы для айтемов и ошибки?

const users = state => state.users
const items = state => users(state).items
const error = state => users(state).error

падажжи. а откуда брать state?