score:1

Accepted answer

progressvalue will be redeclared 0 each render cycle. just enqueue state updates to the progress state.

export const search = (props) => {
  const { contacts, setcontacts, onsearchcomplete } = props;

  const [msgbox, setmsgbox] = usestate(null);
  const [loading, setloading] = usestate(false);
  const [progress, setprogress] = usestate(10);

  const onsearch = async () => {
    setloading(true);
    setprogress(30);

    try {
      const searchresults = await appapi.searchmany(emails);
      setprogress(80);

      let userlist = [];
      for (let i = 0; i < searchresults.length; i++) {
        //processing the result here. 
        userlist = [...userlist, ..._users];
      }
      setprogress(95);
      userlist.sort(sortbyemail);

      onsearchcomplete(userlist);
    } catch (err) {
      console.log({ err });
      setmsgbox({ message: `${err.message}`, type: 'error' });
    }

    setloading(false);
  }

  useeffect(() => {
    onsearch();
  }, []);

  return (...);
}

edit react-hook-not-updating-after-the-api-call


Related Query

More Query from same tag