Use effect wait for Data from previous page

I’m kinda new to the react framework.
As per my requirement , I want to wait until data arrives and binds to my constants in my useEffect() method.

The data is sent encrypted from the main page and is decrypted as follows :

useEffect(() => {
    const DecryptedGroupID = atob(groupID.toString());
    const DecryptedFactoryID = atob(factoryID.toString());

    setProfitAndLossDetails({
      ...ProfitAndLossDetails,
      groupID: DecryptedGroupID,
      factoryID: DecryptedFactoryID
    });
  }, []);

I want to add a waiter/timer/delay to wait until the data gets bound to my const variables. (atob is a decrypting function).

The groupID is required to generate the factoryIDs for the specific group, hence during page reload since it takes time / delay for the hooks to bind, the factoryIDs won’t load at times(however when refreshing it appears sometimes), I think adding a delay and giving it time to bind might fix this issue.