useContinuousRetry
Automates retries of a callback function until it succeeds with useContinuousRetry
Install:
Note: This hook depends on React’s experimental useEffectEvent.
npm i @uidotdev/usehooks@experimental react@experimental react-dom@experimental
Description:
The useContinuousRetry hook allows you to repeatedly call a specified callback function at a defined interval until the callback returns a truthy value, indicating a successful resolution. This hook is particularly handy when dealing with asynchronous operations or API calls that may fail temporarily and need to be retried automatically. It encapsulates the logic of retrying and provides a clean interface to handle retry-related states, such as whether the retry process has resolved or not.
Parameters
Name | Type | Description |
---|---|---|
callback | function | The callback function to be executed repeatedly until it returns a truthy value. |
interval | number | (Optional) The interval in milliseconds at which the callback function is executed. Default value is 100 milliseconds. |
Return Value
Type | Description |
---|---|
boolean | true if the callback function has resolved (returned a truthy value), false otherwise. |
Demo:
Example:
import * as React from "react";
import { useContinuousRetry } from "@uidotdev/usehooks";
export default function App() {
const [count, setCount] = React.useState(0);
const hasResolved = useContinuousRetry(() => {
console.log("retrying");
return count > 10;
}, 1000);
return (
<section>
<h1>useContinuousRetry</h1>
<button className="primary" onClick={() => setCount(count + 1)}>
{count}
</button>
<pre>{JSON.stringify({ hasResolved, count }, null, 2)}</pre>
</section>
);
}