When opening a page such as /web/timelines/home in a desktop browser, the cursor was automatically placed in the textarea of the compose form. When using the keyboard for navigation (using a browser plugin like vimium or vim vixen, or just to hit 'space' to scroll down a page), you have remember to leave the field before using that. Since you only visit the page to write a new post some of the time, this PR attempts to have nothing focused initially (and require the user to click or e.g. use 'tab' to focus the textarea). Tested: * /web/timeslines/home no longer autofocuses the compose box * pressing the 'n' hotkey still focuses the compose box * clicking 'reply' for a post still focuses the compose box * replying to a CW'ed post still focuses the compose box * introducing the CW field still focuses the CW field * introducing the CW field for a reply still focuses the CW field * removing the CW field still focuses the compose box * /web/statuses/new still autofocuses the compose box fixes #15862
67 lines
1.9 KiB
JavaScript
67 lines
1.9 KiB
JavaScript
import { connect } from 'react-redux';
|
|
import ComposeForm from '../components/compose_form';
|
|
import {
|
|
changeCompose,
|
|
submitCompose,
|
|
clearComposeSuggestions,
|
|
fetchComposeSuggestions,
|
|
selectComposeSuggestion,
|
|
changeComposeSpoilerText,
|
|
insertEmojiCompose,
|
|
uploadCompose,
|
|
} from '../../../actions/compose';
|
|
|
|
const mapStateToProps = state => ({
|
|
text: state.getIn(['compose', 'text']),
|
|
suggestions: state.getIn(['compose', 'suggestions']),
|
|
spoiler: state.getIn(['compose', 'spoiler']),
|
|
spoilerText: state.getIn(['compose', 'spoiler_text']),
|
|
privacy: state.getIn(['compose', 'privacy']),
|
|
focusDate: state.getIn(['compose', 'focusDate']),
|
|
caretPosition: state.getIn(['compose', 'caretPosition']),
|
|
preselectDate: state.getIn(['compose', 'preselectDate']),
|
|
isSubmitting: state.getIn(['compose', 'is_submitting']),
|
|
isEditing: state.getIn(['compose', 'id']) !== null,
|
|
isChangingUpload: state.getIn(['compose', 'is_changing_upload']),
|
|
isUploading: state.getIn(['compose', 'is_uploading']),
|
|
anyMedia: state.getIn(['compose', 'media_attachments']).size > 0,
|
|
isInReply: state.getIn(['compose', 'in_reply_to']) !== null,
|
|
});
|
|
|
|
const mapDispatchToProps = (dispatch) => ({
|
|
|
|
onChange (text) {
|
|
dispatch(changeCompose(text));
|
|
},
|
|
|
|
onSubmit (router) {
|
|
dispatch(submitCompose(router));
|
|
},
|
|
|
|
onClearSuggestions () {
|
|
dispatch(clearComposeSuggestions());
|
|
},
|
|
|
|
onFetchSuggestions (token) {
|
|
dispatch(fetchComposeSuggestions(token));
|
|
},
|
|
|
|
onSuggestionSelected (position, token, suggestion, path) {
|
|
dispatch(selectComposeSuggestion(position, token, suggestion, path));
|
|
},
|
|
|
|
onChangeSpoilerText (checked) {
|
|
dispatch(changeComposeSpoilerText(checked));
|
|
},
|
|
|
|
onPaste (files) {
|
|
dispatch(uploadCompose(files));
|
|
},
|
|
|
|
onPickEmoji (position, data, needsSpace) {
|
|
dispatch(insertEmojiCompose(position, data, needsSpace));
|
|
},
|
|
|
|
});
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(ComposeForm);
|