useQueue
Introduction
This hook controls the dispatcher queues. It uses the Dispatcher
to read
the actual value of the queue, which is based on the queueKey
retrieved from the command passed as the first argument.
A prepared Command
is the minimum requirement for useQueue
.
Initialization
const { requests, stopped, stop, start, pause } = useQueue(getUsers);
How it works?
useQueue
uses the command to read the Dispatcher queue value based on its queueKey
. Events emitted by the
Dispatcher keep this hook up to date. This hook gives you the option to control every single request made in your
application and manipulate whole queues and single requests. It works best with the one-by-one
dispatching mode, when
the queued
option is set to true.
Remember to make sure your command queueKey
is static when you use this hook. Because it auto-generates keys, it may
return wrong values if your command uses params or query params. Providing a custom queueKey
when the command is
created will avoid this problem.
const { requests, stopped, stop, start, pause } = useQueue(getUsers);
requests.forEach((req) => {
req.stopRequest();
req.startRequest();
});
stop();
pause();
start();
Read more about differences between stop
, pause
and start
in the
Dispatcher
doc page.
Options
Configuration options for this hook are provided as the second parameter.
const { ... } = useQueue(command, options)
Returns
Returned values from this hook.
const values = useQueue(command);
{
pause: () => void;
requests: {
commandDump: CommandDump<Command>;
requestId: string;
retries: number;
stopped: boolean;
timestamp: number;
deleteRequest: () => void;
downloading: {
loaded: number;
progress: number;
sizeLeft: number;
startTimestamp: number;
timeLeft: number | null;
total: number;
};
startRequest: () => void;
stopRequest: () => void;
uploading: {
loaded: number;
progress: number;
sizeLeft: number;
startTimestamp: number;
timeLeft: number | null;
total: number;
};
}[];
start: () => void;
stop: () => void;
stopped: boolean;
}
Request interface
{
commandDump: CommandDump<Command>;
requestId: string;
retries: number;
stopped: boolean;
timestamp: number;
deleteRequest: () => void;
downloading: {
loaded: number;
progress: number;
sizeLeft: number;
startTimestamp: number;
timeLeft: number | null;
total: number;
};
startRequest: () => void;
stopRequest: () => void;
uploading: {
loaded: number;
progress: number;
sizeLeft: number;
startTimestamp: number;
timeLeft: number | null;
total: number;
};
}