stream-chat-react-native-core/src/hooks/useIsMountedRef.ts

The official React Native and Expo components for Stream Chat, a service for building chat applications

import { useEffect, useRef } from 'react';

/**
 * Returns mount status of component. This hook can be used for purpose of avoiding any
 * setState calls (within async operation) after component gets unmounted.
 *
 * @example
 * ```
 * const isMounted = useIsMountedRef();
 * const [dummyValue, setDummyValue] = useState(false);
 *
 * useEffect(() => {
 *  someAsyncOperation().then(() => {
 *    if (isMounted.current) setDummyValue(true);
 *  })
 * })
 * ```
 *
 * @returns isMounted {Object} Mount status ref for the component.
 */
export const useIsMountedRef = () => {
  // Initial value has been set to true, since this hook exist only for sole purpose of
  // avoiding any setState calls (within async operation) after component gets unmounted.
  // Basically we don't need to know about state change from component being initialized -> mounted.
  // We only need a state change from initialized or mounted state -> unmounted state.
  const isMounted = useRef(true);

  useEffect(
    () => () => {
      isMounted.current = false;
    },
    [],
  );

  return isMounted;
};