useImmediateEffect.ts

import { DependencyList, EffectCallback, useRef } from 'react';
import { useOnComponentUnmount } from './useOnComponentUnmount';

const arrayMatch = (arr1?: DependencyList, arr2?: DependencyList) => {
  if (!arr1 || !arr2) return false;
  if (arr1.length !== arr2.length) return false;
  return arr1.every((_, i) => arr1[i] === arr2[i]);
};

export const useImmediateEffect = (effect: EffectCallback, deps?: DependencyList) => {
  const cleanRef = useRef<() => void>(() => {});
  const depsRef = useRef<DependencyList>();

  if (!depsRef.current || !arrayMatch(depsRef.current, deps)) {
    depsRef.current = deps;
    cleanRef.current();
    cleanRef.current = effect() || (() => {});
  }

  useOnComponentUnmount(() => cleanRef.current());
};