FileUploaderScreen.js

import React from 'react'
import idleSrc from './images/jade_input_bg.jpg'
import pendingSrc from './images/art-arts-and-crafts-bright-1124884.jpg'
import uploadedSrc from './images/adventure-background-blur-891252.jpg'
import errorSrc from './images/121911.jpg'

const FileUploaderScreen = ({ status }) => {
  let src
  switch (status) {
    case 'IDLE':
      src = idleSrc
      break
    case 'LOADED':
    case 'PENDING':
      src = pendingSrc
      break
    case 'FILES_UPLOADED':
      src = uploadedSrc
      break
    case 'UPLOAD_ERROR':
      src = errorSrc
      break
    default:
      src = idleSrc
      break
  }
return (
    <div className="uploader-input">
      <div
        style={{ backgroundImage: `url("${src}")` }}
        className="uploader-overlay"
      />
    </div>
  )
}

export default FileUploaderScreen