This package exposes useful hooks for the @rpldy/retry package which adds upload retry capabilities to the uploader.
It makes it easy to use retry from a React UI application.
The best place to get started is at our: React-Uploady Documentation Website
#Yarn:
$ yarn add @rpldy/uploady @rpldy/retry-hooks
#NPM:
$ npm i @rpldy/uploady @rpldy/retry-hooks
To enable retries for your Uploady instance, you need to use the provided (uploader enhancer): retryEnhancer
.
import Uploady from "@rpldy/uploady";
import retryEnhancer from "@rpldy/retry-hooks";
import UploadButton from "@rpldy/upload-button";
const App = () => {
return <Uploady
destination={{ url: "my-server.com/upload" }}
enhancer={retryEnhancer}
>
<UploadButton/>
</Uploady>;
};
This will add the retry capability for failed uploads.
See below how to use hooks in order to trigger a retry
Retry related events.
Registering to handle events can be done using the uploader's on() and once() methods. Unregistering can be done using off() or by the return value of both on() and once().
Triggered when files are re-added to the queue for retry.
- Parameters: ({ uploads: BatchItem[], options?: UploadOptions })
uploads is an array of batch items. options are the (optional) upload options that are passed to the retry call
Returns a retry function.
When called without a parameter, will attempt retry all failed uploads. When called with a (id) parameter, will attempt retry for the failed batch-item identified by the id.
import React from "react";
import { useRetry } from "@rpldy/retry-hooks";
const MyComponent = ( ) => {
const retry = useRetry();
const onClick = () => {
retry("i-123");
};
return <button onClick={onClick}>retry item</button>;
};
Returns a batch retry function.
When called with a batch id, will attempt retry for all failed items in that batch.
import React from "react";
import { useBatchRetry } from "@rpldy/retry-hooks";
const MyComponent = ( ) => {
const retryBatch = useBatchRetry();
const onClick = () => {
retryBatch("b-123");
};
return <button onClick={onClick}>retry batch</button>;
};
Called when items are sent to be re-uploaded (retry)
see RETRY_EVENT
import React from "react";
import { useRetryListener } from "@rpldy/retry-hooks";
const MyComponent = ( ) => {
useRetryListener(({ items }) => {
console.log("##### RETRY EVENT - retrying items: ", items);
});
return <div/>;
};