It is showing you the warning because you are using sendFile() method and you didn't add it to the dependency array. So you have two options.

1.) Add it to the dependency array

 useEffect(() => {
    if (!preview) {
      return;
    }
    setIsloading(true);
    sendFile();
  }, [preview, sendFile]);

2.) use eslint-disable-next-line By using this, It won't show the warning anymore.

  useEffect(() => {
    if (!preview) {
      return;
    }
    setIsloading(true);
    sendFile();
    //eslint-disable-next-line
  }, [preview]);

If you want the effect to run only when preview changes then it is technically correct to specify just preview to dependency array. But, the React-hooks linting rules aren't able to differentiate this case. You can disable the rule specifically for that line with:

// eslint-disable-next-line react-hooks/exhaustive-deps

but better is using useCallback:

const sendFile= useCallback(() => {
  
}, [])

here, if you have dependencies in your function, you will have to include them in the useCallback dependencies array and this will trigger the useEffect again if the functions parameters changes.

  useEffect(() => {
    if (!preview) {
      return;
    }
    setIsloading(true);
    sendFile();
  }, `[preview, setIsloading, sendFile]`);

You forgot to include functions that are used in the useEffect hook have to be in the dependency array since they are used from outside the hook. setState functions don't change reference over time so it won't change the behavior of the useEffect hook