Refactor setupEditor effects to actions (#14513)

* refactor setupEditor effects to action-generator
* remove no longer needed redux-multi dependency/usage
* add changelog entry
* update docs

docs/designers-developers/developers/data/data-core-editor.md

@@ -734,7 +734,7 @@ The editor settings object.
 
 ### setupEditor
 
-Returns an action object used in signalling that editor has initialized with
+Returns an action generator used in signalling that editor has initialized with
 the specified post object and editor settings.
 
 *Parameters*

packages/editor/CHANGELOG.md

@@ -1,3 +1,10 @@
+## 9.1.1 (Unreleased)
+
+### Internal
+
+- Refactor setupEditor effects to action-generator using controls ([#14513](https://github.com/WordPress/gutenberg/pull/14513))
+- Remove redux-multi dependency (no longer needed/used with above refactor)
+
 ## 9.1.0 (2019-03-06)
 
 ### New Features

packages/editor/package.json

@@ -47,7 +47,6 @@
 		"lodash": "^4.17.11",
 		"memize": "^1.0.5",
 		"react-autosize-textarea": "^3.0.2",
-		"redux-multi": "^0.1.12",
 		"redux-optimist": "^1.0.0",
 		"refx": "^3.0.0",
 		"rememo": "^3.0.0",

packages/editor/src/store/actions.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { castArray, pick } from 'lodash';
+import { castArray, pick, has } from 'lodash';
 import { BEGIN, COMMIT, REVERT } from 'redux-optimist';
 
 /**
@@ -26,22 +26,49 @@ import {
 } from './utils/notice-builder';
 
 /**
- * Returns an action object used in signalling that editor has initialized with
+ * WordPress dependencies
+ */
+import {
+	parse,
+	synchronizeBlocksWithTemplate,
+} from '@wordpress/blocks';
+
+/**
+ * Returns an action generator used in signalling that editor has initialized with
  * the specified post object and editor settings.
  *
  * @param {Object} post      Post object.
  * @param {Object} edits     Initial edited attributes object.
  * @param {Array?} template  Block Template.
- *
- * @return {Object} Action object.
  */
-export function setupEditor( post, edits, template ) {
-	return {
+export function* setupEditor( post, edits, template ) {
+	yield {
 		type: 'SETUP_EDITOR',
 		post,
 		edits,
 		template,
 	};
+
+	// In order to ensure maximum of a single parse during setup, edits are
+	// included as part of editor setup action. Assume edited content as
+	// canonical if provided, falling back to post.
+	let content;
+	if ( has( edits, [ 'content' ] ) ) {
+		content = edits.content;
+	} else {
+		content = post.content.raw;
+	}
+
+	let blocks = parse( content );
+
+	// Apply a template for new posts only, if exists.
+	const isNewPost = post.status === 'auto-draft';
+	if ( isNewPost && template ) {
+		blocks = synchronizeBlocksWithTemplate( blocks, template );
+	}
+
+	yield resetEditorBlocks( blocks );
+	yield setupEditorState( post );
 }
 
 /**

packages/editor/src/store/effects.js

@@ -1,23 +1,6 @@
-/**
- * External dependencies
- */
-import { has } from 'lodash';
-
-/**
- * WordPress dependencies
- */
-import {
-	parse,
-	synchronizeBlocksWithTemplate,
-} from '@wordpress/blocks';
-
 /**
  * Internal dependencies
  */
-import {
-	setupEditorState,
-	resetEditorBlocks,
-} from './actions';
 import {
 	fetchReusableBlocks,
 	saveReusableBlocks,
@@ -28,32 +11,6 @@ import {
 } from './effects/reusable-blocks';
 
 export default {
-	SETUP_EDITOR( action ) {
-		const { post, edits, template } = action;
-
-		// In order to ensure maximum of a single parse during setup, edits are
-		// included as part of editor setup action. Assume edited content as
-		// canonical if provided, falling back to post.
-		let content;
-		if ( has( edits, [ 'content' ] ) ) {
-			content = edits.content;
-		} else {
-			content = post.content.raw;
-		}
-
-		let blocks = parse( content );
-
-		// Apply a template for new posts only, if exists.
-		const isNewPost = post.status === 'auto-draft';
-		if ( isNewPost && template ) {
-			blocks = synchronizeBlocksWithTemplate( blocks, template );
-		}
-
-		return [
-			resetEditorBlocks( blocks ),
-			setupEditorState( post ),
-		];
-	},
 	FETCH_REUSABLE_BLOCKS: ( action, store ) => {
 		fetchReusableBlocks( action, store );
 	},

packages/editor/src/store/middlewares.js

@@ -2,8 +2,6 @@
  * External dependencies
  */
 import refx from 'refx';
-import multi from 'redux-multi';
-import { flowRight } from 'lodash';
 
 /**
  * Internal dependencies
@@ -18,25 +16,19 @@ import effects from './effects';
  * @return {Object} Update Store Object.
  */
 function applyMiddlewares( store ) {
-	const middlewares = [
-		refx( effects ),
-		multi,
-	];
-
 	let enhancedDispatch = () => {
 		throw new Error(
 			'Dispatching while constructing your middleware is not allowed. ' +
 			'Other middleware would not be applied to this dispatch.'
 		);
 	};
-	let chain = [];
 
 	const middlewareAPI = {
 		getState: store.getState,
 		dispatch: ( ...args ) => enhancedDispatch( ...args ),
 	};
-	chain = middlewares.map( ( middleware ) => middleware( middlewareAPI ) );
-	enhancedDispatch = flowRight( ...chain )( store.dispatch );
+
+	enhancedDispatch = refx( effects )( middlewareAPI )( store.dispatch );
 
 	store.dispatch = enhancedDispatch;
 	return store;

packages/editor/src/store/test/actions.js

@@ -625,16 +625,35 @@ describe( 'Post generator actions', () => {
 	} );
 } );
 
-describe( 'actions', () => {
-	describe( 'setupEditor', () => {
-		it( 'should return the SETUP_EDITOR action', () => {
-			const post = {};
-			const result = actions.setupEditor( post );
-			expect( result ).toEqual( {
-				type: 'SETUP_EDITOR',
+describe( 'Editor actions', () => {
+	describe( 'setupEditor()', () => {
+		let fulfillment;
+		const reset = ( post, edits, template ) => fulfillment = actions
+			.setupEditor(
 				post,
+				edits,
+				template,
+			);
+		it( 'should yield the SETUP_EDITOR action', () => {
+			reset( { content: { raw: '' }, status: 'publish' } );
+			const { value } = fulfillment.next();
+			expect( value ).toEqual( {
+				type: 'SETUP_EDITOR',
+				post: { content: { raw: '' }, status: 'publish' },
 			} );
 		} );
+		it( 'should yield action object for resetEditorBlocks', () => {
+			const { value } = fulfillment.next();
+			expect( value ).toEqual( actions.resetEditorBlocks( [] ) );
+		} );
+		it( 'should yield action object for setupEditorState', () => {
+			const { value } = fulfillment.next();
+			expect( value ).toEqual(
+				actions.setupEditorState(
+					{ content: { raw: '' }, status: 'publish' }
+				)
+			);
+		} );
 	} );
 
 	describe( 'resetPost', () => {