Merge remote-tracking branch 'parent/main' into kb_development
This commit is contained in:
commit
991c0dfddf
63 changed files with 547 additions and 357 deletions
|
@ -1,4 +1,5 @@
|
|||
import PropTypes from 'prop-types';
|
||||
import { createRef } from 'react';
|
||||
|
||||
import { defineMessages, injectIntl } from 'react-intl';
|
||||
|
||||
|
@ -86,6 +87,11 @@ class ComposeForm extends ImmutablePureComponent {
|
|||
highlighted: false,
|
||||
};
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.textareaRef = createRef(null);
|
||||
}
|
||||
|
||||
handleChange = (e) => {
|
||||
this.props.onChange(e.target.value);
|
||||
};
|
||||
|
@ -109,10 +115,10 @@ class ComposeForm extends ImmutablePureComponent {
|
|||
};
|
||||
|
||||
handleSubmit = (e) => {
|
||||
if (this.props.text !== this.autosuggestTextarea.textarea.value) {
|
||||
if (this.props.text !== this.textareaRef.current.value) {
|
||||
// Something changed the text inside the textarea (e.g. browser extensions like Grammarly)
|
||||
// Update the state to match the current text
|
||||
this.props.onChange(this.autosuggestTextarea.textarea.value);
|
||||
this.props.onChange(this.textareaRef.current.value);
|
||||
}
|
||||
|
||||
if (!this.canSubmit()) {
|
||||
|
@ -191,26 +197,22 @@ class ComposeForm extends ImmutablePureComponent {
|
|||
// immediately selectable, we have to wait for observers to run, as
|
||||
// described in https://github.com/WICG/inert#performance-and-gotchas
|
||||
Promise.resolve().then(() => {
|
||||
this.autosuggestTextarea.textarea.setSelectionRange(selectionStart, selectionEnd);
|
||||
this.autosuggestTextarea.textarea.focus();
|
||||
this.textareaRef.current.setSelectionRange(selectionStart, selectionEnd);
|
||||
this.textareaRef.current.focus();
|
||||
this.setState({ highlighted: true });
|
||||
this.timeout = setTimeout(() => this.setState({ highlighted: false }), 700);
|
||||
}).catch(console.error);
|
||||
} else if(prevProps.isSubmitting && !this.props.isSubmitting) {
|
||||
this.autosuggestTextarea.textarea.focus();
|
||||
this.textareaRef.current.focus();
|
||||
} else if (this.props.spoiler !== prevProps.spoiler) {
|
||||
if (this.props.spoiler) {
|
||||
this.spoilerText.input.focus();
|
||||
} else if (prevProps.spoiler) {
|
||||
this.autosuggestTextarea.textarea.focus();
|
||||
this.textareaRef.current.focus();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
setAutosuggestTextarea = (c) => {
|
||||
this.autosuggestTextarea = c;
|
||||
};
|
||||
|
||||
setSpoilerText = (c) => {
|
||||
this.spoilerText = c;
|
||||
};
|
||||
|
@ -221,7 +223,7 @@ class ComposeForm extends ImmutablePureComponent {
|
|||
|
||||
handleEmojiPick = (data) => {
|
||||
const { text } = this.props;
|
||||
const position = this.autosuggestTextarea.textarea.selectionStart;
|
||||
const position = this.textareaRef.current.selectionStart;
|
||||
const needsSpace = data.custom && position > 0 && !allowedAroundShortCode.includes(text[position - 1]);
|
||||
|
||||
this.props.onPickEmoji(position, data, needsSpace);
|
||||
|
@ -276,7 +278,7 @@ class ComposeForm extends ImmutablePureComponent {
|
|||
|
||||
<div className={classNames('compose-form__highlightable', { active: highlighted })}>
|
||||
<AutosuggestTextarea
|
||||
ref={this.setAutosuggestTextarea}
|
||||
ref={this.textareaRef}
|
||||
placeholder={intl.formatMessage(messages.placeholder)}
|
||||
disabled={disabled}
|
||||
value={this.props.text}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue