diff --git a/app/javascript/chat/chat.jsx b/app/javascript/chat/chat.jsx index 1d9e6c388..7dc8db7b0 100644 --- a/app/javascript/chat/chat.jsx +++ b/app/javascript/chat/chat.jsx @@ -1429,7 +1429,6 @@ export default class Chat extends Component { handleImageDrop = (event) => { event.preventDefault(); const { files } = event.dataTransfer; - event.currentTarget.classList.remove('opacity-25'); processImageUpload(files, this.handleImageSuccess, this.handleImageFailure); }; @@ -1522,6 +1521,7 @@ export default class Chat extends Component { markdownEdited={state.markdownEdited} editMessageMarkdown={state.activeEditMessage.markdown} handleEditMessageClose={this.handleEditMessageClose} + handleFilePaste={this.handleFilePaste} /> @@ -1540,6 +1540,28 @@ export default class Chat extends Component { ); }; + handleFilePaste = (e) => { + e.preventDefault(); + if (!e.clipboardData || !e.clipboardData.items) { + return; + } + const items = []; + for (let i = 0; i < e.clipboardData.items.length; i++) { + const item = e.clipboardData.items[i]; + if (item.kind !== 'file') { + continue; + } + items.push(item); + } + if (items && items.length > 0) { + processImageUpload( + [items[0].getAsFile()], + this.handleImageSuccess, + this.handleImageFailure, + ); + } + }; + onTriggerVideoContent = (e) => { if (e.target.dataset.content === 'exit') { this.setState({ diff --git a/app/javascript/chat/compose.jsx b/app/javascript/chat/compose.jsx index 305979b08..3bb17bef1 100644 --- a/app/javascript/chat/compose.jsx +++ b/app/javascript/chat/compose.jsx @@ -14,6 +14,7 @@ export default class Chat extends Component { markdownEdited: PropTypes.bool.isRequired, editMessageMarkdown: PropTypes.string.isRequired, handleEditMessageClose: PropTypes.func.isRequired, + handleFilePaste: PropTypes.func.isRequired, }; constructor(props) { @@ -39,6 +40,7 @@ export default class Chat extends Component { handleEditMessageClose, handleMention, handleKeyUp, + handleFilePaste, } = this.props; return ( @@ -50,6 +52,7 @@ export default class Chat extends Component { onKeyDown={handleKeyDownEdit} onKeyPress={handleMention} onKeyUp={handleKeyUp} + onPaste={handleFilePaste} maxLength="1000" aria-label="Let's connect" /> @@ -83,6 +86,7 @@ export default class Chat extends Component { handleKeyDown, handleMention, handleKeyUp, + handleFilePaste, } = this.props; const handleInput = (e) => { @@ -108,6 +112,7 @@ export default class Chat extends Component { onKeyDown={handleKeyDown} onKeyPress={handleMention} onKeyUp={handleKeyUp} + onPaste={handleFilePaste} maxLength="1000" value={this.state.value} onInput={handleInput}