Skip to content

Add hook useFIleDownload #357

@clockwo

Description

@clockwo

useFileDownload

Hook to download files by URL with progress tracking and flexible control.

What it should do

  • Accept a URL for downloading a file.
  • Accept an optional file name.
    If not provided, the hook should extract and use the file name from the downloaded file.
  • Perform the HTTP request with progress tracking:
    • Track and return progress (0–100).
    • Track and return isLoading (boolean).
    • Track and return status ('success' | 'error').
  • Allow optional callbacks:
    • onSuccess – called when the download completes successfully.
    • onError – called when the download fails.
    • onSettled – called after either success or failure.
  • Trigger a browser download automatically once the file is fully downloaded.
  • Handle large files efficiently using fetch with streams or XMLHttpRequest for progress.
  • Automatically revoke object URLs to avoid memory leaks.

Example from npm

Link: https://www.npmjs.com/package/react-use-downloader

Example usage

const {
    downloadFile,
    progress,
    isLoading,
    status,
} = useFileDownload({
    url: 'https://example.com/file.pdf',
    fileName: 'custom_name.pdf',
    onSuccess: () => console.log('Downloaded successfully'),
    onError: () => console.log('Download failed'),
    onSettled: () => console.log('Download completed'),
});

Metadata

Metadata

Assignees

No one assigned

    Labels

    hookHook task

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions