A simple refetch manager for React.
Grexie Refetch allows you to install a refetch manager with an interval wrapped around your root app component. Child components can subscribe to the refetch manager and the subscribe handler will be called on the interval.
yarn add @grexie/refetch
Wrap your root app component with RefetchProvider, passing in an optional interval in milliseconds. If the interval is specified then RefetchController#setInterval
will be called in a useEffect
hook to set up refetch events on the interval.
import { RefetchProvider, useRefetch } from '@grexie/refetch';
const WrappedApp = (
<RefetchProvider interval={15_000}>
<App />
</RefetchProvider>
);
const SubComponent = () => {
...
const refetchController = useRefetch();
useEffect(() => {
return refetchController.subscribe(() => {
... perform refetch ...
});
}, []);
...
};
A composable is provided which can be used with @grexie/compose
:
import { withRefetchProvider } from '@grexie/refetch';
const ComposeApp = compose(withRefetchProvider({ interval: 15_000 }), App);
If you'd prefer to control the interval in a child component of your App then you can do so by calling RefetchController#setInterval
:
const SubComponent = () => {
...
const refetchController = useRefetch();
useEffect(() => {
return refetchController.setInterval(15_000);
}, []);
...
};
Both RefetchController#setInterval
and RefetchController#subscribe
return hook cleanup handlers to return from the hook so that state updates don't happen once the component is unmounted.
RefetchController
is an EventEmitter
, so you can subscribe to events manually by calling refetchController.on('refetch', handler)
and removing an installed handler by doing refetchController.removeListener('refetch', handler)
. This is what RefetchController#subscribe
does internally.