'Wait for previous dispatch action to complete

const onFeedSubmit = async (data: PostFeedActionProps) => {
    try {
      setPostingFeed(true);

      selectedBusinessList.forEach(business => {
        apiUtils.postFeed(data, business.value).then(postResponse => {
          setFeeds(feeds => [postResponse, ...feeds]);

          const isInSameQuarter = isDateInCurrentQuarter(
            data.type === Type.CALL ? data.call.heldOn : data.meeting.heldOn
          );

          if (isInSameQuarter) {
            localDispatch(
              setThisQuarter({
                ...thisQuarter,
                totalActivities: thisQuarter.totalActivities + 1,
              })
            );
            if (!thisQuarterPostedEntities.includes(business.value)) {
              setThisQuarterPostedEntities([...thisQuarterPostedEntities, business.value]);
            }
          } else {
            localDispatch(
              setLastQuarter({
                ...lastQuarter,
                totalActivities: lastQuarter.totalActivities + 1,
              })
            );

            if (!lastQuarterPostedEntities.includes(business.value)) {
              setLastQuarterPostedEntities([...lastQuarterPostedEntities, business.value]);
            }
          }
        });
      });
      setSelectedBusinessList(() => []);
    } catch (e) {
      toast(
        // tslint:disable-next-line: max-line-length
        
      );
    } finally {
      setPostingFeed(false);
    }
  };

I am calling an API. Then after that I am updating totalActivities by 1 using dispatch action.

The problem is on UI it get only one update.

Basically it is not waiting for all dispatch action to get completed.

If I have 2 businesses then API is called twice and totalActivities should be increases by 2.

But here it is increment by 1 only.

How can I wait for all dispatch actions to get completed.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source