@navikt/ds-react/src/util/hooks/useLatestRef.ts

React components from the Norwegian Labour and Welfare Administration.

"use client";

import { useClientLayoutEffect } from "./useClientLayoutEffect";
import { useRefWithInit } from "./useRefWithInit";

export function useLatestRef<T>(value: T) {
  const latest = useRefWithInit(createLatestRef, value).current!;

  latest.next = value;

  // eslint-disable-next-line react-hooks/exhaustive-deps
  useClientLayoutEffect(latest.effect);

  return latest;
}

function createLatestRef<T>(value: T) {
  const latest = {
    current: value,
    next: value,
    effect: () => {
      latest.current = latest.next;
    },
  };
  return latest;
}