[Glitch] Scroll to compose form when focus

Port 8f3c32e29c to glitch-soc

Signed-off-by: Thibaut Girka <thib@sitedethib.com>
master
Jeong Arm 6 years ago committed by Thibaut Girka
parent 01aae33a5f
commit b32a62fe95
  1. 5
      app/javascript/flavours/glitch/components/autosuggest_textarea.js
  2. 11
      app/javascript/flavours/glitch/features/compose/components/compose_form.js

@ -138,8 +138,11 @@ export default class AutosuggestTextarea extends ImmutablePureComponent {
this.setState({ suggestionsHidden: true, focused: false });
}
onFocus = () => {
onFocus = (e) => {
this.setState({ focused: true });
if (this.props.onFocus) {
this.props.onFocus(e);
}
}
onSuggestionClick = (e) => {

@ -28,6 +28,10 @@ const messages = defineMessages({
export default @injectIntl
class ComposeForm extends ImmutablePureComponent {
setRef = c => {
this.composeForm = c;
};
static contextTypes = {
router: PropTypes.object,
};
@ -208,6 +212,10 @@ class ComposeForm extends ImmutablePureComponent {
}
}
handleFocus = () => {
this.composeForm.scrollIntoView();
}
// This statement does several things:
// - If we're beginning a reply, and,
// - Replying to zero or one users, places the cursor at the end
@ -302,7 +310,7 @@ class ComposeForm extends ImmutablePureComponent {
let disabledButton = isSubmitting || isUploading || isChangingUpload || (!text.trim().length && !anyMedia);
return (
<div className='composer'>
<div className='composer' ref={this.setRef}>
<WarningContainer />
<ReplyIndicatorContainer />
@ -337,6 +345,7 @@ class ComposeForm extends ImmutablePureComponent {
value={this.props.text}
onChange={this.handleChange}
suggestions={this.props.suggestions}
onFocus={this.handleFocus}
onKeyDown={this.handleKeyDown}
onSuggestionsFetchRequested={onFetchSuggestions}
onSuggestionsClearRequested={onClearSuggestions}

Loading…
Cancel
Save