Allow cursor to render at end of textbox to only place at end on new load, and bug fixes of cursor placement problems when selecting text and or moving cursor to left and typing

This commit is contained in:
crockwave 2020-05-08 17:14:07 -05:00
parent a9af3a8928
commit f1747f4425
5 changed files with 21 additions and 16 deletions

3
.gitignore vendored
View file

@ -6,5 +6,4 @@
/.eslintcache
/.env
/deploy.sh
/.vs/slnx.sqlite
/.vs/slnx.sqlite-journal
/.vs/

View file

@ -73,7 +73,7 @@ export const ensureComposeIsVisible = (getState, routerHistory) => {
}
};
export function changeCompose(text) {
export function changeCompose(text, caretPosition) {
return {
type: COMPOSE_CHANGE,
text: text,

View file

@ -74,7 +74,6 @@ export default class AutosuggestTextarea extends ImmutablePureComponent {
this.setState({ lastToken: null });
this.props.onSuggestionsClearRequested();
}
this.props.onChange(e);
}

View file

@ -44,6 +44,7 @@ class ComposeForm extends ImmutablePureComponent {
state = {
composeFocused: false,
caretPosition: 0,
}
static contextTypes = {
@ -86,6 +87,9 @@ class ComposeForm extends ImmutablePureComponent {
handleChange = (e) => {
this.props.onChange(e.target.value);
this.setState({
caretPosition: e.target.selectionStart,
});
}
handleComposeFocus = () => {
@ -180,23 +184,25 @@ class ComposeForm extends ImmutablePureComponent {
// - Replying to zero or one users, places the cursor at the end of the textbox.
// - Replying to more than one user, selects any usernames past the first;
// this provides a convenient shortcut to drop everyone else from the conversation.
//if (this.props.focusDate !== prevProps.focusDate) {
let selectionEnd, selectionStart;
let selectionEnd, selectionStart;
if (this.props.focusDate !== prevProps.focusDate) {
if (this.props.preselectDate !== prevProps.preselectDate) {
selectionEnd = this.props.text.length;
selectionEnd = this.props.text.length;
selectionStart = this.props.text.search(/\s/) + 1;
} else if (typeof this.props.caretPosition === 'number') {
selectionStart = this.props.caretPosition;
selectionEnd = this.props.caretPosition;
} else {
selectionEnd = this.props.text.length;
selectionStart = selectionEnd;
} else if (typeof this.state.caretPosition === 'number') {
selectionStart = this.state.caretPosition;
selectionEnd = this.state.caretPosition;
}
this.autosuggestTextarea.textarea.setSelectionRange(selectionStart, selectionEnd);
this.autosuggestTextarea.textarea.focus();
//}
} else {
if (this.props.preselectDate !== this.props.focusDate) {
selectionStart = selectionEnd = this.props.text.length + 1;
this.autosuggestTextarea.textarea.setSelectionRange(selectionStart, selectionEnd);
this.autosuggestTextarea.textarea.focus();
}
}
}
setAutosuggestTextarea = (c) => {

View file

@ -237,7 +237,8 @@ export default function compose(state = initialState, action) {
case COMPOSE_CHANGE:
return state
.set('text', action.text)
.set('idempotencyKey', uuid());
.set('idempotencyKey', uuid())
.set('focusDate', new Date());
case COMPOSE_COMPOSING_CHANGE:
return state.set('is_composing', action.value);
case COMPOSE_REPLY: