Merge pull request #3202 from Automattic/update/editor-duplicating-ac…

…tions

Skyjumping Beavers && Post-editor add redux actions #2

client/post-editor/editor-featured-image/preview-container.jsx

@@ -3,19 +3,22 @@
  */
 import React, { PropTypes } from 'react';
 import defer from 'lodash/function/defer';
-
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
 /**
  * Internal dependencies
  */
 import MediaActions from 'lib/media/actions';
 import MediaStore from 'lib/media/store';
 import PostActions from 'lib/posts/actions';
 import EditorFeaturedImagePreview from './preview';
+import { setFeaturedImage } from 'state/ui/editor/post/actions';
 
-export default React.createClass( {
+const EditorFeaturedImagePreviewContainer = React.createClass( {
 	displayName: 'EditorFeaturedImagePreviewContainer',
 
 	propTypes: {
+		setFeaturedImage: PropTypes.func,
 		siteId: PropTypes.number.isRequired,
 		itemId: PropTypes.oneOfType( [
 			PropTypes.number,
@@ -24,6 +27,12 @@ export default React.createClass( {
 		maxWidth: PropTypes.number
 	},
 
+	getDefaultProps: function() {
+		return {
+			setFeaturedImage: () => {}
+		};
+	},
+
 	getInitialState: function() {
 		return {
 			image: null
@@ -70,9 +79,12 @@ export default React.createClass( {
 
 		defer( () => {
 			if ( image && image.ID !== this.props.itemId ) {
+				// TODO: REDUX - remove flux actions when whole post-editor is reduxified
 				PostActions.edit( {
 					featured_image: image.ID
 				} );
+
+				this.props.setFeaturedImage( image.ID );
 			}
 		} );
 	},
@@ -85,3 +97,8 @@ export default React.createClass( {
 		);
 	}
 } );
+
+export default connect(
+	null,
+	dispatch => bindActionCreators( { setFeaturedImage }, dispatch )
+)( EditorFeaturedImagePreviewContainer );

client/post-editor/editor-ground-control/index.jsx

@@ -1,33 +1,35 @@
 /**
  * External dependencies
  */
-var noop = require( 'lodash/utility/noop' ),
+const noop = require( 'lodash/utility/noop' ),
 	React = require( 'react' ),
 	PureRenderMixin = require( 'react-pure-render/mixin' );
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
 
 /**
  * Internal dependencies
  */
-var Card = require( 'components/card' ),
+const Card = require( 'components/card' ),
 	EditPostStatus = require( 'post-editor/edit-post-status' ),
 	Gridicon = require( 'components/gridicon' ),
 	Popover = require( 'components/popover' ),
 	Site = require( 'my-sites/site' ),
 	StatusLabel = require( 'post-editor/status-label' ),
 	postUtils = require( 'lib/posts/utils' ),
 	siteUtils = require( 'lib/site/utils' ),
-	Popover = require( 'components/popover' ),
 	PostSchedule = require( 'components/post-schedule' ),
 	postActions = require( 'lib/posts/actions' ),
 	Tooltip = require( 'components/tooltip' ),
 	PostListFetcher = require( 'components/post-list-fetcher' ),
 	stats = require( 'lib/posts/stats' );
+import { setDate } from 'state/ui/editor/post/actions';
 
 function isPostEmpty( props ) {
 	return ( props.isNew && ! props.isDirty ) || ! props.hasContent;
 }
 
-module.exports = React.createClass( {
+const EditorGroundControl = React.createClass( {
 	displayName: 'EditorGroundControl',
 	propTypes: {
 		hasContent: React.PropTypes.bool,
@@ -40,6 +42,7 @@ module.exports = React.createClass( {
 		onPublish: React.PropTypes.func,
 		onSaveDraft: React.PropTypes.func,
 		post: React.PropTypes.object,
+		setDate: React.PropTypes.func,
 		savedPost: React.PropTypes.object,
 		site: React.PropTypes.object,
 		type: React.PropTypes.string
@@ -59,6 +62,7 @@ module.exports = React.createClass( {
 			onSaveDraft: noop,
 			post: null,
 			savedPost: null,
+			setDate: () => {},
 			site: {}
 		};
 	},
@@ -74,7 +78,9 @@ module.exports = React.createClass( {
 	},
 
 	setPostDate: function( date ) {
+		// TODO: REDUX - remove flux actions when whole post-editor is reduxified
 		postActions.edit( { date: date ? date.format() : null } );
+		this.props.setDate( date );
 	},
 
 	setCurrentMonth: function( date ) {
@@ -402,3 +408,7 @@ module.exports = React.createClass( {
 	}
 } );
 
+export default connect(
+	null,
+	dispatch => bindActionCreators( { setDate }, dispatch )
+)( EditorGroundControl );

client/post-editor/editor-ground-control/test/index.jsx

@@ -50,9 +50,13 @@ describe( 'EditorGroundControl', function() {
 		mockery.registerMock( 'post-editor/status-label', MOCK_COMPONENT );
 		mockery.registerMock( 'components/sticky-panel', MOCK_COMPONENT );
 		mockery.registerMock( 'components/post-schedule', MOCK_COMPONENT );
-		EditorGroundControl = require( '../' );
+		EditorGroundControl = require( '../' ).WrappedComponent;
 		EditorGroundControl.prototype.__reactAutoBindMap.translate = sinon.stub().returnsArg( 0 );
 		EditorGroundControl.prototype.__reactAutoBindMap.moment = moment;
+		// TODO: REDUX - add proper tests when whole post-editor is reduxified
+		mockery.registerMock( 'react-redux', {
+			connect: () => component => component
+		} );
 	} );
 
 	beforeEach( function() {

client/post-editor/editor-location/index.jsx

@@ -1,27 +1,34 @@
 /**
  * External dependencies
  */
-var React = require( 'react' ),
+const React = require( 'react' ),
 	qs = require( 'querystring' );
 
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
+
 /**
  * Internal dependencies
  */
-var PostActions = require( 'lib/posts/actions' ),
+const PostActions = require( 'lib/posts/actions' ),
 	EditorDrawerWell = require( 'post-editor/editor-drawer-well' ),
 	Notice = require( 'components/notice' ),
 	stats = require( 'lib/posts/stats' ),
 	EditorLocationSearch = require( './search' );
 
+import { setLocation, removeLocation } from 'state/ui/editor/post/actions';
+
 /**
  * Module variables
  */
-var GOOGLE_MAPS_BASE_URL = 'http://maps.google.com/maps/api/staticmap?';
+const GOOGLE_MAPS_BASE_URL = 'http://maps.google.com/maps/api/staticmap?';
 
-module.exports = React.createClass( {
+const EditorLocation = React.createClass( {
 	displayName: 'EditorLocation',
 
 	propTypes: {
+		setLocation: React.PropTypes.func,
+		removeLocation: React.PropTypes.func,
 		label: React.PropTypes.string,
 		coordinates: function( props, propName ) {
 			var prop = props[ propName ];
@@ -31,6 +38,13 @@ module.exports = React.createClass( {
 		}
 	},
 
+	getDefaultProps: function() {
+		return {
+			setLocation: () => {},
+			removeLocation: () => {}
+		};
+	},
+
 	getInitialState: function() {
 		return {
 			error: null
@@ -42,12 +56,14 @@ module.exports = React.createClass( {
 			locating: false
 		} );
 
+		// TODO: REDUX - remove flux actions when whole post-editor is reduxified
 		PostActions.updateMetadata( {
 			geo_latitude: position.coords.latitude,
 			geo_longitude: position.coords.longitude
 		} );
 
 		stats.recordStat( 'location_geolocate_success' );
+		this.props.setLocation( position.coords.latitude, position.coords.longitude );
 	},
 
 	onGeolocateFailure: function( error ) {
@@ -82,7 +98,10 @@ module.exports = React.createClass( {
 	},
 
 	clear: function() {
+		// TODO: REDUX - remove flux actions when whole post-editor is reduxified
 		PostActions.deleteMetadata( [ 'geo_latitude', 'geo_longitude' ] );
+
+		this.props.removeLocation();
 	},
 
 	onSearchSelect: function( result ) {
@@ -143,3 +162,8 @@ module.exports = React.createClass( {
 		);
 	}
 } );
+
+export default connect(
+	null,
+	dispatch => bindActionCreators( { setLocation, removeLocation }, dispatch )
+)( EditorLocation );

client/post-editor/editor-page-order/index.jsx

@@ -4,20 +4,24 @@
 import React, { PropTypes } from 'react';
 import PureRenderMixin from 'react-pure-render/mixin';
 import isNaN from 'lodash/lang/isNaN';
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
 
 /**
  * Internal dependencies
  */
 import TextInput from 'components/forms/form-text-input';
 import postActions from 'lib/posts/actions';
 import { recordEvent, recordStat } from 'lib/posts/stats';
+import { setMenuOrder } from 'state/ui/editor/post/actions';
 
-export default React.createClass( {
+const EditorPageOrder = React.createClass( {
 	displayName: 'EditorPageOrder',
 
 	mixins: [ PureRenderMixin ],
 
 	propTypes: {
+		setMenuOrder: PropTypes.func,
 		menuOrder: PropTypes.oneOfType( [
 			PropTypes.number,
 			PropTypes.string
@@ -26,6 +30,7 @@ export default React.createClass( {
 
 	getDefaultProps() {
 		return {
+			setMenuOrder: () => {},
 			menuOrder: 0
 		};
 	},
@@ -55,9 +60,11 @@ export default React.createClass( {
 			recordStat( 'advanced_menu_order_changed' );
 			recordEvent( 'Changed page menu order' );
 
+			// TODO: REDUX - remove flux actions when whole post-editor is reduxified
 			postActions.edit( {
 				menu_order: newOrder
 			} );
+			this.props.setMenuOrder( newOrder );
 		}
 	},
 
@@ -72,3 +79,8 @@ export default React.createClass( {
 		);
 	}
 } );
+
+export default connect(
+	null,
+	dispatch => bindActionCreators( { setMenuOrder }, dispatch )
+)( EditorPageOrder );

client/post-editor/editor-page-parent/index.jsx

@@ -4,31 +4,43 @@
 import React, { PropTypes } from 'react';
 import PureRenderMixin from 'react-pure-render/mixin';
 import AccordionSection from 'components/accordion/section';
-
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
 /**
  * Internal dependencies
  */
 import PostSelector from 'my-sites/post-selector';
 import postActions from 'lib/posts/actions';
 import FormLabel from 'components/forms/form-label';
 import FormToggle from 'components/forms/form-toggle/compact';
+import { setPageParent } from 'state/ui/editor/post/actions';
 
-export default React.createClass( {
+const EditorPageParent = React.createClass( {
 	displayName: 'EditorPageParent',
 
 	mixins: [ PureRenderMixin ],
 
 	propTypes: {
+		setPageParent: PropTypes.func,
 		siteId: PropTypes.number,
 		parent: PropTypes.number,
 		postId: PropTypes.number
 	},
 
+	getDefaultProps: function() {
+		return {
+			setPageParent: () => {},
+		};
+	},
+
 	updatePageParent( item ) {
 		const parentId = item && item.ID ? item.ID : null;
+		// TODO: REDUX - remove flux actions when whole post-editor is reduxified
 		postActions.edit( {
 			parent: parentId
 		} );
+
+		this.props.setPageParent( parentId );
 	},
 
 	getEmptyMessage() {
@@ -67,3 +79,8 @@ export default React.createClass( {
 		);
 	}
 } );
+
+export default connect(
+	null,
+	dispatch => bindActionCreators( { setPageParent }, dispatch )
+)( EditorPageParent );

client/post-editor/editor-page-templates/index.jsx

@@ -3,6 +3,8 @@
  */
 import React, { PropTypes } from 'react';
 import find from 'lodash/collection/find';
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
 
 /**
  * Internal dependencies
@@ -11,17 +13,20 @@ import PostActions from 'lib/posts/actions';
 import AccordionSection from 'components/accordion/section';
 import SelectDropdown from 'components/select-dropdown';
 import DropdownItem from 'components/select-dropdown/item';
+import { setPageTemplate } from 'state/ui/editor/post/actions';
 
-export default React.createClass( {
+const EditorPageTemplates = React.createClass( {
 	displayName: 'EditorPageTemplates',
 
 	propTypes: {
 		post: PropTypes.object,
+		setPageTemplate: PropTypes.func,
 		pageTemplates: PropTypes.array.isRequired
 	},
 
 	getDefaultProps() {
 		return {
+			setPageTemplate: () => {},
 			pageTemplates: []
 		};
 	},
@@ -70,7 +75,9 @@ export default React.createClass( {
 	},
 
 	_selectTemplate( template ) {
+		// TODO: REDUX - remove flux actions when whole post-editor is reduxified
 		PostActions.edit( { page_template: template.file } );
+		this.props.setPageTemplate( template );
 	},
 
 	_getSelectedTemplateText() {
@@ -83,3 +90,8 @@ export default React.createClass( {
 	}
 
 } );
+
+export default connect(
+	null,
+	dispatch => bindActionCreators( { setPageTemplate }, dispatch )
+)( EditorPageTemplates );