Mailspring/internal_packages/attachments/lib/image-attachment-component.cjsx
Ben Gotow 19d97e5393 fix(*): Throttle so that DatabaseView won't pile on queries during scroll, better small attachment styles
Summary:
fix(attachment): Bad filenames breaking icons

fix developer bar colors

fix critical bug with files

Render small attachments inline-block, without hover effect, and with nice dotted transparency background

Test Plan: No new tests

Reviewers: evan

Reviewed By: evan

Differential Revision: https://phab.nylas.com/D1661
2015-06-19 11:31:27 -07:00

48 lines
1.5 KiB
CoffeeScript

path = require 'path'
React = require 'react'
AttachmentComponent = require './attachment-component'
{RetinaImg, Spinner, DraggableImg} = require 'nylas-component-kit'
class ImageAttachmentComponent extends AttachmentComponent
@displayName: 'ImageAttachmentComponent'
render: =>
<div className={"attachment-inner-wrap " + @props.download?.state ? ""}>
<span className="attachment-download-bar-wrap">
<span className="attachment-bar-bg"></span>
<span className="attachment-download-progress" style={@_downloadProgressStyle()}></span>
</span>
<div className="attachment-file-actions">
{@_renderFileActions()}
</div>
<div className="attachment-preview" onClick={@_onClickView}>
<div className="attachment-name-container">
<div className="attachment-name">{@props.file.filename}</div>
</div>
{@_imgOrLoader()}
</div>
</div>
_canAbortDownload: -> false
_renderRemoveIcon: ->
<RetinaImg className="image-remove-icon" name="image-cancel-button.png"/>
_renderDownloadButton: ->
<RetinaImg className="image-download-icon" name="image-download-button.png"/>
_imgOrLoader: ->
if @props.download
if @props.download.percent <= 5
<div style={width: "100%", height: "100px"}>
<Spinner visible={true} />
</div>
else
<DraggableImg src={"#{@props.targetPath}?percent=#{@props.download.percent}"} />
else
<DraggableImg src={@props.targetPath} />
module.exports = ImageAttachmentComponent