useFileUploadItem()

Use the hook useFileUploadItem to control the file upload of a file in a multiple file upload.

It has the same signature as useFileUpload.

const Item = ({ itemRef }) => {
  const { name, progress } = useFileUploadItem(itemRef)
  return (
    <li>
      {name} {progress}
    </li>
  )
}

const List = () => {
  const { list } = useMultipleFilesUpload()
  return (
    <ul>
      {list.map((itemRef) => (
        <Item key={item.id} itemRef={item} />
      ))}
    </ul>
  )
}

​

Parameters

ref required ActorRefWithDeprecatedState<FileUploadContext, { type: “ADD”, file: File, id: string, bucketId: string, name: string } | { type: “UPLOAD”, file: File, id: string, name: string, bucketId: string } & FileUploadConfig | { type: “UPLOAD_PROGRESS”, progress: number, loaded: number, additions: number } | { type: “UPLOAD_DONE”, id: string, bucketId: string } | { type: “UPLOAD_ERROR”, error: StorageErrorPayload } | { type: “CANCEL” } | { type: “DESTROY” }, { value: any, context: FileUploadContext }, ResolveTypegenMeta<Typegen0, { type: “ADD”, file: File, id: string, bucketId: string, name: string } | { type: “UPLOAD”, file: File, id: string, name: string, bucketId: string } & FileUploadConfig | { type: “UPLOAD_PROGRESS”, progress: number, loaded: number, additions: number } | { type: “UPLOAD_DONE”, id: string, bucketId: string } | { type: “UPLOAD_ERROR”, error: StorageErrorPayload } | { type: “CANCEL” } | { type: “DESTROY” }, BaseActionObject, ServiceMap>> | Interpreter<FileUploadContext, any, { type: “ADD”, file: File, id: string, bucketId: string, name: string } | { type: “UPLOAD”, file: File, id: string, name: string, bucketId: string } & FileUploadConfig | { type: “UPLOAD_PROGRESS”, progress: number, loaded: number, additions: number } | { type: “UPLOAD_DONE”, id: string, bucketId: string } | { type: “UPLOAD_ERROR”, error: StorageErrorPayload } | { type: “CANCEL” } | { type: “DESTROY” }, { value: any, context: FileUploadContext }, ResolveTypegenMeta<Typegen0, { type: “ADD”, file: File, id: string, bucketId: string, name: string } | { type: “UPLOAD”, file: File, id: string, name: string, bucketId: string } & FileUploadConfig | { type: “UPLOAD_PROGRESS”, progress: number, loaded: number, additions: number } | { type: “UPLOAD_DONE”, id: string, bucketId: string } | { type: “UPLOAD_ERROR”, error: StorageErrorPayload } | { type: “CANCEL” } | { type: “DESTROY” }, BaseActionObject, ServiceMap>>