score:2

You can wrap the setError function with useCallback with an empty dependency in your custom hook before returning so that it is created only once

export const useError = (): ((error: any, title?: string) => void) => {
  const dispatch = useDispatch();
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  const setError = useCallback((error: any, title = 'Error'): void => {
    Sentry.captureException(error);
    const bodyText = error.message || error;
    const errorTitle = error.name || title;
    dispatch(
      setNotification({
        type: notificationTypes.prompt,
        title: errorTitle,
        bodyText,
        className: 'error',
        show: true,
      })
    );
  }, []);

  return setError;
};

With the above you might get a ESLint warning to add dispatch and Sentry as dependency to useCallback dependency array, you can add them to the dependency array since neither of disptach or Sentry would change


Related Query

More Query from same tag