Sniberb•2y ago

🎃 Spookyberb 🎃 – 15-58 Nov 10

Im using the AbortController API whenever the input value changes. My problem is that the isLoading state automatically gets to false everytime it aborts a request, ignoring the last one (which doesnt get aborted) and setting isLoading to false even tho the last request is still pending. Why?

useEffect(() => {
    const controller = new AbortController();

    if (watchedSearch.length > 3 && !cancelSearch) {
      (async () => {
        try {
          setIsLoading(true);
          const response = await getAllClients(controller.signal);

        } catch (e) {
          if (e?.name !== 'AbortError') {
            console.error('Could not retrieve holders', e);
          }
        } finally {
          setIsLoading(false);
        }
      })();
    }
    return () => controller.abort();
  }, [watchedSearch]);

useEffect(() => {
    const controller = new AbortController();

    if (watchedSearch.length > 3 && !cancelSearch) {
      (async () => {
        try {
          setIsLoading(true);
          const response = await getAllClients(controller.signal);

        } catch (e) {
          if (e?.name !== 'AbortError') {
            console.error('Could not retrieve holders', e);
          }
        } finally {
          setIsLoading(false);
        }
      })();
    }
    return () => controller.abort();
  }, [watchedSearch]);

3 Replies

Sniberb•2y ago

Why is it getting inside the finally even tho the last request has not completed?

ScriptyChris•2y ago

Does watchedSearch variable change while request is being awaited? Have you checked how many times that async IIFE gets executed? If you want to handle aborting multiple requests then i think a good options is to have a map of abort controllers, so you can use them individually per request Other way would be to have a queue of requests, where a currently operated one would be assigned with a single controller, which would be reset when request is done and then subsequent request from such queue would be handled with a new abort controller

reactibot•2y ago

This thread hasn’t had any activity in 12 hours, so it’s now locked. Threads are closed automatically after 12 hours. If you have a followup question, you may want to reply to this thread so other members know they're related. https://discord.com/channels/102860784329052160/565213527673929729/1040294341656182874