Merge pull request #43 from wordpress-mobile/feature/updated-from-gb-…

…master-with-more

Pulling in all the latest dev from the GB side

.babelrc

@@ -8,6 +8,8 @@
       "module-resolver",
       {
         "alias": {
+          "@wordpress/blocks": "./gutenberg/blocks",
+          "@wordpress/editor": "./gutenberg/editor",
           "@wordpress/element": "./gutenberg/element",
           "@wordpress/hooks": "./wordpress/hooks",
           "@wordpress/utils": "./gutenberg/utils",

.travis/travis-checks-js.sh

@@ -15,7 +15,6 @@ fi
 
 if [ "$CHECK_CORRECTNESS" = true ] ; then
   npm run flow || pFail
-  npm run prettier:check || pFail
   npm run lint || pFail
 fi
 

.vscode/settings.json

@@ -1,3 +1,9 @@
 {
-    "javascript.validate.enable": false
+    "javascript.validate.enable": false,
+
+    // Enable/disable default JavaScript formatter (For Prettier)
+    "javascript.format.enable": false,
+
+    // Use 'prettier-eslint' instead of 'prettier'. Other settings will only be fallbacks in case they could not be inferred from eslint rules.
+    "prettier.eslintIntegration": true,
 }

jest.config.js

@@ -3,8 +3,10 @@
 const defaultPlatform = 'android';
 const rnPlatform = process.env.TEST_RN_PLATFORM || defaultPlatform;
 if ( process.env.TEST_RN_PLATFORM ) {
+	// eslint-disable-next-line no-console
 	console.log( 'Setting RN platform to: ' + process.env.TEST_RN_PLATFORM );
 } else {
+	// eslint-disable-next-line no-console
 	console.log( 'Setting RN platform to: default (' + defaultPlatform + ')' );
 }
 
@@ -28,6 +30,8 @@ module.exports = {
 		'node',
 	],
 	moduleNameMapper: {
+		'@wordpress/blocks': '<rootDir>/gutenberg/blocks',
+		'@wordpress/editor': '<rootDir>/gutenberg/editor',
 		'@wordpress/element': '<rootDir>/gutenberg/element',
 		'@wordpress/hooks': '<rootDir>/wordpress/hooks',
 		'@wordpress/utils': '<rootDir>/gutenberg/utils',

libdefs.js

@@ -1,4 +1,7 @@
-/** @format */
+/**
+ * @format
+ * @flow
+ */
 
 declare module 'react-native' {
 	declare var exports: any;

package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "config": {
-    "jsfiles": "index.js src/*.js src/**/*.js",
+    "jsfiles": "./*.js src/*.js src/**/*.js",
     "scssfiles": "src/*.scss src/**/*.scss"
   },
   "devDependencies": {
@@ -41,22 +41,23 @@
     "test": "cross-env NODE_ENV=test node node_modules/jest/bin/jest.js --verbose --config jest.config.js",
     "test:debug": "cross-env NODE_ENV=test node --inspect-brk node_modules/jest/bin/jest.js --runInBand --verbose --config jest.config.js",
     "flow": "flow",
-    "prettier": "prettier --write $npm_package_config_jsfiles $npm_package_config_scssfiles",
-    "prettier:check": "prettier -l $npm_package_config_jsfiles $npm_package_config_scssfiles",
+    "prettier": "prettier-eslint --write $npm_package_config_jsfiles $npm_package_config_scssfiles",
     "clean": "yarn test --clearCache; watchman watch-del-all; rm -rf node_modules; rm -f yarn.lock; rm -rf $TMPDIR/react-*; rm -rf $TMPDIR/metro-cache-*; rm -rf $TMPDIR/jest_*",
     "clean:install": "yarn clean; yarn",
     "lint": "eslint $npm_package_config_jsfiles",
     "lint:fix": "eslint $npm_package_config_jsfiles --fix"
   },
   "dependencies": {
     "@wordpress/i18n": "^1.1.0",
+    "@wordpress/is-shallow-equal": "^1.0.1",
     "babel-plugin-module-resolver": "^3.1.0",
     "classnames": "^2.2.5",
     "jed": "^1.1.1",
     "js-beautify": "^1.7.5",
     "jsx-to-string": "^1.3.1",
     "memize": "^1.0.5",
     "node-sass": "^4.8.3",
+    "prettier-eslint": "^8.8.1",
     "react": "16.2.0",
     "react-native": "0.52.0",
     "react-native-recyclerview-list": "git+https://github.com/wordpress-mobile/react-native-recyclerview-list.git#bfccbaab6b5954e18f8b0ed441ba38275853b79c",

sass-transformer.js

@@ -78,7 +78,7 @@ function findVariant( name, extensions, includePaths ) {
 		const includePath = includePaths[ i ];
 
 		// try to find the file iterating through the extensions, in order.
-		const foundExtention = extensions.find( extension => {
+		const foundExtention = extensions.find( ( extension ) => {
 			const fname = includePath + '/' + name + extension;
 			return fs.existsSync( fname );
 		} );

src/app/App.test.js

@@ -17,7 +17,7 @@ describe( 'App', () => {
 		renderer
 			.create( <App /> )
 			.root.findAllByType( BlockHolder )
-			.forEach( blockHolder => {
+			.forEach( ( blockHolder ) => {
 				if ( 'core/code' === blockHolder.props.name ) {
 					// TODO: hardcoded indices are ugly and error prone. Can we do better here?
 					const blockHolderContainer = blockHolder.children[ 0 ].children[ 0 ].children[ 0 ];

src/app/AppContainer.js

@@ -9,7 +9,7 @@ import {
 } from '../store/actions';
 import MainApp from './MainApp';
 
-const mapStateToProps = state => ( {
+const mapStateToProps = ( state ) => ( {
 	...state,
 } );
 
@@ -19,16 +19,16 @@ const mapDispatchToProps = ( dispatch, ownProps ) => {
 		onChange: ( uid, attributes ) => {
 			dispatch( updateBlockAttributes( uid, attributes ) );
 		},
-		focusBlockAction: uid => {
+		focusBlockAction: ( uid ) => {
 			dispatch( focusBlockAction( uid ) );
 		},
-		moveBlockUpAction: uid => {
+		moveBlockUpAction: ( uid ) => {
 			dispatch( moveBlockUpAction( uid ) );
 		},
-		moveBlockDownAction: uid => {
+		moveBlockDownAction: ( uid ) => {
 			dispatch( moveBlockDownAction( uid ) );
 		},
-		deleteBlockAction: uid => {
+		deleteBlockAction: ( uid ) => {
 			dispatch( deleteBlockAction( uid ) );
 		},
 	};

src/block-management/block-holder.js

@@ -48,7 +48,7 @@ export default class BlockHolder extends React.Component<PropsType, StateType> {
 				<Block
 					attributes={ { ...this.props.attributes } }
 					// pass a curried version of onChanged with just one argument
-					setAttributes={ attrs => this.props.onChange( this.props.uid, attrs ) }
+					setAttributes={ ( attrs ) => this.props.onChange( this.props.uid, attrs ) }
 					isSelected={ this.props.focused }
 					style={ style }
 				/>

src/block-management/block-manager.js

@@ -80,7 +80,7 @@ export default class BlockManager extends React.Component<PropsType, StateType>
 
 	serializeToHtml() {
 		return this.props.blocks
-			.map( block => {
+			.map( ( block ) => {
 				const blockType = getBlockType( block.name );
 				if ( blockType ) {
 					return serialize( [ block ] ) + '\n\n';
@@ -113,7 +113,7 @@ export default class BlockManager extends React.Component<PropsType, StateType>
 		if ( Platform.OS === 'android' ) {
 			list = (
 				<RecyclerViewList
-					ref={ component => ( this._recycler = component ) }
+					ref={ ( component ) => ( this._recycler = component ) }
 					style={ styles.list }
 					dataSource={ this.state.dataSource }
 					renderItem={ this.renderItem.bind( this ) }
@@ -131,7 +131,7 @@ export default class BlockManager extends React.Component<PropsType, StateType>
 					style={ styles.list }
 					data={ this.props.blocks }
 					extraData={ this.props.refresh }
-					keyExtractor={ item => item.uid }
+					keyExtractor={ ( item ) => item.uid }
 					renderItem={ this.renderItem.bind( this ) }
 				/>
 			);
@@ -146,7 +146,7 @@ export default class BlockManager extends React.Component<PropsType, StateType>
 						activeText={ 'On' }
 						inActiveText={ 'Off' }
 						value={ this.state.showHtml }
-						onValueChange={ value => this.setState( { showHtml: value } ) }
+						onValueChange={ ( value ) => this.setState( { showHtml: value } ) }
 					/>
 				</View>
 				{ this.state.showHtml && <Text style={ styles.htmlView }>{ this.serializeToHtml() }</Text> }

src/store/index.js

@@ -4,8 +4,8 @@
  */
 
 // Gutenberg imports
-import { registerCoreBlocks } from '@gutenberg/blocks/library';
-import { createBlock } from '@gutenberg/blocks/api';
+import { registerCoreBlocks } from '@gutenberg/core-blocks';
+import { createBlock } from '@gutenberg/blocks';
 
 import { createStore } from 'redux';
 import { reducer } from './reducers';