Как использовать состояние Redux сразу после установки

Question

Я беру ввод для пользователя, создаю фильтр и добавляю фильтр в redux, но сразу после добавления фильтра мне нужно создать поисковый запрос для отправки в бэкэнд ... поэтому, когда я создаю поискзапросить и добавить его в redux, другие мои компоненты не видят обновления до 3-х повторных визуализаций позже

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

//reducer.ts
switch (action.type) {
    case LOAD_PRODUCT_DATA:
      return Object.assign({}, state, {
        products: {
          productList: state.products.productList = action.payload.productList.slice(0),
          count: state.products.count = action.payload.count
        }
      });
    case ADD_FILTER:
      const duplicateFilter: Array<any> = state.filteringItems.map((filter: any, index: number) => {
        if (filter.header === action.payload.header) {
          console.log('duplicate');
          const filterList = [state.filteringItems, action.payload];
          filterList.splice(index, 1);
          return filterList;
        }
      });
      if (duplicateFilter.length) {
        return Object.assign({}, state, {
          filteringItems: state.filteringItems = duplicateFilter[0].splice(0)
        });
      } else {
        console.log('no duplicate');
        return Object.assign({}, state, {
          filteringItems: state.filteringItems.concat(action.payload)
        });
      }
    case REMOVE_FILTER:
      const filterList = state.filteringItems.filter((item, itemIndex) => {
        return action.payload !== itemIndex;
      });
      return Object.assign({}, state, {
        filteringItems: filterList
      });
    case CLEAR_ALL:
      return Object.assign({}, state, {
        filteringItems: []
      });
    case FILTER_QUERY:
      return Object.assign({}, state, {
        filteringQuery: action.payload
      });
    default:
      return state;
  }

//ProductDashboard.tsx
  const { products, filteringQuery } = useSelector(
    (state: InitialState): StateProps => ({
      filteringQuery: state.filteringQuery,
      products: {
        productList: state.products.productList,
        count: state.products.count
      }
    })
  );

  const dispatch = useDispatch();

  useEffect(() => {
    dispatch(getProductDashboard(filteringQuery));
  }, [filteringQuery]);

//FilterCompponent.tsx
  const [input, setInput] = useState<string>('');
  const [queryParams, setQueryParams] = useState<string>('?limit=50&page=0');
  const [open, setOpen] = useState<boolean>(false);
  const dispatch: Dispatch = useDispatch();
  const { filteringItems } = useSelector(
    (state: InitialState): StateProps => ({
      filteringItems: state.filteringItems
    })
  );

  const handleQueryParams = () => {
    if (filteringItems.length > 0) {
      filteringItems.map((filter: Filter) =>
        setQueryParams(`${queryParams}&${filter.header}=${filter.name}`)
      );
    }
    dispatch(queryFilter(queryParams));
  };

  const handleFilter =  (e?: any) => {
    const cleanedUpInput = input.trim();
    dispatch(addFilteringItem({ name: cleanedUpInput, header: props.header }));
    handlePopup();
    handleQueryParams();
  };

когда я console.log (filteringQuery) в productDashboard, я получаю пустой массив, пока я не добавлю еще 3 фильтра, чем в третий фильтр, filterQuery вернет первый фильтр, который я ввел.