useDerivedState.ts

import { type SetStateAction, type Dispatch, useEffect, useRef, useState, useMemo } from 'react';

export function useDerivedState<T>(prop: T): [T, Dispatch<SetStateAction<T>>] {
  const [internalVal, setInternalVal] = useState<T>(prop);
  const previousProp = useRef<any>(null);

  useEffect(() => {
    if (previousProp.current !== prop) {
      previousProp.current = prop;
      setInternalVal(prop);
    }
  }, [prop]);

  const result = useMemo<[T, Dispatch<SetStateAction<T>>]>(() => ([internalVal, setInternalVal]), [internalVal]);

  return result;
}