import React from 'react'; import PropTypes from 'prop-types'; import { MessageType } from './Types'; import Icon from './Icon'; import Button from './Button'; export default class MessageInput extends React.Component { constructor(props) { super(props); this.textarea = React.createRef(); this.fileinput = React.createRef(); this.state = { isActive: false, mid: this.props.data.mid, rid: this.props.data.rid || 0, to: this.props.data.to || {}, body: this.props.text || '', attach: '' } } handleCtrlEnter = (event) => { if (event.ctrlKey && (event.charCode == 10 || event.charCode == 13)) { this.onSubmit({}); } } onSubmit = (event) => { if (event.preventDefault) event.preventDefault(); const input = this.fileinput.current; this.props.onSend({ mid: this.state.mid, rid: this.state.rid, body: this.state.body, attach: this.state.attach ? input.files[0] : '', to: this.state.to }) this.setState({ body: '', attach: '' }) } componentDidMount() { this.textarea.current.focus() } textChanged = (event) => { this.setState({ body: event.target.value }) const el = this.textarea.current; const offset = el.offsetHeight - el.clientHeight; const height = el.scrollHeight + offset; el.style.height = `${height + offset}px`; } attachmentChanged = (event) => { this.setState({ attach: event.target.value }) } openfile = () => { const input = this.fileinput.current; if (this.state.attach) { this.setState({ attach: '' }); } else { input.click(); } } render() { return (