Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[RMmobile] Add Enter.key detection to the Title block #13500

Merged
merged 3 commits into from
Jan 26, 2019
Merged

[RMmobile] Add Enter.key detection to the Title block #13500

Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
55feb8a
Intercept Enter.key and give the ability to add a new block after
daniloercoli Jan 24, 2019
e2346f1
Remove the custom mobile code, and use the default web implementation
daniloercoli Jan 25, 2019
92cc888
Merge branch 'master' of https://github.com/WordPress/gutenberg into …
daniloercoli Jan 26, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 17 additions & 2 deletions packages/editor/src/components/post-title/index.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,19 @@ import { withDispatch } from '@wordpress/data';
import { withFocusOutside } from '@wordpress/components';
import { withInstanceId, compose } from '@wordpress/compose';

import {
getDefaultBlockName,
createBlock,
} from '@wordpress/blocks';

class PostTitle extends Component {
constructor() {
super( ...arguments );

this.onChange = this.onChange.bind( this );
this.onSelect = this.onSelect.bind( this );
this.onUnselect = this.onUnselect.bind( this );
this.onEnter = this.onEnter.bind( this );

this.state = {
isSelected: false,
Expand All @@ -42,6 +48,14 @@ class PostTitle extends Component {
this.props.onUpdate( title );
}

onEnter( ) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We could remove this method entirely and instead copy (and call) this method from the web .js sources.

I've tried it locally and it works and it works.

The advantage of using the same code as the web .js file is that it should make it easier for us to maintain this sourcefile if there are changes, or eventually unify it completely.

const { insertBlocksAfter } = this.props;
if ( ! insertBlocksAfter ) {
return;
}
insertBlocksAfter( [ createBlock( getDefaultBlockName() ) ] );
}

render() {
const {
placeholder,
Expand All @@ -55,8 +69,9 @@ class PostTitle extends Component {
<TextInput
blurOnSubmit={ true }
textAlignVertical="top"
multiline
numberOfLines={ 0 }
multiline={ false }
onSubmitEditing={ this.onEnter }
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For the comment above to work, this would become onSubmitEditing={ this.props.onEnterPress }

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice find @diegoreymendez!

Tested here as well, and worked without problems 👍 I've updated this PR and main PR gb-mobile side.

returnKeyType={ 'next' }
onChangeText={ this.onChange }
onFocus={ this.onSelect }
placeholder={ decodedPlaceholder }
Expand Down