Reusables

Installation

npx shadcn@latest add "https://reusables.vercel.app/r/use-file-upload"

Usage

import { useFileUpload } from "@/hooks/useFileUpload"

For a complete implementation example, check out the Single Image Upload component.

const { handleFileUpload, cancelUpload, isUploading, progress, error, data } =
  useFileUpload({
    onSuccess: (url) => console.log("Uploaded:", url),
    onError: (error) => console.log("Error:", error),
  })

Reference

Options

Prop	Type	Default
`onSuccess`	`(url: string) => void`	-
`onError`	`(error: string) => void`	-

Return Values

Prop	Type	Default
`data`	`string`	-
`selectedFile`	`File \| null`	-
`isUploading`	`boolean`	-
`progress`	`number`	-
`error`	`string \| null`	-
`handleFileUpload`	`(file: File) => Promise<void>`	-
`cancelUpload`	`() => void`	-

Use File Upload

Installation

Usage

Reference

On this page