Nondeterministic Programming Methodology

    cappys-react-file-upload-progress

    1.1.2 • Public • Published

    react-file-upload-progress

    File upload component for React!

    NPM NPM Downloads

    Example

    Example

    Install

    npm install --save react-file-upload-progress

    Usage

    import React, { useEffect, useState } from 'react'
     
    import { UploadProgress } from 'react-file-upload-progress'
    import 'react-file-upload-progress/dist/index.css'
     
    const App = () => {
      const [item1Completed, setItem1Completed] = useState(0)
      const [item1Seconds, setItem1Seconds] = useState(100)
      const [item2Completed, setItem2Completed] = useState(0)
      const [item2Seconds, setItem2Seconds] = useState(100)
     
      useEffect(() => {
        if (item1Completed < 100) {
          setTimeout(() => {
            setItem1Completed(item1Completed + 10)
          }, 1000)
        }
        if (item1Seconds > 0) {
          setTimeout(() => {
            setItem1Seconds(item1Seconds - 10)
          }, 1000)
        }
        if (item1Completed < 100) {
          setTimeout(() => {
            setItem2Completed(item2Completed + 10)
          }, 1000)
        }
        if (item1Seconds > 0) {
          setTimeout(() => {
            setItem2Seconds(item2Seconds - 10)
          }, 1000)
        }
      })
     
      const items = [
        {
          id: 1,
          fileName: 'this_is_some_file.jpg',
          size: '1234567',
          completedPercentage: item1Completed,
          secLeft: item1Seconds
        },
        {
          id: 2,
          fileName: 'this_is_another_file.jpg',
          size: '7654321',
          completedPercentage: item2Completed,
          secLeft: item2Seconds
        }
      ]
      return <UploadProgress items={items} />
    }
     
    export default App

    Roadmap

    • Add completed event
    • Make transitions smoother
    • Write unit test
    • Add coverage

    License

    MIT © cappydh

    Keywords

    none

    Install

    npm i cappys-react-file-upload-progress

    DownloadsWeekly Downloads

    0

    Version

    1.1.2

    License

    MIT

    Unpacked Size

    31.3 kB

    Total Files

    7

    Last publish

    Collaborators

    • cappydh