diff --git a/internal_packages/composer/lib/composer-view.jsx b/internal_packages/composer/lib/composer-view.jsx index 322b06d5b..f5259ef9e 100644 --- a/internal_packages/composer/lib/composer-view.jsx +++ b/internal_packages/composer/lib/composer-view.jsx @@ -518,21 +518,25 @@ export default class ComposerView extends React.Component { } _onFileReceived = (filePath) => { + // called from onDrop and onPaste - assume images should be inline Actions.addAttachment({ filePath: filePath, messageClientId: this.props.draft.clientId, - callback: (upload) => { + onUploadCreated: (upload) => { if (Utils.shouldDisplayAsImage(upload)) { const {draft, session} = this.props; const uploads = [].concat(draft.uploads); - uploads.find(u => u.id === upload.id).inline = true; - session.changes.add({uploads}) + const matchingUpload = uploads.find(u => u.id === upload.id); + if (matchingUpload) { + matchingUpload.inline = true; + session.changes.add({uploads}) - Actions.insertAttachmentIntoDraft({ - draftClientId: draft.clientId, - uploadId: upload.id, - }) + Actions.insertAttachmentIntoDraft({ + draftClientId: draft.clientId, + uploadId: matchingUpload.id, + }); + } } }, }); diff --git a/internal_packages/composer/lib/image-upload-composer-extension.es6 b/internal_packages/composer/lib/image-upload-composer-extension.es6 index 139a359e3..a3179ae07 100644 --- a/internal_packages/composer/lib/image-upload-composer-extension.es6 +++ b/internal_packages/composer/lib/image-upload-composer-extension.es6 @@ -3,14 +3,8 @@ import { ComposerExtension, } from 'nylas-exports' -/** - * Inserts the set of Proposed Times into the body of the HTML email. - * - */ export default class ImageUploadComposerExtension extends ComposerExtension { - static TAG_NAME = "inline-image"; - static editingActions() { return [{ action: Actions.insertAttachmentIntoDraft, @@ -32,17 +26,9 @@ export default class ImageUploadComposerExtension extends ComposerExtension { static _onInsertAttachmentIntoDraft({editor, actionArg}) { if (editor.draftClientId === actionArg.draftClientId) { return } - editor.insertCustomComponent("ImageUploadInlineContainer", { + editor.insertCustomComponent("InlineImageUploadContainer", { className: `inline-container-${actionArg.uploadId}`, uploadId: actionArg.uploadId, }) } - - static applyTransformsToDraft({draft}) { - return draft; - } - - static unapplyTransformsToDraft({draft}) { - return draft - } } diff --git a/internal_packages/composer/lib/image-upload.jsx b/internal_packages/composer/lib/image-upload.jsx index a821543b7..67303de43 100644 --- a/internal_packages/composer/lib/image-upload.jsx +++ b/internal_packages/composer/lib/image-upload.jsx @@ -15,9 +15,10 @@ export default class ImageUpload extends FileUpload { } _onLoaded = () => { - // on load, modify our DOM just /slightly/. This gives DOM mutation listeners - // that might be watching us (for ex: when we're in an overlaid component) - // a chance to recompute the image size. + // on load, modify our DOM just /slightly/. This causes DOM mutation listeners + // watching the DOM to trigger. This is a good thing, because the image may + // change dimensions. (We use this to reflow the draft body when this component + // is within an OverlaidComponent) const el = ReactDOM.findDOMNode(this); if (el) { el.classList.add('loaded'); diff --git a/internal_packages/composer/lib/image-upload-inline-container.jsx b/internal_packages/composer/lib/inline-image-upload-container.jsx similarity index 94% rename from internal_packages/composer/lib/image-upload-inline-container.jsx rename to internal_packages/composer/lib/inline-image-upload-container.jsx index 0ab1f3ea1..e58d8e405 100644 --- a/internal_packages/composer/lib/image-upload-inline-container.jsx +++ b/internal_packages/composer/lib/inline-image-upload-container.jsx @@ -3,14 +3,13 @@ import ReactDOM from 'react-dom'; import ImageUpload from './image-upload'; import fs from 'fs'; -export default class ImageUploadInlineContainer extends Component { - static displayName = 'ImageUploadInlineContainer'; +export default class InlineImageUploadContainer extends Component { + static displayName = 'InlineImageUploadContainer'; static propTypes = { draft: PropTypes.object.isRequired, session: PropTypes.object.isRequired, uploadId: PropTypes.string.isRequired, - style: PropTypes.object, isPreview: PropTypes.bool, } @@ -123,8 +122,7 @@ export default class ImageUploadInlineContainer extends Component { return (
diff --git a/internal_packages/composer/lib/main.es6 b/internal_packages/composer/lib/main.es6 index f1470b121..72b2f8f0d 100644 --- a/internal_packages/composer/lib/main.es6 +++ b/internal_packages/composer/lib/main.es6 @@ -19,7 +19,7 @@ import {OverlaidComposerExtension} from 'nylas-component-kit' import ComposeButton from './compose-button'; import ComposerView from './composer-view'; import ImageUploadComposerExtension from './image-upload-composer-extension'; -import ImageUploadInlineContainer from "./image-upload-inline-container"; +import InlineImageUploadContainer from "./inline-image-upload-container"; const ComposerViewForDraftClientId = InflatesDraftClientId(ComposerView); @@ -123,7 +123,7 @@ export function activate() { } ExtensionRegistry.Composer.register(ImageUploadComposerExtension); - CustomContenteditableComponents.register("ImageUploadInlineContainer", ImageUploadInlineContainer); + CustomContenteditableComponents.register("InlineImageUploadContainer", InlineImageUploadContainer); } export function deactivate() { @@ -135,7 +135,7 @@ export function deactivate() { } ExtensionRegistry.Composer.unregister(OverlaidComposerExtension) ExtensionRegistry.Composer.unregister(ImageUploadComposerExtension); - CustomContenteditableComponents.unregister("ImageUploadInlineContainer"); + CustomContenteditableComponents.unregister("InlineImageUploadContainer"); } export function serialize() { diff --git a/internal_packages/composer/stylesheets/composer.less b/internal_packages/composer/stylesheets/composer.less index 919e48e21..cae1c8b84 100644 --- a/internal_packages/composer/stylesheets/composer.less +++ b/internal_packages/composer/stylesheets/composer.less @@ -59,7 +59,7 @@ body.platform-win32 { } } - .image-upload-inline-container { + .inline-image-upload-container { display: inline-block; .file-wrap.file-image-wrap { diff --git a/src/flux/stores/draft-store.coffee b/src/flux/stores/draft-store.coffee index 10d653f09..f9f9bb5db 100644 --- a/src/flux/stores/draft-store.coffee +++ b/src/flux/stores/draft-store.coffee @@ -323,7 +323,7 @@ class DraftStore Actions.addAttachment({ filePath: path, messageClientId: draftClientId, - callback: callback + onUploadCreated: callback }) _onDestroyDraft: (draftClientId) => diff --git a/src/flux/stores/file-upload-store.coffee b/src/flux/stores/file-upload-store.coffee index ef0312667..d078e6205 100644 --- a/src/flux/stores/file-upload-store.coffee +++ b/src/flux/stores/file-upload-store.coffee @@ -63,8 +63,8 @@ class FileUploadStore extends NylasStore pathsToOpen.forEach (filePath) -> Actions.addAttachment({messageClientId, filePath}) - _onAddAttachment: ({messageClientId, filePath, callback, inline}) -> - callback ?= -> + _onAddAttachment: ({messageClientId, filePath, onUploadCreated, inline}) -> + onUploadCreated ?= -> inline ?= false @_assertIdPresent(messageClientId) @@ -81,9 +81,9 @@ class FileUploadStore extends NylasStore .then(@_prepareTargetDir) .then(@_copyUpload) .then (upload) => - @_applySessionChanges upload.messageClientId, (uploads) -> + return @_applySessionChanges upload.messageClientId, (uploads) -> uploads.concat([upload]) - .then( => callback(upload)) + .then( => onUploadCreated(upload)) .catch(@_onAttachFileError) _onRemoveAttachment: (upload) ->