useFreshCallback

import { useState } from "react";
import { useFreshCallback } from "rooks";

export default function App() {
  const [count, setCount] = useState(0);
  const logLatestCount = useFreshCallback(() => {
    console.log(`Latest count: ${count}`);
  });

  return (
    <div>
      <button onClick={() => setCount((current) => current + 1)}>
        Increment
      </button>
      <button onClick={logLatestCount}>Log latest count</button>
    </div>
  );
}

import { useEffect } from "react";
import { useFreshCallback } from "rooks";

function ResizeLogger({ label }: { label: string }) {
  const handleResize = useFreshCallback(() => {
    console.log(`${label}: ${window.innerWidth}`);
  });

  useEffect(() => {
    window.addEventListener("resize", handleResize);
    return () => window.removeEventListener("resize", handleResize);
  }, [handleResize]);

  return null;
}