diff --git a/editor/edit-post/header/copy-content-button/index.js b/editor/edit-post/header/copy-content-button/index.js
deleted file mode 100644
index ed8045165bf038..00000000000000
--- a/editor/edit-post/header/copy-content-button/index.js
+++ /dev/null
@@ -1,51 +0,0 @@
-/**
- * External dependencies
- */
-import { connect } from 'react-redux';
-
-/**
- * WordPress dependencies
- */
-import { ClipboardButton } from '@wordpress/components';
-import { Component } from '@wordpress/element';
-import { __ } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
-import { getEditedPostContent } from '../../../store/selectors';
-
-class CopyContentButton extends Component {
- constructor() {
- super( ...arguments );
- this.state = { hasCopied: false };
- this.onCopy = this.onCopy.bind( this );
- this.onFinishCopy = this.onFinishCopy.bind( this );
- }
- onCopy() {
- this.setState( { hasCopied: true } );
- }
- onFinishCopy() {
- this.setState( { hasCopied: false } );
- }
- render() {
- return (
-
- { this.state.hasCopied ?
- __( 'Copied!' ) :
- __( 'Copy All Content' ) }
-
- );
- }
-}
-
-export default connect(
- ( state ) => ( {
- editedPostContent: getEditedPostContent( state ),
- } )
-)( CopyContentButton );
diff --git a/editor/edit-post/header/editor-actions/index.js b/editor/edit-post/header/editor-actions/index.js
index 43127de4faf22b..a1b424d262b12c 100644
--- a/editor/edit-post/header/editor-actions/index.js
+++ b/editor/edit-post/header/editor-actions/index.js
@@ -2,19 +2,17 @@
* WordPress dependencies
*/
import { MenuItemsGroup } from '@wordpress/components';
+import { applyFilters } from '@wordpress/hooks';
import { __ } from '@wordpress/i18n';
-/**
- * Internal dependencies
- */
-import CopyContentButton from '../copy-content-button';
-
export default function EditorActions() {
- return (
-
-
+ { tools }
- );
+ ) : null;
}
diff --git a/editor/hooks/copy-content/index.js b/editor/hooks/copy-content/index.js
new file mode 100644
index 00000000000000..14ba4851508620
--- /dev/null
+++ b/editor/hooks/copy-content/index.js
@@ -0,0 +1,38 @@
+/**
+ * WordPress dependencies
+ */
+import { ClipboardButton, withState } from '@wordpress/components';
+import { compose } from '@wordpress/element';
+import { query } from '@wordpress/data';
+import { addFilter } from '@wordpress/hooks';
+import { __ } from '@wordpress/i18n';
+
+function CopyContentButton( { editedPostContent, hasCopied, setState } ) {
+ return (
+ setState( { hasCopied: true } ) }
+ onFinishCopy={ () => setState( { hasCopied: false } ) }
+ >
+ { hasCopied ?
+ __( 'Copied!' ) :
+ __( 'Copy All Content' ) }
+
+ );
+}
+
+const Enhanced = compose(
+ query( ( select ) => ( {
+ editedPostContent: select( 'core/editor', 'getEditedPostContent' ),
+ } ) ),
+ withState( { hasCopied: false } )
+)( CopyContentButton );
+
+const buttonElement = ;
+
+addFilter(
+ 'editor.EditorActions.tools',
+ 'core/copy-content/button',
+ ( children ) => [ ...children, buttonElement ]
+);
diff --git a/editor/hooks/index.js b/editor/hooks/index.js
new file mode 100644
index 00000000000000..540437a892858f
--- /dev/null
+++ b/editor/hooks/index.js
@@ -0,0 +1,4 @@
+/**
+ * Internal dependencies
+ */
+import './copy-content';
diff --git a/editor/index.js b/editor/index.js
index 5e5f1115c3e65b..35fd38df7107f9 100644
--- a/editor/index.js
+++ b/editor/index.js
@@ -13,6 +13,7 @@ import { settings as dateSettings } from '@wordpress/date';
/**
* Internal dependencies
*/
+import './hooks';
import './assets/stylesheets/main.scss';
import Layout from './edit-post/layout';
import { EditorProvider, ErrorBoundary } from './components';
diff --git a/editor/store/index.js b/editor/store/index.js
index 8da2e29e19aa9e..ca951b7f99f7ba 100644
--- a/editor/store/index.js
+++ b/editor/store/index.js
@@ -12,7 +12,10 @@ import { withRehydratation, loadAndPersist } from './persist';
import enhanceWithBrowserSize from './mobile';
import applyMiddlewares from './middlewares';
import { BREAK_MEDIUM } from './constants';
-import { getEditedPostTitle } from './selectors';
+import {
+ getEditedPostContent,
+ getEditedPostTitle,
+} from './selectors';
/**
* Module Constants
@@ -26,6 +29,9 @@ const store = applyMiddlewares(
loadAndPersist( store, 'preferences', STORAGE_KEY, PREFERENCES_DEFAULTS );
enhanceWithBrowserSize( store, BREAK_MEDIUM );
-registerSelectors( MODULE_KEY, { getEditedPostTitle } );
+registerSelectors( MODULE_KEY, {
+ getEditedPostContent,
+ getEditedPostTitle,
+} );
export default store;