mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-11-11 18:32:20 +08:00
449e11cdda
Summary: Initial styles on attachments ui More file uploading UI fix race condition in draft saving attachments and uploads interweaved Test Plan: edgehill --test Reviewers: bengotow Reviewed By: bengotow Differential Revision: https://phab.nylas.com/D1610
48 lines
1.5 KiB
CoffeeScript
48 lines
1.5 KiB
CoffeeScript
path = require 'path'
|
|
React = require 'react'
|
|
{RetinaImg} = require 'nylas-component-kit'
|
|
{Utils,
|
|
Actions,
|
|
FileUploadStore} = require 'nylas-exports'
|
|
|
|
class FileUpload extends React.Component
|
|
@displayName: 'FileUpload'
|
|
|
|
render: =>
|
|
<div className={"file-upload attachment-file-wrap " + @props.uploadData.state}>
|
|
<span className="attachment-bar-bg"></span>
|
|
<span className="attachment-upload-progress" style={@_uploadProgressStyle()}></span>
|
|
|
|
<span className="attachment-file-actions">
|
|
<div className="attachment-icon" onClick={@_onClickRemove}>
|
|
<RetinaImg className="remove-icon" name="remove-attachment.png"/>
|
|
</div>
|
|
</span>
|
|
|
|
<span className="attachment-file-and-name">
|
|
<span className="attachment-file-icon">
|
|
<RetinaImg className="file-icon"
|
|
fallback="file-fallback.png"
|
|
name="file-#{@_extension()}.png"/>
|
|
</span>
|
|
<span className="attachment-file-name"><span className="uploading">Uploading:</span> {@_basename()}</span>
|
|
</span>
|
|
|
|
</div>
|
|
|
|
_uploadProgressStyle: =>
|
|
if @props.uploadData.fileSize <= 0
|
|
percent = 0
|
|
else
|
|
percent = (@props.uploadData.bytesUploaded / @props.uploadData.fileSize) * 100
|
|
width: "#{percent}%"
|
|
|
|
_onClickRemove: =>
|
|
Actions.abortUpload @props.uploadData
|
|
|
|
_basename: =>
|
|
path.basename(@props.uploadData.filePath)
|
|
|
|
_extension: -> path.extname(@_basename()).split('.').pop()
|
|
|
|
module.exports = FileUpload
|