react-filesaver

0.1.8 • Public • Published

Purpose

To abstract upload file functionality via React Hooks

Features

Dropzone Wrapper Component

Use this to wrap your custom upload UI component

Handle password protection (for .PDF and .DOCX only at the moment)

Captures errors when uploading password protected files, and prevents file from being uploaded

Installation

To add react-filesaver into existing project, do

yarn add react-filesaver or npm i react-filesaver

Example

To run the example, do the following steps:

git clone https://github.com/PranayPant/react-filesaver.git
cd react-filesaver/examples
yarn install
yarn start

See how to use in existing project below:

import React from "react";
import Dropzone from "./Dropzone"; // custom file upload component
import FileList from "./FileList"; // custom component to display the list of uploaded file e.g. html Table
import useUpload from 'react-filesaver'

export default function App() {

  // Get the Upload Wrapper ocmpoenent to handle the upload for you
  // Get a refernec to the uploaded files and any errors
  const {UploadWrapper, files, errors=[]} = useUpload()

  return (
    <React.Fragment>
      <UploadWrapper>
        <Dropzone />
      </UploadWrapper>
      <FileList files={files} />
      { errors.map((e, i) => <div key={i}>{JSON.stringify(e)}</div>)}
    </React.Fragment>
  );
}

Readme

Keywords

none

Package Sidebar

Install

npm i react-filesaver

Weekly Downloads

87

Version

0.1.8

License

none

Unpacked Size

570 kB

Total Files

27

Last publish

Collaborators

  • pranay.pant