Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA declarative setInterval: pass a delay to run a callback repeatedly, or null to pause, and the callback always sees the newest props and state.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it for polling, clocks, carousels and any repeating task. Pausing is a delay of null, so the interval can follow a boolean.
Do not use it for animation frames (use useAnimationFrame) or for a countdown that must not drift (use useCountdown).
import { useInterval } from "@/hooks/use-interval"useInterval(() => refetch(), isVisible ? 5000 : null)useInterval(callback: () => void, delay: number | null, options?): void
| Name | Type | Description |
|---|---|---|
callback | () => void | Called on every tick. The newest version is used. |
delay | number | null | Milliseconds between ticks. null (or a negative number) pauses. |
immediate | boolean | Option. Also call once right when the interval starts. Default false. |
Changing delay restarts the interval. It is cleared on unmount, and nothing runs on the server.
A hook has no markup. Do not auto-update content that people are reading faster than they can follow: offer a pause control for anything that moves or refreshes by itself (WCAG 2.2.2).
The hook ships with renderHook tests (use-interval.test.ts) covering its behaviour, cleanup on unmount and server-safe defaults. It is safe to render on the server.