Quando usare gli effetti collaterali in React

// File: src/hooks/useQuery.js

import { useEffect } from "react";
import { useCommand } from "./useCommand";

export function useQuery({ path, initialData }) {
  const [networkRequest, sendNetworkRequest] = useCommand({
    path,
    method: "GET",
  });

  useEffect(() => {
    if (networkRequest.isIdle()) {
      sendNetworkRequest(initialData);
    }
  }, [networkRequest, sendNetworkRequest, initialData]);

  return [networkRequest, sendNetworkRequest];
}
// File: src/hooks/useQueryState.js

import { useEffect, useState } from "react";
import { NetworkRequest } from "./NetworkRequest";
import { sendNetworkRequest } from "../mock/sendNetworkRequest";

export function useQueryState({ path, initialData }) {
  const [queryState, setQueryState] = useState(NetworkRequest.create());

  // FIXME:
  // eslint-disable-next-line react-hooks/exhaustive-deps
  const sendQuery = (data) => {
    setQueryState((state) => {
      return state.load();
    });

    sendNetworkRequest({ path, method: "GET", data }).then(
      (response) => {
        setQueryState((state) => {
          return state.succeed(response);
        });
      },
      (error) => {
        setQueryState((state) => {
          return state.fail(error);
        });
      }
    );
  };

  const setNetworkState = (setStateAction) => {
    setQueryState((state) => {
      return state.map((data) => {
        if (typeof setStateAction === "function") {
          return setStateAction(data);
        } else {
          return setStateAction;
        }
      });
    });
  };

  useEffect(() => {
    if (queryState.isIdle()) {
      sendQuery(initialData);
    }
  }, [queryState, sendQuery, initialData]);

  return [queryState, sendQuery, setNetworkState];
}
Notiamo come, in useQueryState, abbiamo aggiunto un commento:
// FIXME:
// eslint-disable-next-line react-hooks/exhaustive-deps