Merge pull request #3 from appirio-tech/disable-delete

Add disable option for deleting uploaded files

Author: samsep

components/FileUploader/FileUploader.cjsx

@@ -18,7 +18,7 @@ FileUploader = ({ multiple, onChange, loading, dragAndDrop, disableClick }) ->
       if loading
         <Loader />
     }
-    <UploadedFilesContainer/>
+    <UploadedFilesContainer disabled={disableClick} />
 
     <div className={ dzContainerClassNames }>
       <Dropzone multiple={multiple} onDrop={onChange} className="Dropzone" disableClick={disableClick}>

components/UploadedFile/UploadedFile.cjsx

@@ -5,7 +5,7 @@ require './UploadedFileStyles'
 React      = require 'react'
 classnames = require 'classnames'
 
-UploadedFile = ({ status, preview, progress, fileName, enableCaptions, captions, onDelete }) ->
+UploadedFile = ({ status, preview, progress, fileName, enableCaptions, captions, onDelete, disabled }) ->
   <div className="UploadedFile">
     <main className="flex column middle center" >
       {
@@ -37,9 +37,14 @@ UploadedFile = ({ status, preview, progress, fileName, enableCaptions, captions,
       <p className="file-name">{ fileName }</p>
       {
         unless status == 'uploading'
-          <button className="clean" type="button" onClick={onDelete}>
-            <div className="icon cross"/>
-          </button>
+          if disabled
+            <button className="clean" type="button" disabled>
+              <div className="icon cross"/>
+            </button>
+          else
+            <button className="clean" type="button" onClick={onDelete}>
+              <div className="icon cross"/>
+            </button>
       }
     </div>
 

components/UploadedFiles/UploadedFiles.cjsx

@@ -5,7 +5,7 @@ require './UploadedFilesStyles'
 React        = require 'react'
 UploadedFile = require '../UploadedFile/UploadedFile'
 
-UploadedFiles = ({ files, onDelete, enableCaptions }) ->
+UploadedFiles = ({ files, onDelete, enableCaptions, disabled }) ->
   <ul className="UploadedFiles flex wrap">
     {
       files?.map (file, i) ->
@@ -27,6 +27,7 @@ UploadedFiles = ({ files, onDelete, enableCaptions }) ->
             enableCaptions={enableCaptions}
             captions={captions}
             onDelete={onDeleteProxy}
+            disabled={disabled}
           />
         </li>
     }

components/UploadedFiles/UploadedFilesContainer.cjsx

@@ -35,6 +35,7 @@ container =
     dispatch      : PropTypes.func.isRequired
     files         : PropTypes.array.isRequired
     enableCaptions: PropTypes.bool
+    disabled      : PropTypes.bool
 
   onDelete: (file) ->
     this.props.dispatch deleteAttachment file
@@ -45,12 +46,13 @@ container =
     dispatch getAttachments { id, assetType, category }
 
   render: ->
-    { files, enableCaptions } = this.props
+    { files, enableCaptions, disabled } = this.props
 
     createElement UploadedFiles,
       files         : files
       onDelete      : this.onDelete
       enableCaptions: enableCaptions
+      disabled      : disabled
 
 module.exports = connect(mapStateToProps)(createClass(container))